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); color: var(--displayText);
font-family: "Courier New", monospace; font-family: "Courier New", monospace;
overflow: hidden; overflow: hidden;
height: auto; box-sizing: border-box;
min-height: clamp(112px, 18vw, 124px); height: 138px;
max-height: none; min-height: 138px;
max-height: 138px;
margin-bottom: 0; margin-bottom: 0;
} }
.display-grid { .display-grid {
height: 100%; height: 100%;
display: grid; display: grid;
grid-template-columns: 1fr; 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; gap: 2px;
} }
.stack-cell { .stack-cell {
display: grid; display: grid;
grid-template-columns: 2.2ch 1fr auto; grid-template-columns: 2.2ch minmax(0, 1fr) auto;
align-items: center; align-items: center;
gap: 12px; gap: 12px;
font-size: clamp(18px, 3vw, 30px); font-size: 20px;
line-height: 1; line-height: 1;
min-height: 0; min-height: 0;
padding-block: 0; padding-block: 0;
} }
.stack-label { .stack-label {
text-align: right; text-align: right;
opacity: 0.78; opacity: 0.78;
@@ -147,8 +152,10 @@ body {
text-overflow: ellipsis; text-overflow: ellipsis;
text-align: right; text-align: right;
justify-self: end; justify-self: end;
font-size: 20px;
} }
.display-buttons-panel { .display-buttons-panel {
grid-area: display-buttons; grid-area: display-buttons;
padding: 8px; padding: 8px;
@@ -387,22 +394,6 @@ button:active {
padding-inline: 6px; 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 { .hidden-input {
position: absolute; position: absolute;
left: -9999px; left: -9999px;