From 3b8eb2368679570897de699b41d05830942681c5 Mon Sep 17 00:00:00 2001
From: yashrajbharticybtekk <y.bharti@cybtekk.com>
Date: Sun, 28 Apr 2024 16:55:37 +0530
Subject: [PATCH] add css for selected filter

---
 js/apply-filters.mjs | 2 +-
 style.css            | 8 +++++++-
 2 files changed, 8 insertions(+), 2 deletions(-)

diff --git a/js/apply-filters.mjs b/js/apply-filters.mjs
index 4f53867..ece1692 100644
--- a/js/apply-filters.mjs
+++ b/js/apply-filters.mjs
@@ -12,7 +12,7 @@ export const applyFilters = () => {
     } else {
       if (e.target.hasAttribute("name")) {
         applyLensFilter(e.target.value);
-        // checkbox.checked = false;
+        // checkbox.checked = false;  this was for the no cancel button approach
       }
     }
   });
diff --git a/style.css b/style.css
index e0063c1..3076632 100644
--- a/style.css
+++ b/style.css
@@ -75,7 +75,9 @@ video.flip {
     justify-content: center;
     flex-direction: column;
     border: 1.5px solid transparent;
-    background-color: black;
+    background-color: rgba(0, 0, 0, 0.742);
+    -webkit-backdrop-filter: blur(20px);
+    backdrop-filter: blur(20px);
     border-radius: 48px;
     overflow: hidden;
     cursor: pointer;
@@ -106,6 +108,10 @@ video.flip {
     cursor: pointer;
 }
 
+.lenses:has(.filters #filter-toggle:checked) {
+    translate: 0 -50px;
+}
+
 .lenses:has(.filters #filter-toggle:not(:checked)) .cancel {
     display: none;
 }