=switching over

Jake Vanderwerf

4 days ago 4f48b9154270c83324ef6c98f990adbcbe59d073

 navBackup.css

@@ -102,15 +102,15 @@
    transform-origin: top;
    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));
    background-color: rgba(var(--base),var(--op-3));
    border: 2px solid rgba(var(--base),var(--op-3));
    transition: all var(--trans-t) var(--trans-fn);
    box-shadow: var(--shdw-none);
    overflow: hidden;
}

.submenu li {
    background-color: rgba(var(--base-rgb),var(--op-6));
    background-color: rgba(var(--base),var(--op-6));
    border: 1px solid var(--base-50);
}
.submenu a {
@@ -121,7 +121,7 @@
.open > ul.submenu {
    transform: scaleY(1);
    max-height: 1000%;
    box-shadow: rgba(var(--base-rgb),var(--op-45)) var(--shdw);
    box-shadow: rgba(var(--base),var(--op-45)) var(--shdw);
}

/**************************************************************
@@ -168,7 +168,7 @@
    width: 100vw;
    height: 100vh;
    padding-bottom: var(--btn_);
    background-color: rgba(var(--base-rgb),var(--op-6));
    background-color: rgba(var(--base),var(--op-6));
    backdrop-filter: blur(5px);
}

@@ -193,7 +193,7 @@

nav.always li {
    flex-wrap: wrap;
    background-color: rgba(var(--base-rgb), var(--op-6));
    background-color: rgba(var(--base), var(--op-6));
}

nav.always a {
@@ -223,11 +223,11 @@
    top: 0;
    width: 100%;
    border: 2px solid var(--action-0);
    background-color: rgba(var(--contrast-rgb), var(--op-1));
    background-color: rgba(var(--contrast), var(--op-1));
}

nav.always .submenu li {
    background-color: rgba(var(--base-rgb),var(--op-3));
    background-color: rgba(var(--base),var(--op-3));
}

/* Toggle button */
@@ -239,7 +239,7 @@
    height: var(--btn);
    background-color: var(--base);
    color: var(--contrast);
    box-shadow: rgba(var(--base-rgb),var(--op-45)) var(--shdw);
    box-shadow: rgba(var(--base),var(--op-45)) var(--shdw);
    transition: width var(--trans-base);
}
    nav.always > button:hover {
@@ -249,7 +249,7 @@

nav.always.open > button {
    width: 100%;
    background-color: rgba(var(--base-rgb),var(--op-6));
    background-color: rgba(var(--base),var(--op-6));
    backdrop-filter: blur(5px);
    z-index: 1000000;
}
@@ -284,7 +284,7 @@
    width: max-content;
    max-width: var(--full);
    position: absolute;
    background-color: rgba(var(--base-rgb),var(--op-4));
    background-color: rgba(var(--base),var(--op-4));
    font-size: var(--txt-x-small);
    padding: .125em;
    z-index: var(--z-7);
@@ -331,7 +331,7 @@
    bottom: 0;
    left: 0;
    width: calc(100% - var(--btn));
    box-shadow: rgba(var(--base-rgb),var(--op-45)) var(--shdw);
    box-shadow: rgba(var(--base),var(--op-45)) var(--shdw);
    z-index: var(--z-9);
}

@@ -372,9 +372,9 @@
    width: calc(100% - var(--btn));
    max-width: none;
    padding: 0 .5rem;
    background-color: rgba(var(--base-rgb),var(--op-4));
    background-color: rgba(var(--base),var(--op-4));
    color: var(--base-200);
    box-shadow: rgba(var(--base-rgb),var(--op-45)) var(--shdw);
    box-shadow: rgba(var(--base),var(--op-45)) var(--shdw);
    z-index: var(--z-6);

}
@@ -409,7 +409,7 @@
    justify-content: center;
}
.on-this-page .active a {
    background-color: rgba(var(--base-rgb),var(--op-6));
    background-color: rgba(var(--base),var(--op-6));
    color: var(--action-contrast);
}
.on-this-page a {
@@ -461,7 +461,7 @@
nav.index {
    --justify: space-between;
    --padding: 0;
    background-color: rgba(var(--base-rgb),var(--op-6));
    background-color: rgba(var(--base),var(--op-6));
}

.index ul {
@@ -513,7 +513,7 @@
    height: var(--maxHeight);
    width: 100%;
    align-items: flex-end;
    background-color: rgba(var(--base-rgb),var(--op-6));
    background-color: rgba(var(--base),var(--op-6));
    backdrop-filter: blur(5px);
    z-index: var(--z-10);
}
@@ -705,7 +705,7 @@
    align-items: center;
    padding: 0 .5rem;
    background-color: var(--base);
    box-shadow: rgba(var(--base-rgb),var(--op-45)) var(--shdw);
    box-shadow: rgba(var(--base),var(--op-45)) var(--shdw);
    z-index: var(--z-9);
}

@@ -722,7 +722,7 @@
/*    padding: .25rem 1rem;*/
/*    background-color: var(--action-0);*/
/*    color: var(--action-contrast);*/
/*    box-shadow: rgba(var(--base-rgb),var(--op-45)) var(--shdw);*/
/*    box-shadow: rgba(var(--base),var(--op-45)) var(--shdw);*/
/*    display: flex;*/
/*    justify-content: space-between;*/
/*    z-index: 100;*/