Mobile sidebar cosmetics

assets/styles/layout/_responsive.scss

@@ -29,10 +29,6 @@
             margin-right: 0;
         }
 
-        #docsearch {
-            margin-right: .5rem;
-        }
-
         .DocSearch-Button {
             width: 2rem;
             height: 2rem;
@@ -76,9 +72,11 @@
         z-index: 1102;
         height: 100%;
         transform: translateX(-100%);
-        background-color: var(--surface-overlay);
+        background-color: var(--mobile-menu-bg);
+        backdrop-filter: blur(20px);
         width: 300px;
         opacity: 0;
+        box-shadow: 0px 0px 50px 5px rgba(16, 185, 129, .2);
 
         nav {
             padding: 1rem 1rem;

assets/styles/layout/landing/_dark.scss

@@ -1,6 +1,7 @@
 .layout-dark {
     --glow-image: url(https://www.primefaces.org/cdn/primevue/images/layout/top-pattern-light.png);
     --topbar-border: var(--surface-border);
+    --mobile-menu-bg: rgba(0,0,0,.3);
     --home-highlight-color:#10b981;
     --home-highlight-darker-color:#059669;
     --home-highlight-fore-color:#ffffff;

assets/styles/layout/landing/_light.scss

@@ -1,6 +1,7 @@
 .layout-light {
     --glow-image: url(https://www.primefaces.org/cdn/primevue/images/layout/top-pattern-light.png);
     --topbar-border: rgba(0,0,0,.05);
+    --mobile-menu-bg: var(--surface-overlay);
     --home-highlight-color:#10b981;
     --home-highlight-darker-color:#059669;
     --home-highlight-fore-color:#ffffff;