fix: add SVG icons for the menu close and open buttons as well

package.json

@@ -1,6 +1,6 @@
 {
   "name": "olahbarbershop-website",
-  "version": "2.1.3",
+  "version": "2.1.4",
   "description": "The website of Oláh Barbershop, made using SvelteKit.",
   "author": "pml68",
   "license": "GPL-3.0",

src/app.scss

@@ -74,6 +74,10 @@ body {
   font-size: clamp($min-font, $desired-font, $max-font);
 }
 
+.nav-bar label img {
+  width: calc(clamp($min-font, $desired-font, $max-font) * 1.1);
+} 
+
 .open-menu , .close-menu {
   position: absolute;
   color: #fff;

src/routes/+layout.svelte

@@ -1,6 +1,8 @@
 <script lang="ts">
   import '../app.scss'
   import icon from '$lib/assets/icon.png'
+  import timesIcon from '$lib/assets/xmark-solid.svg'
+  import barsIcon from '$lib/assets/bars-solid.svg'
   import { base } from '$app/paths'
   import { navigating } from '$app/stores'
 
@@ -65,9 +67,9 @@
         <li><a use:menuEffect={23} href={locations} class="locations" data-value="Locations">Locations</a></li>
         <li><a use:menuEffect={30} href={contact} class="contact" data-value="Contact">Contact</a></li>
         <li><a use:menuEffect={42} href={about} class="about" data-value="About">About</a></li>
-        <label for="check" class="close-menu"><i class="fas fa-times"></i></label>
+        <label for="check" class="close-menu"><img src={timesIcon} alt="Close menu"></label>
       </span>
-      <label for="check" class="open-menu"><i class="fas fa-bars"></i></label>
+      <label for="check" class="open-menu"><img src={barsIcon} alt="Open menu"></label>
     </ul>
   </nav>
 </header>

src/routes/services/+page.svelte

@@ -1,7 +1,7 @@
 <script lang="ts">
   import { onMount } from "svelte"
   import '$lib/assets/css/modulardata.scss'
-  import icon from '$lib/assets/scissors-solid.svg'
+  import scissorsIcon from '$lib/assets/scissors-solid.svg'
 
   const baseURL: string = import.meta.env.VITE_BASE_URL ? import.meta.env.VITE_BASE_URL : 'https://olahbarbershop.codes'
 
@@ -39,7 +39,7 @@
       {#each services as { name, description, amount }}
         <div class="service">
           <p>
-            <img class="service-icon" src={icon} alt="Scissors">
+            <img class="service-icon" src={scissorsIcon} alt="Scissors">
           </p>
           <br>
           <p>