Skip to content

Commit b5d7d1b

Browse files
committed
fix: increase touch-screen spacing for settings rows and slider thumbs
Use @media (pointer: coarse) to widen row margins, add min-height, and enlarge slider thumbs/tracks on touch devices — prevents accidental slider activation when tapping nearby controls.
1 parent 672ce2e commit b5d7d1b

5 files changed

Lines changed: 32 additions & 0 deletions

File tree

src/ui/DopplerWindow.svelte

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1024,6 +1024,10 @@
10241024
}
10251025
.row:last-child { margin-bottom: 0; }
10261026
.row label { color: var(--text-dim); font-size: 12px; }
1027+
@media (pointer: coarse) {
1028+
.row { margin-bottom: 10px; min-height: 32px; }
1029+
.section-header { margin: 14px 0 8px; }
1030+
}
10271031
.rig-mode-btns { display: flex; gap: 2px; }
10281032
.offset-row {
10291033
display: flex;

src/ui/FeedbackWindow.svelte

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -139,6 +139,10 @@
139139
margin-bottom: 6px;
140140
}
141141
.row label { color: var(--text-dim); font-size: 12px; }
142+
@media (pointer: coarse) {
143+
.row { margin-bottom: 10px; min-height: 32px; }
144+
.section-header { margin: 14px 0 8px; }
145+
}
142146
.toys-panel {
143147
border: 1px solid var(--border);
144148
border-radius: 3px;

src/ui/RotatorWindow.svelte

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1529,6 +1529,10 @@
15291529
}
15301530
.row:last-child { margin-bottom: 0; }
15311531
.row label { color: var(--text-dim); font-size: 12px; }
1532+
@media (pointer: coarse) {
1533+
.row { margin-bottom: 10px; min-height: 32px; }
1534+
.section-header { margin: 14px 0 8px; }
1535+
}
15321536
.unit { color: var(--text-ghost); font-size: 11px; }
15331537
:global(.rot-url) { width: 160px; }
15341538
.guide-details {

src/ui/SettingsWindow.svelte

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -381,4 +381,10 @@
381381
margin: -6px 0 8px;
382382
}
383383
384+
/* Touch-friendly spacing */
385+
@media (pointer: coarse) {
386+
.row { margin-bottom: 10px; min-height: 32px; }
387+
.section-header { margin: 14px 0 8px; }
388+
}
389+
384390
</style>

src/ui/shared/Slider.svelte

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -70,4 +70,18 @@
7070
7171
.slider:hover::-webkit-slider-thumb { background: var(--text); }
7272
.slider:hover::-moz-range-thumb { background: var(--text); }
73+
74+
/* Touch-friendly sizing */
75+
@media (pointer: coarse) {
76+
.slider-row { gap: 8px; margin: 8px 0 10px; }
77+
.slider-xs { height: 3px; }
78+
.slider-xs::-webkit-slider-thumb { width: 14px; height: 14px; border-radius: 50%; }
79+
.slider-xs::-moz-range-thumb { width: 14px; height: 14px; border-radius: 50%; }
80+
.slider-sm { height: 4px; }
81+
.slider-sm::-webkit-slider-thumb { width: 16px; height: 16px; border-radius: 50%; }
82+
.slider-sm::-moz-range-thumb { width: 16px; height: 16px; border-radius: 50%; }
83+
.slider-md { height: 5px; }
84+
.slider-md::-webkit-slider-thumb { width: 20px; height: 20px; border-radius: 50%; }
85+
.slider-md::-moz-range-thumb { width: 20px; height: 20px; border-radius: 50%; }
86+
}
7387
</style>

0 commit comments

Comments
 (0)