Skip to content

Commit

Permalink
style: enforce code styling
Browse files Browse the repository at this point in the history
  • Loading branch information
jouwdan committed Jul 29, 2023
1 parent 14f028a commit f73645f
Show file tree
Hide file tree
Showing 49 changed files with 1,657 additions and 1,448 deletions.
37 changes: 20 additions & 17 deletions apps/course/src/app.html
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>
2 changes: 1 addition & 1 deletion apps/course/src/app.postcss
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;
}
28 changes: 14 additions & 14 deletions apps/course/src/environment.ts
Original file line number Diff line number Diff line change
Expand Up @@ -9,21 +9,21 @@ const tutorStoreId = import.meta.env.VITE_tutors_store_id;
const tutorStoreSecret = import.meta.env.VITE_tutors_store_secret;

const keys = {
auth0: {
clientId: clientId,
domain: domain,
customdomain: customdomain,
redirectUri: redirectUri
},
firebase: {
apiKey: apiKey,
databaseURL: databaseUrl,
projectId: projectId,
tutorStoreId: tutorStoreId,
tutorStoreSecret: tutorStoreSecret
}
auth0: {
clientId: clientId,
domain: domain,
customdomain: customdomain,
redirectUri: redirectUri
},
firebase: {
apiKey: apiKey,
databaseURL: databaseUrl,
projectId: projectId,
tutorStoreId: tutorStoreId,
tutorStoreSecret: tutorStoreSecret
}
};

export function getKeys() {
return keys;
return keys;
}
12 changes: 6 additions & 6 deletions apps/course/src/lib/PageTransition.svelte
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}
26 changes: 13 additions & 13 deletions apps/course/src/lib/navigators/CourseNavigator.svelte
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>
250 changes: 137 additions & 113 deletions apps/course/src/lib/navigators/LayoutMenu.svelte
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>
Loading

0 comments on commit f73645f

Please sign in to comment.