From 76125ee0cf5c311bca62ccf32976e775662f18f9 Mon Sep 17 00:00:00 2001
From: mh-zeynal <mh.zeynal@gmail.com>
Date: Tue, 28 Nov 2023 22:14:35 +0330
Subject: [PATCH] style: restyle workshop page's filter box

---
 .../src/pages/workshops/WorkshopsPage.jsx     |  2 +-
 frontend/src/pages/workshops/workshops.css    | 19 ++++++++++++++++++-
 2 files changed, 19 insertions(+), 2 deletions(-)

diff --git a/frontend/src/pages/workshops/WorkshopsPage.jsx b/frontend/src/pages/workshops/WorkshopsPage.jsx
index b841036..93b34f4 100644
--- a/frontend/src/pages/workshops/WorkshopsPage.jsx
+++ b/frontend/src/pages/workshops/WorkshopsPage.jsx
@@ -86,7 +86,7 @@ export default function WorkshopsPage() {
                 alignItems: "center",
                 flexDirection: 'column'
             }}>
-                <div>
+                <div id="filter-box">
                     <FormLabel id={"radio-container-workshops-container-label"}>
                         Filter By:
                     </FormLabel>
diff --git a/frontend/src/pages/workshops/workshops.css b/frontend/src/pages/workshops/workshops.css
index ed70212..8a38093 100644
--- a/frontend/src/pages/workshops/workshops.css
+++ b/frontend/src/pages/workshops/workshops.css
@@ -30,4 +30,21 @@
     border-color: #333;
     box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
   }
-  
\ No newline at end of file
+
+#filter-box {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    padding: 20px;
+    box-sizing: border-box;
+    backdrop-filter: blur(3px);
+    margin: 10px 0;
+}
+
+#filter-box .MuiFormGroup-root {
+    margin-bottom: 0 !important;
+}
+
+#filter-box > label {
+    margin-right: 15px;
+}
\ No newline at end of file