this repo has no description
lewis.moe
1<script lang="ts">
2 import { getCurrentPath } from './lib/router.svelte'
3 import { initAuth, getAuthState } from './lib/auth.svelte'
4 import Login from './routes/Login.svelte'
5 import Register from './routes/Register.svelte'
6 import Dashboard from './routes/Dashboard.svelte'
7 import AppPasswords from './routes/AppPasswords.svelte'
8 import InviteCodes from './routes/InviteCodes.svelte'
9 import Settings from './routes/Settings.svelte'
10 import Notifications from './routes/Notifications.svelte'
11 import RepoExplorer from './routes/RepoExplorer.svelte'
12 const auth = getAuthState()
13 $effect(() => {
14 initAuth()
15 })
16 function getComponent(path: string) {
17 switch (path) {
18 case '/login':
19 return Login
20 case '/register':
21 return Register
22 case '/dashboard':
23 return Dashboard
24 case '/app-passwords':
25 return AppPasswords
26 case '/invite-codes':
27 return InviteCodes
28 case '/settings':
29 return Settings
30 case '/notifications':
31 return Notifications
32 case '/repo':
33 return RepoExplorer
34 default:
35 return auth.session ? Dashboard : Login
36 }
37 }
38 let currentPath = $derived(getCurrentPath())
39 let CurrentComponent = $derived(getComponent(currentPath))
40</script>
41<main>
42 {#if auth.loading}
43 <div class="loading">
44 <p>Loading...</p>
45 </div>
46 {:else}
47 <CurrentComponent />
48 {/if}
49</main>
50<style>
51 :global(:root) {
52 --bg-primary: #fafafa;
53 --bg-secondary: #f9f9f9;
54 --bg-card: #ffffff;
55 --bg-input: #ffffff;
56 --bg-input-disabled: #f5f5f5;
57 --text-primary: #333333;
58 --text-secondary: #666666;
59 --text-muted: #999999;
60 --border-color: #dddddd;
61 --border-color-light: #cccccc;
62 --accent: #0066cc;
63 --accent-hover: #0052a3;
64 --success-bg: #dfd;
65 --success-border: #8c8;
66 --success-text: #060;
67 --error-bg: #fee;
68 --error-border: #fcc;
69 --error-text: #c00;
70 --warning-bg: #ffd;
71 --warning-text: #660;
72 }
73 @media (prefers-color-scheme: dark) {
74 :global(:root) {
75 --bg-primary: #1a1a1a;
76 --bg-secondary: #242424;
77 --bg-card: #2a2a2a;
78 --bg-input: #333333;
79 --bg-input-disabled: #2a2a2a;
80 --text-primary: #e0e0e0;
81 --text-secondary: #a0a0a0;
82 --text-muted: #707070;
83 --border-color: #404040;
84 --border-color-light: #505050;
85 --accent: #4da6ff;
86 --accent-hover: #7abbff;
87 --success-bg: #1a3d1a;
88 --success-border: #2d5a2d;
89 --success-text: #7bc67b;
90 --error-bg: #3d1a1a;
91 --error-border: #5a2d2d;
92 --error-text: #ff7b7b;
93 --warning-bg: #3d3d1a;
94 --warning-text: #c6c67b;
95 }
96 }
97 :global(body) {
98 margin: 0;
99 font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
100 line-height: 1.5;
101 color: var(--text-primary);
102 background: var(--bg-primary);
103 }
104 :global(*) {
105 box-sizing: border-box;
106 }
107 main {
108 min-height: 100vh;
109 background: var(--bg-primary);
110 }
111 .loading {
112 display: flex;
113 align-items: center;
114 justify-content: center;
115 min-height: 100vh;
116 color: var(--text-secondary);
117 }
118</style>