Make open nav higher

Author: MrWillCom

source/css/nav.scss

@@ -7,14 +7,12 @@
 }
 
 nav {
-  // background-color: var(--color-background-secondary-translucent);
   user-select: none;
   position: fixed;
   top: 0;
   left: 0;
   right: 0;
   z-index: 1000;
-  // backdrop-filter: var(--filter-blur);
   transition: height 0.4s cubic-bezier(0.86, 0, 0.07, 1);
 
   .inner {
@@ -203,11 +201,10 @@ nav {
   top: 0;
   left: 0;
   right: 0;
-  // background-color: var(--color-background-secondary-translucent);
-  background-color: rgba(0, 0, 0, 0.25);
+  background-color: var(--color-background-secondary-translucent-lite);
   backdrop-filter: blur(10px);
   mask-image: linear-gradient(to bottom, #000, transparent);
-  -webkit-mask-composite: destination-in;
+  mask-composite: destination-in;
   pointer-events: none;
   z-index: 1000;
   transition:
@@ -226,7 +223,7 @@ nav {
 
       @media (max-width: 600px) {
         .nav-open & {
-          height: calc(var(--open-height) * 3 / math.pow(($base), ($i - 1)));
+          height: calc(var(--open-height) * 4 / math.pow(($base), ($i - 1)));
         }
       }
     }

source/css/var.scss

@@ -16,6 +16,7 @@
   --color-background-secondary: #ffffff;
   --color-background-secondary-hover: #f7f7f7;
   --color-background-secondary-translucent: #ffffffcc;
+  --color-background-secondary-translucent-lite: #ffffff33;
   --color-background-accent: #0071e3;
   --color-background-accent-contrast: #ffffff;
   --color-background-accent-hover: #0077ed;
@@ -41,6 +42,7 @@
   --color-background-secondary: #181818;
   --color-background-secondary-hover: #202020;
   --color-background-secondary-translucent: #00000080;
+  --color-background-secondary-translucent-lite: #00000033;
   --color-background-accent: #0071e3;
   --color-background-accent-contrast: #ffffff;
   --color-background-accent-hover: #0077ed;