From 5be81a8e31abfbf5d816d1f4adf6d60c89ebb49c Mon Sep 17 00:00:00 2001
From: Jake Vanderwerf <get@jakevanderwerf.ca>
Date: Sun, 26 Apr 2026 22:04:08 +0000
Subject: [PATCH] =switchiing over
---
nav.css | 46 ++++++++++++++++++++++++++++++++++++----------
1 files changed, 36 insertions(+), 10 deletions(-)
diff --git a/nav.css b/nav.css
index 9153da4..4495442 100644
--- a/nav.css
+++ b/nav.css
@@ -269,7 +269,6 @@
/**************************************************************
VARIANT: BREADCRUMBS (#breadcrumbs)
-Only define what makes it different
**************************************************************/
nav#breadcrumbs {
/* Different sizing */
@@ -286,6 +285,8 @@
}
#breadcrumbs ol {
height: max-content;
+ --wrap: wrap!important;
+ --justify: flex-start!important;
}
#breadcrumbs li {
width: max-content;
@@ -369,6 +370,12 @@
color: var(--base-200);
box-shadow: rgba(var(--base-rgb),var(--op-45)) var(--shdw);
z-index: var(--z-6);
+
+}
+.on-this-page li,
+.on-this-page a {
+ width: 100%;
+ height: 100%;
}
body:has(nav.fixed) nav.on-this-page {
@@ -377,7 +384,16 @@
body:has(.additional-actions button) nav.on-this-page{
width: calc(100vw - var(--btn_) - 1rem);
}
-
+.on-this-page button {
+ order: 3;
+ padding: 0 1rem;
+ width: max-content;
+ aspect-ratio: unset;
+ height: var(--btn);
+}
+.on-this-page.open button {
+ order: 0;
+}
.on-this-page ul {
width: 100%;
gap: 0;
@@ -391,9 +407,14 @@
color: var(--action-contrast);
}
.on-this-page a {
- height: var(--chip);
padding: 0;
}
+.on-this-page #back-to-top span {
+ display: none;
+}
+.on-this-page.open #back-to-top span {
+ display: block;
+}
/**************************************************************
VARIANT: LETTERS (nav.letters)
@@ -432,31 +453,36 @@
Only define what makes it different
**************************************************************/
nav.index {
- --justify: flex-start;
+ --justify: space-between;
--padding: 0;
background-color: rgba(var(--base-rgb),var(--op-6));
}
.index ul {
- width: max-content;
+ width: 100%;
}
.index li {
flex-shrink: 0;
transform: scaleX(0);
- transform-origin: right;
max-width: 0;
overflow: hidden;
- transition: transform var(--trans-base);
}
.index li.active,
.index li.adj {
transform: scaleX(1);
- transform-origin: left;
- width: 100%;
+ width: calc(100% - var(--btn_));
flex-shrink: 1;
- max-width: fit-content;
+ max-width: none;
+}
+.index li:first-of-type {
+ flex-shrink: 1;
+ transform: scaleX(1);
+ order: 9999;
+ width: var(--btn);
+ height: var(--btn);
+ max-width: none;
}
@media (max-width: 767px) {
--
Gitblit v1.10.0