fix(calc-02): adjust display button layout and enter key spacing

This commit is contained in:
2026-05-16 01:28:30 +02:00
parent 54797f9dd9
commit 1e703bebe8
2 changed files with 10 additions and 25 deletions
+9 -24
View File
@@ -75,8 +75,7 @@ body {
.display-buttons-panel,
.keypad-panel,
.functions-panel,
.trigo-panel,
.status-line {
.trigo-panel {
border-radius: 8px;
border: 1px solid rgba(255, 255, 255, 0.06);
background: rgba(6, 10, 16, 0.16);
@@ -108,10 +107,6 @@ body {
margin-bottom: 0;
}
.display-frame {
margin: 0;
padding: 0;
}
.display-grid {
height: 100%;
@@ -169,14 +164,7 @@ body {
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.18), 0 3px 0 rgba(0, 0, 0, 0.28);
}
.display-button-offset {
grid-column-start: 2;
}
.display-button-spacer {
opacity: 0;
pointer-events: none;
}
.mode-menu {
position: fixed;
@@ -303,18 +291,12 @@ button:hover {
filter: brightness(1.06);
}
.display-button:hover {
filter: brightness(1.08);
}
button:active {
transform: translateY(2px);
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08), 0 1px 0 rgba(0, 0, 0, 0.25);
}
.display-button:active {
transform: translateY(2px);
}
.stack-copy-button {
padding: 4px;
@@ -376,11 +358,6 @@ button:active {
color: #eef2f7;
}
.key-alt {
background: linear-gradient(180deg, var(--btnAltTop), var(--btnAltBottom));
color: #eef2f7;
}
.key-danger {
background: linear-gradient(180deg, var(--btnDangerTop), var(--btnDangerBottom));
color: #eef2f7;
@@ -389,6 +366,14 @@ button:active {
.key-enter {
background: linear-gradient(180deg, var(--btnEnterTop), var(--btnEnterBottom));
color: #eef2f7;
padding-inline: 6px;
}
@media (max-width: 700px) {
.key-enter {
padding-inline: 4px;
letter-spacing: 0.01em;
}
}
.hidden-input {
+1 -1
View File
@@ -29,10 +29,10 @@
<button id="pasteButton" class="display-button"></button>
<button id="upButton" class="display-button"></button>
<button id="constButton" class="display-button">π</button>
<div class="display-button-spacer"></div>
<button id="leftButton" class="display-button display-button-offset"></button>
<button id="downButton" class="display-button"></button>
<button id="rightButton" class="display-button"></button>
<div class="display-button-spacer"></div>
</div>
</div>