Various stylesheet fixes for background image support

2025-03-25 16:11:59 +01:00
parent 5953fd71d3
commit d8373bc488
3 changed files with 42 additions and 4 deletions
--- a/dashboard/src/components/Headerbar.vue
+++ b/dashboard/src/components/Headerbar.vue
@@ -112,6 +112,18 @@ onMounted(async () => {
  gap: 15px;
 }

+body.has-background .headerbar {
+  background-color: rgba(255,255,255,0.2);
+  filter: drop-shadow(0px 0px 14px white);
+}
+
+@media (prefers-color-scheme: dark) {
+  body.has-background .headerbar {
+    background-color: rgba(0,0,0,0.2);
+    filter: drop-shadow(0px 0px 14px black);
+  }
+}
+
 .headerbar a {
  display: flex;
  align-items: center;