From 075f2cb903fa45ea8e7a52098fd7091b0b14a9fd Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Mon, 4 Mar 2024 19:45:42 +0200
Subject: remove all "fallback variables"

---
 src/components/dialog_modal/dialog_modal.vue | 11 +----------
 1 file changed, 1 insertion(+), 10 deletions(-)

(limited to 'src/components/dialog_modal/dialog_modal.vue')

diff --git a/src/components/dialog_modal/dialog_modal.vue b/src/components/dialog_modal/dialog_modal.vue
index 341cf105..b917c637 100644
--- a/src/components/dialog_modal/dialog_modal.vue
+++ b/src/components/dialog_modal/dialog_modal.vue
@@ -25,8 +25,6 @@
 <script src="./dialog_modal.js"></script>
 
 <style lang="scss">
-@import "../../variables";
-
 // TODO: unify with other modals.
 .dark-overlay {
   &::before {
@@ -54,8 +52,6 @@
   z-index: 2001;
   cursor: default;
   display: block;
-  background-color: $fallback--bg;
-  background-color: var(--bg, $fallback--bg);
 
   .dialog-modal-heading {
     .title {
@@ -66,18 +62,13 @@
   .dialog-modal-content {
     margin: 0;
     padding: 1rem;
-    background-color: $fallback--bg;
-    background-color: var(--bg, $fallback--bg);
     white-space: normal;
   }
 
   .dialog-modal-footer {
     margin: 0;
     padding: 0.5em;
-    background-color: $fallback--bg;
-    background-color: var(--bg, $fallback--bg);
-    border-top: 1px solid $fallback--border;
-    border-top: 1px solid var(--border, $fallback--border);
+    border-top: 1px solid var(--border);
     display: flex;
     justify-content: flex-end;
 
-- 
cgit v1.2.3-70-g09d2


From ce5552ae3c53b563126aae2c3c9b77a321880eed Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Wed, 6 Mar 2024 20:35:03 +0200
Subject: fix more transparent panels

---
 src/components/chat/chat.scss                |  1 -
 src/components/chat/chat.style.js            |  7 ++++++-
 src/components/dialog_modal/dialog_modal.vue |  2 +-
 src/components/search/search.vue             | 11 ++++++++---
 4 files changed, 15 insertions(+), 6 deletions(-)

(limited to 'src/components/dialog_modal/dialog_modal.vue')

diff --git a/src/components/chat/chat.scss b/src/components/chat/chat.scss
index 31061409..8af710ae 100644
--- a/src/components/chat/chat.scss
+++ b/src/components/chat/chat.scss
@@ -37,7 +37,6 @@
   .footer {
     position: sticky;
     bottom: 0;
-    background-color: var(--background);
     z-index: 1;
   }
 
diff --git a/src/components/chat/chat.style.js b/src/components/chat/chat.style.js
index fc3d66a4..9ae2b7d7 100644
--- a/src/components/chat/chat.style.js
+++ b/src/components/chat/chat.style.js
@@ -1,7 +1,6 @@
 export default {
   name: 'Chat',
   selector: '.chat-message-list',
-  lazy: true,
   validInnerComponents: [
     'Text',
     'Link',
@@ -10,5 +9,11 @@ export default {
     'ChatMessage'
   ],
   defaultRules: [
+    {
+      directives: {
+        background: '--bg',
+        blur: '5px'
+      }
+    }
   ]
 }
diff --git a/src/components/dialog_modal/dialog_modal.vue b/src/components/dialog_modal/dialog_modal.vue
index b917c637..3bceff22 100644
--- a/src/components/dialog_modal/dialog_modal.vue
+++ b/src/components/dialog_modal/dialog_modal.vue
@@ -12,7 +12,7 @@
           <slot name="header" />
         </div>
       </div>
-      <div class="dialog-modal-content">
+      <div class="panel-body dialog-modal-content">
         <slot name="default" />
       </div>
       <div class="dialog-modal-footer user-interactions panel-footer">
diff --git a/src/components/search/search.vue b/src/components/search/search.vue
index 643c2cad..dc803835 100644
--- a/src/components/search/search.vue
+++ b/src/components/search/search.vue
@@ -1,11 +1,11 @@
 <template>
-  <div class="panel panel-default">
+  <div class="Search panel panel-default">
     <div class="panel-heading">
       <div class="title">
         {{ $t('nav.search') }}
       </div>
     </div>
-    <div class="search-input-container">
+    <div class="panel-body search-input-container">
       <input
         ref="searchInput"
         v-model="searchTerm"
@@ -23,7 +23,7 @@
     </div>
     <div
       v-if="loading && statusesOffset == 0"
-      class="text-center loading-icon"
+      class="panel-body text-center loading-icon"
     >
       <FAIcon
         icon="circle-notch"
@@ -154,6 +154,11 @@
   text-align: center;
 }
 
+.Search .tab-switcher .tabs {
+  background: var(--__panel-background);
+  backdrop-filter: var(--__panel-backdrop-filter);
+}
+
 @media all and (max-width: 800px) {
   .search-nav-heading {
     .tab-switcher .tabs .tab-wrapper {
-- 
cgit v1.2.3-70-g09d2