mobile menu icons changed to font awesome

uncomputable · Nov 19, 2024 · 798b324 · 798b324
1 parent e5ea636
commit 798b324
Show file tree

Hide file tree

Showing 5 changed files with 13 additions and 20 deletions.
diff --git a/src/assets/images/hamburger.svg b/src/assets/images/hamburger.svg
diff --git a/src/assets/images/hamburger_close.svg b/src/assets/images/hamburger_close.svg
diff --git a/src/assets/style/components/navbar.scss b/src/assets/style/components/navbar.scss
@@ -98,9 +98,12 @@
     .hamburger{
         display: none;
         position: absolute;
-        top: 12px;
+        top: 10px;
         right: 10px;
-        width: 34px;
+
+        &:before{
+            font-size: 34px;
+        }
 
         @media screen and (max-width: 1000px) {
             display: inline-block;
@@ -110,9 +113,12 @@
     .hamburger-close{
         display: none;
         position: absolute;
-        top: 12px;
-        right: 10px;
-        width: 34px;
+        top: 10px;
+        right: 14px;
+
+        &:before{
+            font-size: 34px;
+        }
 
         @media screen and (max-width: 1000px) {
             display: inline-block;

diff --git a/src/assets/style/components/tab_content.scss b/src/assets/style/components/tab_content.scss
@@ -84,10 +84,6 @@
     font-weight: 700;
     line-height: normal;
     margin-bottom: 12px;
-
-    &.has-buttons{
-
-    }
 }
 
 .tab-title-group{

diff --git a/src/components/program_window/mod.rs b/src/components/program_window/mod.rs
@@ -40,9 +40,9 @@ pub fn ProgramWindow() -> impl IntoView {
             <HelpButton />
 
             {move || if !mobile_open.get() {
-                view! { <img class="hamburger" src="/images/hamburger.svg" on:click=move |_| set_mobile_open.set(true) /> }
+                view! { <i class="fa-solid fa-bars hamburger" on:click=move |_| set_mobile_open.set(true)></i>}
             } else {
-                view! { <img class="hamburger-close" src="/images/hamburger_close.svg" on:click=move |_| set_mobile_open.set(false) /> }
+                view! { <i class="fa-solid fa-xmark hamburger-close" on:click=move |_| set_mobile_open.set(false)></i> }
             }}
         </Toolbar>
         <ProgramTab />