From ace007b47f02bf84b18de28720823c9fa77bed03 Mon Sep 17 00:00:00 2001
From: mxgic1337_ <60188749+mxgic1337@users.noreply.github.com>
Date: Thu, 13 Mar 2025 09:24:11 +0100
Subject: [PATCH] fix: backdrop transparency (#19)

* fix: shows backdrop transparency

* fix: changed `surface0` to `base`

* M E R G E

---------

Co-authored-by: Adam Perkowski <adas1per@protonmail.com>
---
 jellyfin.tera                   | 1 +
 themes/catppuccin-frappe.css    | 1 +
 themes/catppuccin-latte.css     | 1 +
 themes/catppuccin-macchiato.css | 1 +
 themes/catppuccin-mocha.css     | 1 +
 themes/theme.css                | 5 +++++
 6 files changed, 10 insertions(+)

diff --git a/jellyfin.tera b/jellyfin.tera
index 5c0c24a..930e64f 100644
--- a/jellyfin.tera
+++ b/jellyfin.tera
@@ -25,6 +25,7 @@ whiskers:
   --main-background: #{{base.hex}};
   --second-background: #{{mantle.hex}};
   --hover-background: #{{surface0.hex}};
+  --main-background-transparent: #{{base.hex}}dd;
   --main-text: #{{text.hex}};
   --dimmer-text: #{{overlay2.hex}};
   --green-color: var(--green);
diff --git a/themes/catppuccin-frappe.css b/themes/catppuccin-frappe.css
index 28e6261..e419df6 100644
--- a/themes/catppuccin-frappe.css
+++ b/themes/catppuccin-frappe.css
@@ -18,6 +18,7 @@
   --main-background: #303446;
   --second-background: #292c3c;
   --hover-background: #414559;
+  --main-background-transparent: #303446dd;
   --main-text: #c6d0f5;
   --dimmer-text: #949cbb;
   --green-color: var(--green);
diff --git a/themes/catppuccin-latte.css b/themes/catppuccin-latte.css
index 82e655c..2b95055 100644
--- a/themes/catppuccin-latte.css
+++ b/themes/catppuccin-latte.css
@@ -18,6 +18,7 @@
   --main-background: #eff1f5;
   --second-background: #e6e9ef;
   --hover-background: #ccd0da;
+  --main-background-transparent: #eff1f5dd;
   --main-text: #4c4f69;
   --dimmer-text: #7c7f93;
   --green-color: var(--green);
diff --git a/themes/catppuccin-macchiato.css b/themes/catppuccin-macchiato.css
index 1ceb118..c54d328 100644
--- a/themes/catppuccin-macchiato.css
+++ b/themes/catppuccin-macchiato.css
@@ -18,6 +18,7 @@
   --main-background: #24273a;
   --second-background: #1e2030;
   --hover-background: #363a4f;
+  --main-background-transparent: #24273add;
   --main-text: #cad3f5;
   --dimmer-text: #939ab7;
   --green-color: var(--green);
diff --git a/themes/catppuccin-mocha.css b/themes/catppuccin-mocha.css
index 063e5ca..db809b3 100644
--- a/themes/catppuccin-mocha.css
+++ b/themes/catppuccin-mocha.css
@@ -18,6 +18,7 @@
   --main-background: #1e1e2e;
   --second-background: #181825;
   --hover-background: #313244;
+  --main-background-transparent: #1e1e2edd;
   --main-text: #cdd6f4;
   --dimmer-text: #9399b2;
   --green-color: var(--green);
diff --git a/themes/theme.css b/themes/theme.css
index ea629cf..363dc82 100644
--- a/themes/theme.css
+++ b/themes/theme.css
@@ -328,3 +328,8 @@ div[role=presentation].jstree-wholerow-clicked {
 .itemProgressBar.backgroundProgress .itemProgressBarForeground {
   background-color: var(--hover-background) !important;
 }
+
+.detailPagePrimaryContainer,
+.backgroundContainer.withBackdrop {
+  background-color: var(--main-background-transparent);
+}