fix: stabilize calculator display sizing

This commit is contained in:
2026-05-16 02:02:45 +02:00
parent d8d0556822
commit 6c8c032f7a
+13 -22
View File
@@ -109,32 +109,37 @@ body {
color: var(--displayText);
font-family: "Courier New", monospace;
overflow: hidden;
height: auto;
min-height: clamp(112px, 18vw, 124px);
max-height: none;
box-sizing: border-box;
height: 138px;
min-height: 138px;
max-height: 138px;
margin-bottom: 0;
}
.display-grid {
height: 100%;
display: grid;
grid-template-columns: 1fr;
grid-template-rows: repeat(4, minmax(0, 1fr));
grid-template-rows: repeat(4, minmax(0, auto));
align-content: start;
gap: 2px;
}
.stack-cell {
display: grid;
grid-template-columns: 2.2ch 1fr auto;
grid-template-columns: 2.2ch minmax(0, 1fr) auto;
align-items: center;
gap: 12px;
font-size: clamp(18px, 3vw, 30px);
font-size: 20px;
line-height: 1;
min-height: 0;
padding-block: 0;
}
.stack-label {
text-align: right;
opacity: 0.78;
@@ -147,8 +152,10 @@ body {
text-overflow: ellipsis;
text-align: right;
justify-self: end;
font-size: 20px;
}
.display-buttons-panel {
grid-area: display-buttons;
padding: 8px;
@@ -387,22 +394,6 @@ button:active {
padding-inline: 6px;
}
@media (max-width: 700px) {
.key-enter {
padding-inline: 4px;
letter-spacing: 0.01em;
}
.display-button-symbol {
min-width: 1.28em;
font-size: 1.3em;
}
.display-buttons-grid > button {
padding: 6px 8px;
}
}
.hidden-input {
position: absolute;
left: -9999px;