fix: add backdrop-filter blur to footer via CSS with vendor prefix

diff --git a/themes/danix-xyz-hacker/assets/css/main.css b/themes/danix-xyz-hacker/assets/css/main.css
index b7d22195947a9a2f8e755972719dfeb047a9bff6..c1679ca5f033e0e5619aa6dd3510566b14dc71cf 100644 (file)
--- a/themes/danix-xyz-hacker/assets/css/main.css
+++ b/themes/danix-xyz-hacker/assets/css/main.css
@@ -188,9 +188,10 @@ html.theme-light {
     /* border applied via utility classes in templates */
   }
 
-  /* Footer variant: test - fully opaque background */
-  footer.frosted-bar {
-    background-color: rgba(var(--bg2-rgb), 1) !important;
+  /* Footer styling with strong frosting */
+  footer {
+    -webkit-backdrop-filter: blur(20px);
+    backdrop-filter: blur(20px);
   }
 
   /* Border utilities for frosted-bar component */

diff --git a/themes/danix-xyz-hacker/assets/css/main.min.css b/themes/danix-xyz-hacker/assets/css/main.min.css
index 615e46283c5dde58eb83be107c42abd1174554b4..ab0359afc0771531ba32eb2be74bf295b58007d0 100644 (file)
--- a/themes/danix-xyz-hacker/assets/css/main.min.css
+++ b/themes/danix-xyz-hacker/assets/css/main.min.css
@@ -1289,10 +1289,11 @@ button,
   /* border applied via utility classes in templates */
 }
 
-/* Footer variant: test - fully opaque background */
+/* Footer styling with strong frosting */
 
-footer.frosted-bar {
-  background-color: rgba(var(--bg2-rgb), 1) !important;
+footer {
+  -webkit-backdrop-filter: blur(20px);
+  backdrop-filter: blur(20px);
 }
 
 /* Border utilities for frosted-bar component */

diff --git a/themes/danix-xyz-hacker/layouts/partials/footer.html b/themes/danix-xyz-hacker/layouts/partials/footer.html
index 18bcf085cea56908391e9d0f58981fd17b660d33..fb02f8848bae3be2c6867cc538693e91ac911b4b 100644 (file)
--- a/themes/danix-xyz-hacker/layouts/partials/footer.html
+++ b/themes/danix-xyz-hacker/layouts/partials/footer.html
@@ -1,4 +1,4 @@
-<footer class="mt-16 border-t py-12" style="background-color: rgba(var(--bg2-rgb), 0.85); backdrop-filter: blur(20px); box-shadow: 0 0 20px var(--accent-glow);">
+<footer class="mt-16 border-t py-12" style="background-color: rgba(var(--bg2-rgb), 0.85); box-shadow: 0 0 20px var(--accent-glow);">
   <div class="container mx-auto px-4">
     <div class="grid md:grid-cols-3 gap-8 mb-8">
       <!-- About -->