openvibers/openvibe.news Commits

Touch targets on phones (fleet audit) (#141)

OP OpenVibers committed 14 days ago · d58f69d35a · 2 files, +20 −2

* Touch targets on phones (fleet audit)

* Touch targets on phones (fleet audit): raise the CSS budgets for the phone rules

cssRawKB 38 -> 38.5 and cssBrotliKB 8 -> 8.5: the touch-pointer rules (44px FAQ summaries and the wider hit areas for the topics, latest, More, live and wire links) grow news.css by 0.5 KB raw and 0.2 KB brotli.

Changes

ddiff --git a/public/css/news.css b/public/css/news.css
iindex 8778071..a7661a0 100644
---- a/public/css/news.css
++++ b/public/css/news.css
@@@ -132,3 +132,21 @@ body.news-home .page { max-width: 1120px; }
    .nh-wire .wire-list > li:nth-child(n+5) { display: none; }
    .nh-topics > li:nth-child(n+7) { display: none; }
  }
++
++/* Touch targets on phones (fleet audit, 2026-10-29): touch pointers only. */
++@media (pointer: coarse) {
++  .nh-faq summary { min-height: 44px; }
++  .nh-topics a { position: relative; display: inline-block; }
++  .nh-topics a::after { content: ''; position: absolute; left: 0; right: 0; top: -12px; bottom: -12px; }
++  .nh-latest a { position: relative; display: inline-block; }
++  .nh-latest a::after { content: ''; position: absolute; left: 0; right: 0; top: -3px; bottom: -3px; }
++  .nh-more a:only-child { position: relative; display: inline-block; }
++  .nh-more a:only-child::after { content: ''; position: absolute; left: 0; right: 0; top: -12px; bottom: -12px; }
++  .nh-live a { position: relative; display: inline-block; }
++  .nh-live a::after { content: ''; position: absolute; left: 0; right: 0; top: -13px; bottom: -13px; }
++  .nh-card h3 a { display: inline-block; min-height: 44px; }
++  .wire-lead a { position: relative; display: inline-block; }
++  .wire-lead a::after { content: ''; position: absolute; left: 0; right: 0; top: -12px; bottom: -12px; }
++  section.wire > a { position: relative; display: inline-block; }
++  section.wire > a::after { content: ''; position: absolute; left: 0; right: 0; top: -12px; bottom: -12px; }
++}
ddiff --git a/test/perf-budget.test.js b/test/perf-budget.test.js
iindex 98139c4..3aea893 100644
---- a/test/perf-budget.test.js
++++ b/test/perf-budget.test.js
@@@ -18,8 +18,8 @@ const BUDGETS = {
      jsRawKB: 308,   // 307.8 with openvibe-shared 4.43.0 (room.css carries the kit tokens, 4.39.1; the kit's 4.39.0 rules); 300.5 openvibe-shared 4.25.0: the menu's orb beside the brand, both balances on phones, messages, the account sheet on phones and the bar stepping away on phones; 293 openvibe-shared 4.22.0: the navbar's magnifier search button and More dropdown (search.js and loading.js load only when used); 287.2 Shared 4.17.0: OpenCoins and Vibes chips (wallet: true) in the navbar; 273.2 openvibe-shared 4.15 footer: the compact footer opens into the whole one, and the pulse line; 263.4 with shared 4.11.0's seasonal navbar; 254.1 with openvibe-shared 4.9.0 (status text twins in every theme, 2026-10-23); 246.2 with openvibe-shared 4.2.x (Ask Actor in the navbar, 2026-10-15); 239.1 (212.2 before openvibe-shared/shell's web-runtime.js)
      jsBrotliKB: 77,   // 76.1 with openvibe-shared 4.43.0 (room.css carries the kit tokens, 4.39.1; the kit's 4.39.0 rules); 74.2 openvibe-shared 4.25.0: the menu's orb beside the brand, both balances on phones, messages, the account sheet on phones and the bar stepping away on phones; 70.5 Shared 4.17.0: OpenCoins and Vibes chips (wallet: true) in the navbar; 67.9 openvibe-shared 4.15 footer: the compact footer opens into the whole one, and the pulse line; 65.3 Shared 4.12.0: the light/dark switch, the seasonal mark and the theme pairs; 61.7 with shared 4.11.0's seasonal navbar; 59.1 with openvibe-shared 4.4.0 (every site in the launcher, 2026-10-17); 56.3 (49.9 before web-runtime.js)
      cssFiles: 2,   // 2 (news.css + showcase.css, home page 1 only)
--    cssRawKB: 38,   // 33.6 openvibe-shared 4.26.1 (hero visual); 28.1 with Shared 4.13.0 (2026-10-26); 22.2 on 2026-10-22 (the front page's numbers, brief cards, topics, outlets, questions and links); 18.2 with the front page aligned to the showcase (2026-10-15); 15.5 (5.2 before showcase.css)
--    cssBrotliKB: 8,   // 6.2 with Shared 4.13.0 (2026-10-26); 5.2 (2026-10-22); 3.9 (1.4 before showcase.css)
++    cssRawKB: 38.5,   // 38.5 touch targets on phones (2026-10-29); 33.6 openvibe-shared 4.26.1 (hero visual); 28.1 with Shared 4.13.0 (2026-10-26); 22.2 on 2026-10-22 (the front page's numbers, brief cards, topics, outlets, questions and links); 18.2 with the front page aligned to the showcase (2026-10-15); 15.5 (5.2 before showcase.css)
++    cssBrotliKB: 8.5,   // 8.2 touch targets on phones (2026-10-29); 6.2 with Shared 4.13.0 (2026-10-26); 5.2 (2026-10-22); 3.9 (1.4 before showcase.css)
      externalFiles: 1,   // 0
  };