← Commit history

ralph: touch targets

John Lauer ·b0bffac8f2 ·1mo ago ·parent a9b78bf
2 files changed +14
bin/fusion-dashboard
⋯ 1 unchanged line ⋯
dashboard/ui/index.html+14
@@ -82,6 +82,20 @@ dialog:focus,dialog:focus-visible{outline:none} .toggle.is-on{background:var(--accent);border-color:var(--accent)} .toggle.is-on::after{left:21px;background:#05221f} @media (max-width:720px){.meta{display:none}.grid{grid-template-columns:1fr 1fr}}+/* Touch targets: the responsive-ui contract is 44x44 minimum on touch. Applied for coarse+   pointers AND at phone width - pointer:coarse cannot be emulated in the ralph harness, so a+   coarse-only rule is untestable and would ship unverified (ralph, 2026-08-18). Desktop keeps+   its compact 32-36px controls above 600px. */+@media (hover:none),(pointer:coarse),(max-width:600px){+  .btn{min-height:44px;padding:0 16px}+  .iconbtn{width:44px;height:44px}+  .tpill{min-height:44px;padding:10px 16px}+  .xbtn{width:44px;height:44px}+  .toggle{width:52px;height:30px}+  .toggle::after{width:24px;height:24px}+  .toggle.is-on::after{left:25px}+  .copy{min-height:44px}+} @media (max-width:480px){.grid{grid-template-columns:1fr}.brand span{display:none}.subject{display:none}.vsep{display:none}header{gap:8px}} #tt{position:fixed;z-index:99999;background:var(--overlay);border:1px solid var(--border);border-radius:8px;padding:6px 10px;font-size:12.5px;color:var(--text-body);max-width:260px;pointer-events:none;opacity:0;transform:translateY(3px);transition:opacity .18s ease,transform .18s ease;text-transform:none} #tt.show{opacity:1;transform:none}