=mergin conflict?

Jake Vanderwerf

2026-05-03 42c23cc62d812c29c431977934af7b0f2a24b04b

 nav.css

@@ -41,6 +41,8 @@
    white-space: nowrap;
    text-transform: uppercase;
    transition: var(--trans-color);
    border-radius: 0;
    background-color: transparent;
}
nav a {
    height: var(--btn);
@@ -61,7 +63,7 @@
**************************************************************/

/* Active/Focus states */
    nav a:hover,
/*    nav a:hover,*/
    nav .current a,
    nav a.current,
    nav a:focus,
@@ -73,12 +75,12 @@


/* Icon rotation */
.toggle .icon {
.toggle .icon-caret-down {
    transform: rotate(0deg);
    transition: transform var(--trans-base);
}

.has-submenu.open > button .icon {
.has-submenu.open > button .icon-caret-down {
    transform: rotate(900deg);
}

@@ -94,11 +96,12 @@
    height: max-content;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    max-height: 0;
    transform: scaleY(0);
    transform-origin: top;
    width: max(100%, max-content);
    width: 100%;
    min-width: max-content;
    background-color: rgba(var(--base-rgb),var(--op-3));
    border: 2px solid rgba(var(--base-rgb),var(--op-3));
    transition: all var(--trans-t) var(--trans-fn);
@@ -110,6 +113,9 @@
    background-color: rgba(var(--base-rgb),var(--op-6));
    border: 1px solid var(--base-50);
}
.submenu a {
    height: var(--chipchip);
}

/* Open state */
.open > ul.submenu {
@@ -269,7 +275,6 @@

/**************************************************************
VARIANT: BREADCRUMBS (#breadcrumbs)
Only define what makes it different
**************************************************************/
nav#breadcrumbs {
    /* Different sizing */
@@ -286,6 +291,8 @@
}
#breadcrumbs ol {
    height: max-content;
    --wrap: wrap!important;
    --justify: flex-start!important;
}
#breadcrumbs li {
    width: max-content;
@@ -369,6 +376,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 +390,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 +413,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 +459,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) {