ui tweaks

src/routes/+layout.svelte

@@ -86,7 +86,7 @@
             --background-2: #26292a;
             --background-3: #282828;
             
-            --strong-shadow: #8883 0px 0px 10px;
+            --strong-shadow: #8882 0px 0px 50px;
             --medium-shadow: #0002 0px 5px 10px;
             --weak-shadow: #fff3 0px 0px 14px;
             --window-shadow: #4442 0px 5px 10px;

src/routes/+page.svelte

@@ -7,14 +7,17 @@
     
     import { load } from './helper.js';
 	import { notify } from './notification_store';
+	import { onMount } from 'svelte';
     
     // load("https://walrus-app-mwr59.ondigitalocean.app/api/fac/all").then(faculties => {
     //     console.table(faculties);
     // })
 
-    notify({
-        state: "notification",
-        message: "the website is still a work in progress please be patient and report any bugs you find. dont start contributing just yet",
+    onMount(()=>{
+        notify({
+            state: "notification",
+            message: "the website is still a work in progress please be patient and report any bugs you find. dont start contributing just yet",
+        })
     })
 
 </script>

src/routes/Faculty.svelte

@@ -34,7 +34,9 @@
                 </div>
             {/each}
         </div>
+        {#if selected_group_id != -1}
         <hr>
+        {/if}
         <div class="collumn">
             {#each modules as module}
                 <!-- svelte-ignore a11y-click-events-have-key-events -->
@@ -56,7 +58,9 @@
                 </div>
             {/each}
         </div>
+        {#if selected_group_id != -1 && selected_module_id != -1}
         <hr>
+        {/if}
         <div class="collumn">
             {#if selected_module_id !== -1}
             {#await load(`https://walrus-app-mwr59.ondigitalocean.app/api/module/${selected_module_id}/getcount/`) then counts}

src/routes/Notification.svelte

@@ -1,21 +1,30 @@
 <script>
-	import { onMount } from 'svelte';
+    import { onMount, onDestroy } from 'svelte';
 
     export let state = "error"
     export let message = "an error must have occured"
     export let id = 0
     export let duration = 30*1000
 
     import {delete_notification} from './notification_store'
-    setTimeout(()=>delete_notification(id), duration)
     let time = 0;
-    onMount(()=>{
-        let update_time = _ => {
-            time += 16
-            requestAnimationFrame(update_time)
+    let interval;
+
+    onMount(() => {
+        interval = setInterval(() => {
+            time += 50;
+            if (time >= duration) {
+                delete_notification(id);
+                clearInterval(interval);
+            }
+        }, 50);
+    });
+
+    onDestroy(() => {
+        if (interval) {
+            clearInterval(interval);
         }
-        update_time()
-    })
+    });
 </script>
 
 <main class={state}>