Merge remote-tracking branch 'origin/main'

scss/self.scss

@@ -11,6 +11,7 @@
 
 .container.list-container{
   position: relative;
+  isolation: isolate;
 }
 
 .container.list-container::before{
@@ -22,14 +23,26 @@
   bottom: 0;
   width: 100%;
   height: 100%;
-  background-color: #fff9;
+  background:
+    linear-gradient(
+      180deg,
+      rgb(var(--secondary-rgb) / 0.46) 0%,
+      rgb(var(--secondary-rgb) / 0.34) 100%
+    );
   border-radius: var(--d-border-radius);
-  backdrop-filter: blur(10px);
-  box-shadow: #00000077 0 0 19px 0;
+  backdrop-filter: blur(8px);
+  box-shadow: rgb(0 0 0 / 28%) 0 10px 26px -16px;
+  pointer-events: none;
+  z-index: 0;
+}
+
+.container.list-container > * {
+  position: relative;
+  z-index: 1;
 }
 
 .topic-list-header{
-  background-color: unset;
+  background-color: transparent;
 }
 .list-controls, .search-container{
   border-radius: var(--d-border-radius);
@@ -41,7 +54,7 @@
 }
 
 #list-area{
-  background-color: unset !important;
+  background-color: transparent;
 }
 
 #main-outlet-wrapper{
@@ -49,9 +62,9 @@
 }
 
 .regular.ember-view{
-  background-color: #ffffffa8 !important;
+  background-color: rgb(var(--secondary-rgb) / 0.58);
   border-radius: var(--d-border-radius);
-  backdrop-filter: blur(16px);
-  box-shadow: #00000077 0 0 19px 0;
+  backdrop-filter: blur(10px);
+  box-shadow: rgb(0 0 0 / 24%) 0 10px 24px -14px;
   padding: 24px;
 }