svelte/Header: Add lock icon

Turbo87 · Turbo87 · commit 6c3610bfaec0 · 2025-12-15T16:23:36.000+01:00
diff --git a/svelte/src/lib/assets/lock.svg b/svelte/src/lib/assets/lock.svg
@@ -0,0 +1,3 @@
+<svg width="10" height="13" viewBox="0 0 10 13" xmlns="http://www.w3.org/2000/svg">
+    <path d="M1.0102859,6 C1.03905014,4.33379691 1.13776768,3.49239071 1.42224585,2.6000634 C1.95609947,0.925516001 3.14318008,1.38283345e-10 5,-1.42108547e-14 C6.85681992,-1.38311491e-10 8.04390053,0.925516001 8.57775415,2.6000634 C8.86223232,3.49239071 8.96094986,4.33379691 8.9897141,6 L10,6 L10,13 L0,13 L0,6 L1.0102859,6 Z M3,6 L7,6 C7,4.19107867 6.94223555,3.4941306 6.67224585,2.87821705 C6.3955179,2.24693189 5.96002992,2 5,2 C3.32473074,2 3,2.74079144 3,6 Z" fill="currentColor" />
+</svg>
diff --git a/svelte/src/lib/components/Header.svelte b/svelte/src/lib/components/Header.svelte
@@ -2,6 +2,7 @@
   import { resolve } from '$app/paths';
 
   import logo from '$lib/assets/cargo.png';
+  import LockIcon from '$lib/assets/lock.svg?component';
 
   // TODO: import ColorSchemeMenu from './ColorSchemeMenu.svelte';
   // TODO: import Dropdown from './Dropdown.svelte';
@@ -10,7 +11,6 @@
   // TODO: import UserAvatar from './UserAvatar.svelte';
 
   // TODO: import session service
-  // TODO: import lock icon SVG
 
   interface Props {
     hero?: boolean;
@@ -57,7 +57,7 @@
       <!--   <Dropdown data-test-user-menu> ... </Dropdown> -->
       <!-- {:else} -->
       <button type="button" class="login-button button-reset" data-test-login-button>
-        <!-- TODO: add lock icon -->
+        <LockIcon />
         Log in with GitHub
       </button>
       <!-- {/if} -->
@@ -245,13 +245,11 @@
     */
   }
 
-  /* TODO: uncomment when lock icon is added
-  .login-icon {
+  .login-button :global(svg) {
     width: 1em;
     margin-right: var(--space-2xs);
     opacity: 0.5;
   }
-  */
 
   /* TODO: uncomment when UserAvatar is implemented
   .avatar {
