-
Notifications
You must be signed in to change notification settings - Fork 38
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
Showing
49 changed files
with
1,657 additions
and
1,448 deletions.
There are no files selected for viewing
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,21 +1,24 @@ | ||
<!DOCTYPE html> | ||
<html lang="en"> | ||
<head> | ||
<meta charset="utf-8" /> | ||
<link rel="icon" type="image/png" sizes="512x512" href="%sveltekit.assets%/icons/icon.png"> | ||
<link rel="mask-icon" href="%sveltekit.assets%/safari-pinned-tab.svg" color="#37919b"> | ||
<meta name="msapplication-TileColor" content="#ffffff"> | ||
<meta name="theme-color" content="#ffffff"> | ||
<link rel="stylesheet" href="%sveltekit.assets%/global.css" /> | ||
<link rel="apple-touch-icon" href="/icons/apple-touch-icon.png"> | ||
<meta name="viewport" content="width=device-width, initial-scale=1" /> | ||
%sveltekit.head% | ||
<link rel="preconnect" href="https://fonts.googleapis.com" /> | ||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin /> | ||
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap" rel="stylesheet" /> | ||
</head> | ||
<head> | ||
<meta charset="utf-8" /> | ||
<link rel="icon" type="image/png" sizes="512x512" href="%sveltekit.assets%/icons/icon.png" /> | ||
<link rel="mask-icon" href="%sveltekit.assets%/safari-pinned-tab.svg" color="#37919b" /> | ||
<meta name="msapplication-TileColor" content="#ffffff" /> | ||
<meta name="theme-color" content="#ffffff" /> | ||
<link rel="stylesheet" href="%sveltekit.assets%/global.css" /> | ||
<link rel="apple-touch-icon" href="/icons/apple-touch-icon.png" /> | ||
<meta name="viewport" content="width=device-width, initial-scale=1" /> | ||
%sveltekit.head% | ||
<link rel="preconnect" href="https://fonts.googleapis.com" /> | ||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin /> | ||
<link | ||
href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap" | ||
rel="stylesheet" | ||
/> | ||
</head> | ||
|
||
<body> | ||
<div class="h-full overflow-hidden contents">%sveltekit.body%</div> | ||
</body> | ||
<body> | ||
<div class="h-full overflow-hidden contents">%sveltekit.body%</div> | ||
</body> | ||
</html> |
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,4 +1,4 @@ | ||
html, | ||
body { | ||
@apply h-full overflow-hidden; | ||
@apply h-full overflow-hidden; | ||
} |
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 |
---|---|---|
@@ -1,11 +1,11 @@ | ||
<script> | ||
import { fly } from "svelte/transition"; | ||
export let url = ""; | ||
const pageTransitionDuration = 500; | ||
import { fly } from 'svelte/transition'; | ||
export let url = ''; | ||
const pageTransitionDuration = 500; | ||
</script> | ||
|
||
{#key url} | ||
<div in:fly="{{ y: -50, duration: 250, delay: 300 }}" out:fly="{{ y: -50, duration: 250 }}"> | ||
<slot /> | ||
</div> | ||
<div in:fly={{ y: -50, duration: 250, delay: 300 }} out:fly={{ y: -50, duration: 250 }}> | ||
<slot /> | ||
</div> | ||
{/key} |
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,18 +1,18 @@ | ||
<script lang="ts"> | ||
import type { Course } from "tutors-reader-lib/src/models/course"; | ||
import { TopicNavigator } from "tutors-ui"; | ||
import { Accordion, AccordionItem } from "@skeletonlabs/skeleton"; | ||
import type { Course } from 'tutors-reader-lib/src/models/course'; | ||
import { TopicNavigator } from 'tutors-ui'; | ||
import { Accordion, AccordionItem } from '@skeletonlabs/skeleton'; | ||
export let course: Course; | ||
export let course: Course; | ||
</script> | ||
|
||
<Accordion regionPanel='space-y-0.5'> | ||
{#each course.topics as topic} | ||
<AccordionItem> | ||
<svelte:fragment slot="summary">{topic.lo.title}</svelte:fragment> | ||
<svelte:fragment slot="content"> | ||
<TopicNavigator topic="{topic}" /> | ||
</svelte:fragment> | ||
</AccordionItem> | ||
{/each} | ||
<Accordion regionPanel="space-y-0.5"> | ||
{#each course.topics as topic} | ||
<AccordionItem> | ||
<svelte:fragment slot="summary">{topic.lo.title}</svelte:fragment> | ||
<svelte:fragment slot="content"> | ||
<TopicNavigator {topic} /> | ||
</svelte:fragment> | ||
</AccordionItem> | ||
{/each} | ||
</Accordion> |
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,125 +1,149 @@ | ||
<script lang="ts"> | ||
import { type DrawerSettings, drawerStore, popup, modeCurrent, setModeCurrent } from "@skeletonlabs/skeleton"; | ||
import { layout, storeTheme } from "tutors-reader-lib/src/stores/stores"; | ||
import moment from "moment"; | ||
import { Icon } from "tutors-ui"; | ||
import { | ||
type DrawerSettings, | ||
drawerStore, | ||
popup, | ||
modeCurrent, | ||
setModeCurrent | ||
} from '@skeletonlabs/skeleton'; | ||
import { layout, storeTheme } from 'tutors-reader-lib/src/stores/stores'; | ||
import moment from 'moment'; | ||
import { Icon } from 'tutors-ui'; | ||
function applyInitialLayout() { | ||
layout.set("expanded"); | ||
} | ||
function applyInitialLayout() { | ||
layout.set('expanded'); | ||
} | ||
function toggleLayout() { | ||
if ($layout === "compacted") { | ||
layout.set("expanded"); | ||
} else { | ||
layout.set("compacted"); | ||
} | ||
} | ||
function toggleLayout() { | ||
if ($layout === 'compacted') { | ||
layout.set('expanded'); | ||
} else { | ||
layout.set('compacted'); | ||
} | ||
} | ||
const themeBuilderDrawerOpen: any = () => { | ||
const settings: DrawerSettings = { id: "theme", position: "right", width: "w-full md:w-3/4" }; | ||
drawerStore.open(settings); | ||
}; | ||
const themeBuilderDrawerOpen: any = () => { | ||
const settings: DrawerSettings = { id: 'theme', position: 'right', width: 'w-full md:w-3/4' }; | ||
drawerStore.open(settings); | ||
}; | ||
var isHalloween: boolean = false; | ||
var isValentines: boolean = false; | ||
var isHalloween: boolean = false; | ||
var isValentines: boolean = false; | ||
const now = moment(); | ||
const halloweenStart = moment("19/10/____", "DD/MM/____"); | ||
const halloweenEnd = moment("02/11/____", "DD/MM/____"); | ||
if (now.isBetween(halloweenStart, halloweenEnd, "days", "[]")) { | ||
isHalloween = true; | ||
} | ||
const valentinesStart = moment("02/02/____", "DD/MM/____"); | ||
const valentinesEnd = moment("16/02/____", "DD/MM/____"); | ||
if (now.isBetween(valentinesStart, valentinesEnd, "days", "[]")) { | ||
isValentines = true; | ||
} | ||
const now = moment(); | ||
const halloweenStart = moment('19/10/____', 'DD/MM/____'); | ||
const halloweenEnd = moment('02/11/____', 'DD/MM/____'); | ||
if (now.isBetween(halloweenStart, halloweenEnd, 'days', '[]')) { | ||
isHalloween = true; | ||
} | ||
const valentinesStart = moment('02/02/____', 'DD/MM/____'); | ||
const valentinesEnd = moment('16/02/____', 'DD/MM/____'); | ||
if (now.isBetween(valentinesStart, valentinesEnd, 'days', '[]')) { | ||
isValentines = true; | ||
} | ||
applyInitialLayout(); | ||
applyInitialLayout(); | ||
</script> | ||
|
||
<div class="relative"> | ||
<button class="btn btn-sm" use:popup="{{ event: 'click', target: 'design' }}"> | ||
<Icon type="dark" /> | ||
<span class="hidden text-sm font-bold lg:block">Layout <span class="pl-2 opacity-50">▾</span></span> | ||
</button> | ||
<nav class="list-nav card card-body p-4 w-56 space-y-4 shadow-lg" data-popup="design"> | ||
<h6>Toggles</h6> | ||
<ul> | ||
<li class="option !p-0"> | ||
<button class="btn w-full flex justify-between" on:click="{setModeCurrent(!$modeCurrent)}"> | ||
<span class="flex-none">Dark Mode</span> | ||
{#if $modeCurrent} | ||
<Icon icon="fluent:weather-moon-48-filled" color="rgba(var(--color-warning-500))" /> | ||
{:else} | ||
<Icon icon="fluent:weather-sunny-32-filled" color="rgba(var(--color-warning-500))" /> | ||
{/if} | ||
</button> | ||
</li> | ||
<!-- svelte-ignore a11y-click-events-have-key-events --> | ||
<li class="option !p-0" on:click="{() => toggleLayout()}"> | ||
<button class="btn w-full flex justify-between"> | ||
<span class="flex-none">Compact</span> | ||
<Icon type="{$layout}" /> | ||
</button> | ||
</li> | ||
</ul> | ||
<hr /> | ||
<h6>Themes</h6> | ||
<ul class="list"> | ||
<!-- svelte-ignore a11y-click-events-have-key-events --> | ||
<li | ||
class="option !p-0" | ||
on:click="{() => { | ||
storeTheme.set('tutors'); | ||
}}"> | ||
<button class="btn w-full flex justify-between" class:!variant-soft-primary="{$storeTheme === 'tutors'}"> | ||
<span class="flex-none">Tutors</span> | ||
</button> | ||
</li> | ||
<!-- svelte-ignore a11y-click-events-have-key-events --> | ||
<li | ||
class="option !p-0" | ||
on:click="{() => { | ||
storeTheme.set('dyslexia'); | ||
}}"> | ||
<button class="btn w-full flex justify-between" class:!variant-soft-primary="{$storeTheme === 'dyslexia'}"> | ||
<span class="flex-none">Dyslexia</span> | ||
</button> | ||
</li> | ||
<!-- svelte-ignore a11y-click-events-have-key-events --> | ||
{#if isHalloween} | ||
<li | ||
class="option !p-0" | ||
on:click="{() => { | ||
storeTheme.set('halloween'); | ||
}}"> | ||
<button class="btn w-full flex justify-between" class:!variant-soft-primary="{$storeTheme === 'halloween'}"> | ||
<span class="flex-none">Halloween</span> | ||
</button> | ||
</li> | ||
{/if} | ||
<!-- svelte-ignore a11y-click-events-have-key-events --> | ||
{#if isValentines} | ||
<li | ||
class="option !p-0" | ||
on:click="{() => { | ||
storeTheme.set('valentines'); | ||
}}"> | ||
<button class="btn w-full flex justify-between" class:!variant-soft-primary="{$storeTheme === 'valentines'}"> | ||
<span class="flex-none">Valentines</span> | ||
</button> | ||
</li> | ||
{/if} | ||
<button class="btn btn-sm" use:popup={{ event: 'click', target: 'design' }}> | ||
<Icon type="dark" /> | ||
<span class="hidden text-sm font-bold lg:block" | ||
>Layout <span class="pl-2 opacity-50">▾</span></span | ||
> | ||
</button> | ||
<nav class="list-nav card card-body p-4 w-56 space-y-4 shadow-lg" data-popup="design"> | ||
<h6>Toggles</h6> | ||
<ul> | ||
<li class="option !p-0"> | ||
<button class="btn w-full flex justify-between" on:click={setModeCurrent(!$modeCurrent)}> | ||
<span class="flex-none">Dark Mode</span> | ||
{#if $modeCurrent} | ||
<Icon icon="fluent:weather-moon-48-filled" color="rgba(var(--color-warning-500))" /> | ||
{:else} | ||
<Icon icon="fluent:weather-sunny-32-filled" color="rgba(var(--color-warning-500))" /> | ||
{/if} | ||
</button> | ||
</li> | ||
<!-- svelte-ignore a11y-click-events-have-key-events --> | ||
<li class="option !p-0" on:click={() => toggleLayout()}> | ||
<button class="btn w-full flex justify-between"> | ||
<span class="flex-none">Compact</span> | ||
<Icon type={$layout} /> | ||
</button> | ||
</li> | ||
</ul> | ||
<hr /> | ||
<h6>Themes</h6> | ||
<ul class="list"> | ||
<!-- svelte-ignore a11y-click-events-have-key-events --> | ||
<li | ||
class="option !p-0" | ||
on:click={() => { | ||
storeTheme.set('tutors'); | ||
}} | ||
> | ||
<button | ||
class="btn w-full flex justify-between" | ||
class:!variant-soft-primary={$storeTheme === 'tutors'} | ||
> | ||
<span class="flex-none">Tutors</span> | ||
</button> | ||
</li> | ||
<!-- svelte-ignore a11y-click-events-have-key-events --> | ||
<li | ||
class="option !p-0" | ||
on:click={() => { | ||
storeTheme.set('dyslexia'); | ||
}} | ||
> | ||
<button | ||
class="btn w-full flex justify-between" | ||
class:!variant-soft-primary={$storeTheme === 'dyslexia'} | ||
> | ||
<span class="flex-none">Dyslexia</span> | ||
</button> | ||
</li> | ||
<!-- svelte-ignore a11y-click-events-have-key-events --> | ||
{#if isHalloween} | ||
<li | ||
class="option !p-0" | ||
on:click={() => { | ||
storeTheme.set('halloween'); | ||
}} | ||
> | ||
<button | ||
class="btn w-full flex justify-between" | ||
class:!variant-soft-primary={$storeTheme === 'halloween'} | ||
> | ||
<span class="flex-none">Halloween</span> | ||
</button> | ||
</li> | ||
{/if} | ||
<!-- svelte-ignore a11y-click-events-have-key-events --> | ||
{#if isValentines} | ||
<li | ||
class="option !p-0" | ||
on:click={() => { | ||
storeTheme.set('valentines'); | ||
}} | ||
> | ||
<button | ||
class="btn w-full flex justify-between" | ||
class:!variant-soft-primary={$storeTheme === 'valentines'} | ||
> | ||
<span class="flex-none">Valentines</span> | ||
</button> | ||
</li> | ||
{/if} | ||
|
||
<hr /> | ||
<!-- svelte-ignore a11y-click-events-have-key-events --> | ||
<li class="option !p-0" on:click="{themeBuilderDrawerOpen}"> | ||
<button class="btn w-full flex justify-between"> | ||
<span class="flex-none">Theme Builder</span> | ||
</button> | ||
</li> | ||
</ul> | ||
</nav> | ||
<hr /> | ||
<!-- svelte-ignore a11y-click-events-have-key-events --> | ||
<li class="option !p-0" on:click={themeBuilderDrawerOpen}> | ||
<button class="btn w-full flex justify-between"> | ||
<span class="flex-none">Theme Builder</span> | ||
</button> | ||
</li> | ||
</ul> | ||
</nav> | ||
</div> |
Oops, something went wrong.