Skip to content

Commit fe81e4a

Browse files
committed
fix(gui): vertically center switch knob in track
1 parent 7750806 commit fe81e4a

1 file changed

Lines changed: 6 additions & 3 deletions

File tree

‎gui/src/styles.css‎

Lines changed: 6 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -417,21 +417,24 @@ select.input { appearance: none; }
417417
flex-shrink: 0;
418418
transition: background 0.15s, border-color 0.15s;
419419
padding: 0;
420+
appearance: none;
421+
-webkit-appearance: none;
420422
}
421423
.switch.on { background: var(--accent); border-color: var(--accent); }
422424
.switch:disabled { opacity: 0.6; cursor: default; }
423425
.switch .knob {
424426
position: absolute;
425-
top: 2px;
427+
top: 50%;
426428
left: 2px;
427429
width: 15px;
428430
height: 15px;
429431
border-radius: 50%;
430432
background: light-dark(#ffffff, #ececec);
431433
box-shadow: 0 1px 2px rgba(16, 24, 40, 0.3);
432-
transition: left 0.15s, background 0.15s;
434+
transform: translateY(-50%);
435+
transition: left 0.15s, background 0.15s, transform 0.15s;
433436
}
434-
.switch.on .knob { left: 17px; background: var(--accent-ink); }
437+
.switch.on .knob { left: 17px; background: var(--accent-ink); transform: translateY(-50%); }
435438

436439
/* ---- misc ---- */
437440
.muted { color: var(--muted); }

0 commit comments

Comments
 (0)