First commit

2025-01-24 16:01:59 +00:00
commit eccc7e5a07
55 changed files with 4565 additions and 0 deletions
--- a/src/lib/HeaderBar.svelte
+++ b/src/lib/HeaderBar.svelte
@@ -0,0 +1,68 @@
+<script lang="ts">
+    import { page } from "$app/stores";
+</script>
+
+<div id="header-bar">
+    <div id="logo-box">
+        <a href="/">
+            <img class="logo-img" src="/logo/logo-colour.svg" alt="FJLA Logo" width="50" height="50">
+            <!--<img class="logo-img" id="logo-black" src="/logo/logo-black.svg" alt="FJLA Logo" width="50" height="50">
+        --> </a>
+    </div>
+    {#if $page.data.session}
+      <a class="account-link" href="/logout">Sign out</a>
+    {/if}
+</div>
+<div id="spacer"></div>
+
+<style>
+    #header-bar {
+        position: fixed;
+        top: 0;
+        left: 0;
+        width: 100%;
+        background-color: darkslategrey;
+        height: 60px;
+    }
+
+    #logo-box {
+        padding: 5px;
+        height: 50px;
+    }
+
+    .logo-img {
+        position: absolute;
+        left: 5px;
+    }
+
+    .account-link {
+    position: absolute;
+    right: 10px;
+    top: 0px;
+    height: 60px;
+    width: 140px;
+    color: white;
+    background-color: darkslategrey;
+    font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
+    font-weight: 900;
+    font-size: larger;
+    text-decoration: none;
+    text-align: center;
+    border-radius: 0px;
+
+    /* Flexbox styles for centering */
+    display: flex;
+    align-items: center;
+    justify-content: center;
+}
+
+
+    .account-link:hover {
+        background-color: rgb(54, 90, 90);
+    }
+
+    #spacer {
+        height: 90px;
+    }
+
+</style>