sites: drop the divider line under topnav; fix Sirius .X space
theseus.x, sirius.x and hephaestus.x had a 1px border-bottom under the sticky/fixed topnav that read as a visible separator between the navigation and the page. The topnav's own translucent-blur backdrop is enough of a distinction already — the line is redundant and, on the theseus.x sidebar layout, made the top of the sidebar look like it was overhanging the header. theseus.x tabs also had a "Sirius .X" gap because the topnav <a> is a flex container and the icon + "Sirius" text + ".X" span were three flex items with a 6px gap between each. Wrapping the label in one <span> collapses the gap to a single space between icon and label. Sidebar border-right and mobile bottom-bar border-top also dropped — the panel tint carries the boundary; a hard line was too heavy.
This commit is contained in:
parent
7d12f97d39
commit
3da39846c1
3 changed files with 12 additions and 14 deletions
|
|
@ -24,8 +24,7 @@
|
|||
a{color:var(--acid)}
|
||||
.wrap{max-width:900px;margin:0 auto;padding:0 1.2rem}
|
||||
.topnav{position:fixed;top:0;left:0;right:0;z-index:20;display:flex;gap:2px;align-items:center;flex-wrap:wrap;
|
||||
padding:10px 1.2rem;background:rgba(11,14,20,.88);backdrop-filter:blur(10px);
|
||||
border-bottom:1px solid var(--line)}
|
||||
padding:10px 1.2rem;background:rgba(11,14,20,.88);backdrop-filter:blur(10px)}
|
||||
.topnav .brand{font-weight:600;color:var(--ink);text-decoration:none;margin-right:14px;font-size:15px;letter-spacing:.2px;display:flex;align-items:center;gap:8px}
|
||||
.topnav .brand .g{color:var(--acid)}
|
||||
.topnav .brand svg{width:20px;height:20px}
|
||||
|
|
@ -44,7 +43,7 @@
|
|||
body{padding-left:var(--sn-w);padding-top:var(--tn-h)}
|
||||
.sidenav{position:fixed;top:var(--tn-h);left:0;bottom:0;width:var(--sn-w);z-index:15;
|
||||
background:rgba(11,14,20,.82);backdrop-filter:blur(10px);
|
||||
border-right:1px solid var(--line);padding:22px 14px 22px 18px;
|
||||
padding:22px 14px 22px 18px;
|
||||
overflow-y:auto;transition:width .15s ease}
|
||||
.sidenav .lbl{color:var(--dim);font:600 10.5px/1 system-ui;letter-spacing:.24em;text-transform:uppercase;
|
||||
margin:0 0 14px 4px}
|
||||
|
|
@ -67,7 +66,7 @@
|
|||
:root{--sn-w:0px}
|
||||
body{padding-left:0;padding-bottom:64px}
|
||||
.sidenav{top:auto;bottom:0;left:0;right:0;width:100%;height:auto;
|
||||
padding:4px 4px;flex-direction:row;border-right:none;border-top:1px solid var(--line);
|
||||
padding:4px 4px;flex-direction:row;
|
||||
display:flex;justify-content:space-around;overflow-x:auto}
|
||||
.sidenav .lbl{display:none}
|
||||
.sidenav a{flex:1;min-width:56px;padding:10px 6px;justify-content:center;border-left:none;
|
||||
|
|
@ -127,7 +126,7 @@
|
|||
<a href="/">Home</a>
|
||||
<a href="/plug-ins/">Plug-ins</a>
|
||||
<a class="here" href="./">Extensions</a>
|
||||
<a href="https://sirius.x/" title="Register a BCNR name"><svg class="tabicon" viewBox="0 0 64 64" aria-hidden="true"><rect width="64" height="64" rx="12" fill="#0b0e14"/><path d="M32 4 L36.4 27.6 L60 32 L36.4 36.4 L32 60 L27.6 36.4 L4 32 L27.6 27.6 Z" fill="#d6ff3d"/></svg>Sirius<span class="g">.X</span></a>
|
||||
<a href="https://sirius.x/" title="Register a BCNR name"><svg class="tabicon" viewBox="0 0 64 64" aria-hidden="true"><rect width="64" height="64" rx="12" fill="#0b0e14"/><path d="M32 4 L36.4 27.6 L60 32 L36.4 36.4 L32 60 L27.6 36.4 L4 32 L27.6 27.6 Z" fill="#d6ff3d"/></svg><span>Sirius<span class="g">.X</span></span></a>
|
||||
<a class="get" href="/#download">Get Theseus</a>
|
||||
</nav>
|
||||
|
||||
|
|
|
|||
|
|
@ -29,8 +29,7 @@
|
|||
a{color:var(--acid)}
|
||||
.wrap{max-width:980px;margin:0 auto;padding:0 1.2rem}
|
||||
.topnav{position:fixed;top:0;left:0;right:0;z-index:20;display:flex;gap:2px;align-items:center;flex-wrap:wrap;
|
||||
padding:10px 1.2rem;background:rgba(11,14,20,.88);backdrop-filter:blur(10px);
|
||||
border-bottom:1px solid var(--line)}
|
||||
padding:10px 1.2rem;background:rgba(11,14,20,.88);backdrop-filter:blur(10px)}
|
||||
.topnav .brand{font-weight:600;color:var(--ink);text-decoration:none;margin-right:14px;font-size:15px;letter-spacing:.2px;display:flex;align-items:center;gap:8px}
|
||||
.topnav .brand .g{color:var(--acid)}
|
||||
.topnav .brand svg{width:20px;height:20px}
|
||||
|
|
@ -51,7 +50,7 @@
|
|||
body{padding-left:var(--sn-w);padding-top:var(--tn-h)}
|
||||
.sidenav{position:fixed;top:var(--tn-h);left:0;bottom:0;width:var(--sn-w);z-index:15;
|
||||
background:rgba(11,14,20,.82);backdrop-filter:blur(10px);
|
||||
border-right:1px solid var(--line);padding:22px 14px 22px 18px;
|
||||
padding:22px 14px 22px 18px;
|
||||
overflow-y:auto;transition:width .15s ease}
|
||||
.sidenav .lbl{color:var(--dim);font:600 10.5px/1 system-ui;letter-spacing:.24em;text-transform:uppercase;
|
||||
margin:0 0 14px 4px}
|
||||
|
|
@ -76,7 +75,7 @@
|
|||
:root{--sn-w:0px}
|
||||
body{padding-left:0;padding-bottom:64px}
|
||||
.sidenav{top:auto;bottom:0;left:0;right:0;width:100%;height:auto;
|
||||
padding:4px 4px;flex-direction:row;border-right:none;border-top:1px solid var(--line);
|
||||
padding:4px 4px;flex-direction:row;
|
||||
display:flex;justify-content:space-around;overflow-x:auto}
|
||||
.sidenav .lbl{display:none}
|
||||
.sidenav a{flex:1;min-width:56px;padding:10px 6px;justify-content:center;border-left:none;
|
||||
|
|
@ -148,7 +147,7 @@
|
|||
<a class="here" href="/">Home</a>
|
||||
<a href="/plug-ins/">Plug-ins</a>
|
||||
<a href="/extensions/">Extensions</a>
|
||||
<a href="https://sirius.x/" title="Register a BCNR name"><svg class="tabicon" viewBox="0 0 64 64" aria-hidden="true"><rect width="64" height="64" rx="12" fill="#0b0e14"/><path d="M32 4 L36.4 27.6 L60 32 L36.4 36.4 L32 60 L27.6 36.4 L4 32 L27.6 27.6 Z" fill="#d6ff3d"/></svg>Sirius<span class="g">.X</span></a>
|
||||
<a href="https://sirius.x/" title="Register a BCNR name"><svg class="tabicon" viewBox="0 0 64 64" aria-hidden="true"><rect width="64" height="64" rx="12" fill="#0b0e14"/><path d="M32 4 L36.4 27.6 L60 32 L36.4 36.4 L32 60 L27.6 36.4 L4 32 L27.6 27.6 Z" fill="#d6ff3d"/></svg><span>Sirius<span class="g">.X</span></span></a>
|
||||
<a class="get" href="#download">Get Theseus</a>
|
||||
</nav>
|
||||
|
||||
|
|
|
|||
|
|
@ -23,7 +23,7 @@
|
|||
a{color:var(--acid)}
|
||||
.wrap{max-width:900px;margin:0 auto;padding:0 1.2rem}
|
||||
.topnav{position:fixed;top:0;left:0;right:0;z-index:20;display:flex;gap:2px;align-items:center;flex-wrap:wrap;
|
||||
padding:10px 1.2rem;background:rgba(11,14,20,.88);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
|
||||
padding:10px 1.2rem;background:rgba(11,14,20,.88);backdrop-filter:blur(10px)}
|
||||
.topnav .brand{font-weight:600;color:var(--ink);text-decoration:none;margin-right:14px;font-size:15px;letter-spacing:.2px;display:flex;align-items:center;gap:8px}
|
||||
.topnav .brand .g{color:var(--acid)}
|
||||
.topnav .brand svg{width:20px;height:20px}
|
||||
|
|
@ -42,7 +42,7 @@
|
|||
body{padding-left:var(--sn-w);padding-top:var(--tn-h)}
|
||||
.sidenav{position:fixed;top:var(--tn-h);left:0;bottom:0;width:var(--sn-w);z-index:15;
|
||||
background:rgba(11,14,20,.82);backdrop-filter:blur(10px);
|
||||
border-right:1px solid var(--line);padding:22px 14px 22px 18px;
|
||||
padding:22px 14px 22px 18px;
|
||||
overflow-y:auto;transition:width .15s ease}
|
||||
.sidenav .lbl{color:var(--dim);font:600 10.5px/1 system-ui;letter-spacing:.24em;text-transform:uppercase;
|
||||
margin:0 0 14px 4px}
|
||||
|
|
@ -65,7 +65,7 @@
|
|||
:root{--sn-w:0px}
|
||||
body{padding-left:0;padding-bottom:64px}
|
||||
.sidenav{top:auto;bottom:0;left:0;right:0;width:100%;height:auto;
|
||||
padding:4px 4px;flex-direction:row;border-right:none;border-top:1px solid var(--line);
|
||||
padding:4px 4px;flex-direction:row;
|
||||
display:flex;justify-content:space-around;overflow-x:auto}
|
||||
.sidenav .lbl{display:none}
|
||||
.sidenav a{flex:1;min-width:56px;padding:10px 6px;justify-content:center;border-left:none;
|
||||
|
|
@ -119,7 +119,7 @@
|
|||
<a href="/">Home</a>
|
||||
<a class="here" href="./">Plug-ins</a>
|
||||
<a href="/extensions/">Extensions</a>
|
||||
<a href="https://sirius.x/" title="Register a BCNR name"><svg class="tabicon" viewBox="0 0 64 64" aria-hidden="true"><rect width="64" height="64" rx="12" fill="#0b0e14"/><path d="M32 4 L36.4 27.6 L60 32 L36.4 36.4 L32 60 L27.6 36.4 L4 32 L27.6 27.6 Z" fill="#d6ff3d"/></svg>Sirius<span class="g">.X</span></a>
|
||||
<a href="https://sirius.x/" title="Register a BCNR name"><svg class="tabicon" viewBox="0 0 64 64" aria-hidden="true"><rect width="64" height="64" rx="12" fill="#0b0e14"/><path d="M32 4 L36.4 27.6 L60 32 L36.4 36.4 L32 60 L27.6 36.4 L4 32 L27.6 27.6 Z" fill="#d6ff3d"/></svg><span>Sirius<span class="g">.X</span></span></a>
|
||||
<a class="get" href="/#download">Get Theseus</a>
|
||||
</nav>
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue