silentmode/sirius
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

sirius.x: pull the sign-in link to the far right of the top nav

Browse source 
Standard header pattern — brand + main nav on the left, the account action on
the right. New .portal class does margin-left:auto plus a subtle acid tint so
it reads as a button, not another nav item. Applied on all four pages
(landing, docs, portal, theseus); the label is '🔑 Sign in' everywhere
(portal.html itself still marks it .here).
This commit is contained in:
Local Dev 2026-08-29 22:22:37 +02:00
parent bd4b4602e0
commit 1f331a298b
4 changed files with 14 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
docs/index.html
View file

@ -24,6 +24,8 @@
.topnav a{color:var(--mut);text-decoration:none;padding:6px 12px;border-radius:8px;font-size:14px}
.topnav a:hover{color:var(--ink);background:var(--panel)}
.topnav a.here{color:var(--acid);background:rgba(214,255,61,.08)}
.topnav a.portal{margin-left:auto;background:rgba(214,255,61,.10);color:var(--acid);font-weight:500}
.topnav a.portal:hover{background:rgba(214,255,61,.18)}
header.hero{text-align:center;padding:4rem 1.2rem 1rem}
.mark{font-size:52px;line-height:1}
h1{font-size:clamp(1.8rem,4.8vw,2.5rem);margin:.4rem 0 .3rem}
@ -73,8 +75,8 @@
<a href="../#try">Try it</a>
<a href="./" class="here">📚 Docs</a>
<a href="../theseus/">🧭 Theseus</a>
<a href="../portal.html">🔑 Portal</a>
<a href="https://silentmode.st/" rel="noopener">Silent Mode ↗</a>
<a href="../portal.html" class="portal">🔑 Sign in</a>
</nav>
<header class="hero">

5
index.html
View file

@ -26,6 +26,9 @@
.topnav a{color:var(--mut);text-decoration:none;padding:6px 12px;border-radius:8px;font-size:14px}
.topnav a:hover{color:var(--ink);background:var(--panel)}
.topnav a.here{color:var(--acid);background:rgba(214,255,61,.08)}
/* Sign-in link sits on the right so it reads as an account action, not a nav item */
.topnav a.portal{margin-left:auto;background:rgba(214,255,61,.10);color:var(--acid);font-weight:500}
.topnav a.portal:hover{background:rgba(214,255,61,.18)}
header.hero{text-align:center;padding:5rem 1.2rem 1rem}
.mark{font-size:56px;line-height:1}
h1{font-size:clamp(2rem,5.5vw,2.9rem);margin:.4rem 0 .3rem}
@ -78,9 +81,9 @@
<a href="#try">Try it</a>
<a href="./docs/">📚 Docs</a>
<a href="./theseus/">🧭 Theseus</a>
<a href="./portal.html">🔑 Portal</a>
<a href="#roadmap">Roadmap</a>
<a href="https://silentmode.st/" rel="noopener">Silent Mode ↗</a>
<a href="./portal.html" class="portal">🔑 Sign in</a>
</nav>
<header class="hero">

4
portal.html
View file

@ -23,6 +23,8 @@
.topnav a{color:var(--mut);text-decoration:none;padding:6px 12px;border-radius:8px;font-size:14px}
.topnav a:hover{color:var(--ink);background:var(--panel)}
.topnav a.here{color:var(--acid);background:rgba(214,255,61,.08)}
.topnav a.portal{margin-left:auto;background:rgba(214,255,61,.10);color:var(--acid);font-weight:500}
.topnav a.portal:hover{background:rgba(214,255,61,.18)}
header.hero{text-align:center;padding:3rem 1.2rem 1rem}
.mark{font-size:44px;line-height:1}
h1{font-size:clamp(1.6rem,4.5vw,2.2rem);margin:.3rem 0 .3rem}
@ -80,8 +82,8 @@
<a href="./#try">Try it</a>
<a href="./docs/">📚 Docs</a>
<a href="./theseus/">🧭 Theseus</a>
<a href="./portal.html" class="here">🔑 Portal</a>
<a href="https://silentmode.st/" rel="noopener">Silent Mode ↗</a>
<a href="./portal.html" class="portal here">🔑 Sign in</a>
</nav>
<header class="hero">

6
theseus/index.html
View file

@ -24,6 +24,8 @@
.topnav a{color:var(--mut);text-decoration:none;padding:6px 12px;border-radius:8px;font-size:14px}
.topnav a:hover{color:var(--ink);background:var(--panel)}
.topnav a.here{color:var(--acid);background:rgba(214,255,61,.08)}
.topnav a.portal{margin-left:auto;background:rgba(214,255,61,.10);color:var(--acid);font-weight:500}
.topnav a.portal:hover{background:rgba(214,255,61,.18)}
header.hero{text-align:center;padding:5rem 1.2rem 1rem}
.mark{font-size:56px;line-height:1}
h1{font-size:clamp(2rem,5.5vw,2.9rem);margin:.4rem 0 .3rem}
@ -72,9 +74,9 @@
<a class="brand" href="../">⭐ <span class="g">sirius.x</span></a>
<a href="../#try">Try it</a>
<a href="../docs/">📚 Docs</a>
<a href="./" class="here">Theseus</a>
<a href="../portal.html">Portal</a>
<a href="./" class="here">🧭 Theseus</a>
<a href="https://silentmode.st/" rel="noopener">Silent Mode ↗</a>
<a href="../portal.html" class="portal">🔑 Sign in</a>
</nav>
<header class="hero">