From 25d8188970523938c51f9e752f1508fd120e7b2d Mon Sep 17 00:00:00 2001 From: Federico Jaramillo Martinez Date: Sun, 7 Jun 2026 12:52:21 +0200 Subject: [PATCH] fix(docs): keep mobile header controls visible --- .changeset/mobile-docs-header-controls.md | 5 +++ docs/404.html | 40 ++++++++++--------- docs/faq.html | 40 ++++++++++--------- docs/index.html | 40 ++++++++++--------- docs/install.html | 40 ++++++++++--------- docs/machines.html | 40 ++++++++++--------- docs/plugins.html | 40 ++++++++++--------- docs/remote-first.html | 40 ++++++++++--------- docs/styles.css | 47 +++++++++++++++-------- 9 files changed, 189 insertions(+), 143 deletions(-) create mode 100644 .changeset/mobile-docs-header-controls.md diff --git a/.changeset/mobile-docs-header-controls.md b/.changeset/mobile-docs-header-controls.md new file mode 100644 index 0000000..caaf056 --- /dev/null +++ b/.changeset/mobile-docs-header-controls.md @@ -0,0 +1,5 @@ +--- +"@jmfederico/pi-web": patch +--- + +Keep the documentation site's GitHub and theme controls visible in mobile portrait layouts. diff --git a/docs/404.html b/docs/404.html index 766b4f1..069a501 100644 --- a/docs/404.html +++ b/docs/404.html @@ -28,24 +28,28 @@ diff --git a/docs/faq.html b/docs/faq.html index ba14122..6aa14e5 100644 --- a/docs/faq.html +++ b/docs/faq.html @@ -27,24 +27,28 @@ diff --git a/docs/index.html b/docs/index.html index ef9505d..be0d922 100644 --- a/docs/index.html +++ b/docs/index.html @@ -34,24 +34,28 @@ diff --git a/docs/install.html b/docs/install.html index 9644398..67b37ce 100644 --- a/docs/install.html +++ b/docs/install.html @@ -27,24 +27,28 @@ diff --git a/docs/machines.html b/docs/machines.html index f4e5de2..f327fad 100644 --- a/docs/machines.html +++ b/docs/machines.html @@ -30,24 +30,28 @@ diff --git a/docs/plugins.html b/docs/plugins.html index ea29827..b7e9f0c 100644 --- a/docs/plugins.html +++ b/docs/plugins.html @@ -27,24 +27,28 @@ diff --git a/docs/remote-first.html b/docs/remote-first.html index b864c69..c0651a7 100644 --- a/docs/remote-first.html +++ b/docs/remote-first.html @@ -30,24 +30,28 @@ diff --git a/docs/styles.css b/docs/styles.css index 3660062..d622208 100644 --- a/docs/styles.css +++ b/docs/styles.css @@ -197,16 +197,29 @@ video { background: var(--brand-2); } -.nav-links { +.nav-links, +.nav-pages, +.nav-actions { display: flex; align-items: center; gap: 6px; min-width: 0; +} + +.nav-links { color: var(--muted); font-size: 0.95rem; white-space: nowrap; } +.nav-pages { + flex: 0 1 auto; +} + +.nav-actions { + flex: 0 0 auto; +} + .nav-links a, .theme-toggle { display: inline-flex; @@ -1081,19 +1094,23 @@ html[data-theme="light"] .comment { } .nav-links { - flex-wrap: nowrap; - overflow-x: auto; + overflow: visible; width: 100%; + } + + .nav-pages { + flex: 1 1 auto; + overflow-x: auto; padding-bottom: 2px; scrollbar-width: none; -webkit-overflow-scrolling: touch; } - .nav-links a:not(.github-link) { + .nav-pages a { flex: 0 0 auto; } - .nav-links::-webkit-scrollbar { + .nav-pages::-webkit-scrollbar { display: none; } @@ -1103,26 +1120,22 @@ html[data-theme="light"] .comment { padding: 0 10px; } - .nav-links .github-link, - .nav-links .theme-toggle { + .nav-actions { position: absolute; top: 14px; + right: 0; + } + + .nav-actions .github-link, + .nav-actions .theme-toggle { justify-content: center; width: 38px; min-width: 38px; padding: 0; } - .nav-links .github-link { - right: 44px; - } - - .nav-links .theme-toggle { - right: 0; - } - - .nav-links .github-link span, - .nav-links .theme-toggle [data-theme-label] { + .nav-actions .github-link span, + .nav-actions .theme-toggle [data-theme-label] { display: none; } }