-
Notifications
You must be signed in to change notification settings - Fork 5
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
1 parent
7a06043
commit 4d441df
Showing
4 changed files
with
215 additions
and
122 deletions.
There are no files selected for viewing
96 changes: 49 additions & 47 deletions
96
apps/frontend/src/lib/components/navigation/SidebarLink.svelte
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,56 +1,58 @@ | ||
| <script lang="ts"> | ||
| import { page } from '$app/stores'; | ||
| import { sidebarStore } from '$lib/stores'; | ||
| import BarChart3 from 'lucide-svelte/icons/bar-chart-3'; | ||
| import CalendarDays from 'lucide-svelte/icons/calendar-days'; | ||
| import CircleHelp from 'lucide-svelte/icons/circle-help'; | ||
| import Home from 'lucide-svelte/icons/home'; | ||
| import ListTodo from 'lucide-svelte/icons/list-todo'; | ||
| import Mail from 'lucide-svelte/icons/mail'; | ||
| import BookOpenCheck from 'lucide-svelte/icons/book-open-check'; | ||
| import { page } from '$app/stores'; | ||
| import { sidebarStore } from '$lib/stores'; | ||
| import BarChart3 from 'lucide-svelte/icons/bar-chart-3'; | ||
| import CalendarDays from 'lucide-svelte/icons/calendar-days'; | ||
| import CircleHelp from 'lucide-svelte/icons/circle-help'; | ||
| import Home from 'lucide-svelte/icons/home'; | ||
| import ListTodo from 'lucide-svelte/icons/list-todo'; | ||
| import Mail from 'lucide-svelte/icons/mail'; | ||
| import BookOpenCheck from 'lucide-svelte/icons/book-open-check'; | ||
| import { NotebookPen } from 'lucide-svelte'; | ||
| const icons = { | ||
| home: Home, | ||
| schedule: CalendarDays, | ||
| assignments: ListTodo, | ||
| messages: Mail, | ||
| absence: BarChart3, | ||
| grades: BookOpenCheck, | ||
| default: CircleHelp | ||
| }; | ||
| const icons = { | ||
| home: Home, | ||
| schedule: CalendarDays, | ||
| assignments: ListTodo, | ||
| messages: Mail, | ||
| absence: BarChart3, | ||
| grades: BookOpenCheck, | ||
| homework: NotebookPen, | ||
| default: CircleHelp | ||
| }; | ||
| let rawIcon: string = 'default'; | ||
| export { rawIcon as icon }; | ||
| export let href: string; | ||
| export let label: string; | ||
| let rawIcon: string = 'default'; | ||
| export { rawIcon as icon }; | ||
| export let href: string; | ||
| export let label: string; | ||
| // @ts-ignore | ||
| $: icon = icons[rawIcon] ?? icons.default; | ||
| $: active = href === decodeURI($page.url.pathname); | ||
| // @ts-ignore | ||
| $: icon = icons[rawIcon] ?? icons.default; | ||
| $: active = href === decodeURI($page.url.pathname); | ||
| </script> | ||
|
|
||
| <a | ||
| {href} | ||
| class="block unstyled {$sidebarStore.isOpen | ||
| ? 'w-full rounded-r-3xl' | ||
| : 'w-10 ml-4 rounded-3xl'} transition-[border-radius,margin,width] {active | ||
| ? 'bg-primary text-white dark:text-black' | ||
| : 'hover:bg-muted'} cursor-pointer" | ||
| on:click | ||
| on:keydown | ||
| {href} | ||
| class="block unstyled {$sidebarStore.isOpen | ||
| ? 'w-full rounded-r-3xl' | ||
| : 'w-10 ml-4 rounded-3xl'} transition-[border-radius,margin,width] {active | ||
| ? 'bg-primary text-white dark:text-black' | ||
| : 'hover:bg-muted'} cursor-pointer" | ||
| on:click | ||
| on:keydown | ||
| > | ||
| <div class="flex items-center h-10"> | ||
| <div class="shrink-0 {$sidebarStore.isOpen ? 'px-6' : 'px-2'} transition-[padding]"> | ||
| <svelte:component this={icon} class="{active && 'text-white dark:text-black'} size-6" /> | ||
| </div> | ||
| <div class="flex flex-1 overflow-hidden leading-[20px]"> | ||
| <span | ||
| class="{$sidebarStore.isOpen | ||
| ? 'overflow-visible' | ||
| : 'overflow-hidden'} cursor-pointer text-ellipsis text-nowrap" | ||
| > | ||
| {label} | ||
| </span> | ||
| </div> | ||
| </div> | ||
| <div class="flex items-center h-10"> | ||
| <div class="shrink-0 {$sidebarStore.isOpen ? 'px-6' : 'px-2'} transition-[padding]"> | ||
| <svelte:component this={icon} class="{active && 'text-white dark:text-black'} size-6" /> | ||
| </div> | ||
| <div class="flex flex-1 overflow-hidden leading-[20px]"> | ||
| <span | ||
| class="{$sidebarStore.isOpen | ||
| ? 'overflow-visible' | ||
| : 'overflow-hidden'} cursor-pointer text-ellipsis text-nowrap" | ||
| > | ||
| {label} | ||
| </span> | ||
| </div> | ||
| </div> | ||
| </a> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,28 +1,29 @@ | ||
| export const SITE_LINKS = { | ||
| main: { | ||
| label: 'Forslag', | ||
| links: [ | ||
| { href: '/home', label: 'Forside', icon: 'home' }, | ||
| { href: '/skema', label: 'Skema', icon: 'schedule' }, | ||
| { href: '/opgaver', label: 'Opgaver', icon: 'assignments' }, | ||
| { href: '/beskeder', label: 'Beskeder', icon: 'messages' }, | ||
| { href: '/fravær', label: 'Fravær', icon: 'absence' }, | ||
| { href: '/karakterer', label: 'Karakterer', icon: 'grades' } | ||
| ] | ||
| }, | ||
| absence: { | ||
| label: 'Fravær', | ||
| links: [ | ||
| { href: '/fravær', label: 'Fraværsoversigt' }, | ||
| { href: '/fravær', label: 'Fraværsårsager' } | ||
| // { href: '/fravær', label: 'Fraværsregner' } | ||
| ] | ||
| }, | ||
| other: { | ||
| label: 'Andet', | ||
| links: [ | ||
| { href: '/sync', label: 'Google Synkronisering' }, | ||
| { href: '/indstillinger', label: 'Indstillinger' } | ||
| ] | ||
| } | ||
| main: { | ||
| label: 'Forslag', | ||
| links: [ | ||
| { href: '/home', label: 'Forside', icon: 'home' }, | ||
| { href: '/skema', label: 'Skema', icon: 'schedule' }, | ||
| { href: '/opgaver', label: 'Opgaver', icon: 'assignments' }, | ||
| { href: '/beskeder', label: 'Beskeder', icon: 'messages' }, | ||
| { href: '/fravær', label: 'Fravær', icon: 'absence' }, | ||
| { href: '/karakterer', label: 'Karakterer', icon: 'grades' }, | ||
| { href: '/lektier', label: 'Lektier', icon: 'homework' } | ||
| ] | ||
| }, | ||
| absence: { | ||
| label: 'Fravær', | ||
| links: [ | ||
| { href: '/fravær', label: 'Fraværsoversigt' }, | ||
| { href: '/fravær', label: 'Fraværsårsager' } | ||
| // { href: '/fravær', label: 'Fraværsregner' } | ||
| ] | ||
| }, | ||
| other: { | ||
| label: 'Andet', | ||
| links: [ | ||
| { href: '/sync', label: 'Google Synkronisering' }, | ||
| { href: '/indstillinger', label: 'Indstillinger' } | ||
| ] | ||
| } | ||
| }; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,64 @@ | ||
| <script lang="ts"> | ||
| import { homeworkStore } from '$lib/stores'; | ||
| import * as Card from '$lib/components/ui/card'; | ||
| import { onMount } from 'svelte'; | ||
| import SvelteMarkdown from 'svelte-markdown'; | ||
| import NewTabLink from '$lib/components/links/NewTabLink.svelte'; | ||
| import { constructInterval, relativeTime } from '$lib/utils'; | ||
| import Badge from '$lib/components/ui/badge/badge.svelte'; | ||
| import Button from '$lib/components/ui/button/button.svelte'; | ||
| import { ArrowUpRight } from 'lucide-svelte'; | ||
| let loading = true; | ||
| onMount(async () => { | ||
| await homeworkStore.fetch(); | ||
| loading = false; | ||
| console.log($homeworkStore); | ||
| }); | ||
| </script> | ||
|
|
||
| <div class="page-container"> | ||
| <h1>Lektier</h1> | ||
| {#if loading} | ||
| <p>Loading...</p> | ||
| {:else if $homeworkStore} | ||
| {#each $homeworkStore as homework} | ||
| <Card.Root | ||
| class={homework.aktivitet.status?.includes('aflyst') | ||
| ? 'border-destructive dark:border-destructive' | ||
| : ''} | ||
| > | ||
| <Card.Header> | ||
| <Card.Title> | ||
| <Badge class="mb-2"> | ||
| <span | ||
| use:relativeTime={constructInterval( | ||
| homework.aktivitet.tidspunkt | ||
| ).start?.toJSDate() || new Date()} | ||
| /> | ||
| </Badge> | ||
| <p>{homework.aktivitet.hold}</p> | ||
| </Card.Title> | ||
| <Card.Description> | ||
| {homework.aktivitet.navn} | ||
| ⋅ {homework.aktivitet.lokale} | ||
| ⋅ {homework.aktivitet.lærer} | ||
| </Card.Description> | ||
| </Card.Header> | ||
| <Card.Content> | ||
| <SvelteMarkdown | ||
| source={homework.lektier.replaceAll('\n', '<br>')} | ||
| renderers={{ link: NewTabLink }} | ||
| /> | ||
| </Card.Content> | ||
| <Card.Footer> | ||
| <Button size="sm" href={'/modul?absid=' + homework.aktivitet.absid}> | ||
| Gå til modul <ArrowUpRight class="ml-4 size-4" /> | ||
| </Button> | ||
| </Card.Footer> | ||
| </Card.Root> | ||
| {/each} | ||
| {:else} | ||
| <p>No homework</p> | ||
| {/if} | ||
| </div> |