schoolbox web extension :)
0
fork

Configure Feed

Select the types of activity you want to include in your feed.

refactor: import svelte state

willow f2bfd59f 90bef098

+9 -12
+4 -3
src/entrypoints/popup/App.svelte
··· 9 9 10 10 import { flavors } from "@catppuccin/palette"; 11 11 import { needsRefresh } from "@/utils/storage"; 12 + import { globalSettings } from "#imports"; 12 13 13 14 const routes = { 14 15 "/": Home, ··· 16 17 "/themes": Themes, 17 18 "/snippets": Snippets, 18 19 }; 19 - 20 - let flavour = $derived(globalSettings.state.themeFlavour); 21 20 22 21 async function refreshSchoolboxURLs() { 23 22 logger.info("[App.svelte] Refreshing all Schoolbox URLs"); ··· 39 38 let accentRgb = $derived(getAccentRgb(globalSettings.state.themeAccent, globalSettings.state.themeFlavour)); 40 39 </script> 41 40 42 - <main class="flex flex-col items-center bg-ctp-base p-6 {flavour}" style="--ctp-accent: {accentRgb}"> 41 + <main 42 + class="flex flex-col items-center bg-ctp-base p-6 {globalSettings.state.themeFlavour}" 43 + style="--ctp-accent: {accentRgb}"> 43 44 <nav class="mb-4 flex rounded-xl px-4 py-2 text-ctp-text" id="navbar"> 44 45 <a href="#/" class="navbutton-left" use:active={{ className: "active" }}>Settings</a> 45 46 <a href="#/plugins" class="navbutton-center" use:active={{ className: "active" }}>Plugins</a>
+5 -9
src/entrypoints/popup/routes/Home.svelte
··· 1 1 <script lang="ts"> 2 2 import Footer from "../components/Footer.svelte"; 3 - 4 - let label = $derived(globalSettings.state.global ? "enabled" : "disabled"); 5 - let classList = $derived( 6 - globalSettings.state.global 7 - ? "bg-ctp-green hover:bg-(--ctp-accent) active:bg-ctp-red/75" 8 - : "bg-ctp-red hover:bg-(--ctp-accent) active:bg-ctp-green/75", 9 - ); 3 + import { globalSettings } from "#imports"; 10 4 </script> 11 5 12 6 <div id="card"> 13 7 <h1 class="mb-6">Schooltape</h1> 14 8 15 9 <button 16 - class={classList} 10 + class={globalSettings.state.global 11 + ? "bg-ctp-green hover:bg-(--ctp-accent) active:bg-ctp-red/75" 12 + : "bg-ctp-red hover:bg-(--ctp-accent) active:bg-ctp-green/75"} 17 13 id="toggle" 18 14 onclick={() => { 19 15 globalSettings.set({ global: !globalSettings.get().global }); 20 16 }} 21 - >{label} 17 + >{globalSettings.state.global ? "enabled" : "disabled"} 22 18 </button> 23 19 </div> 24 20