Fixed formatting

This commit is contained in:
Mawoka
2023-08-23 18:17:20 +02:00
parent e819adcb4c
commit 743782fb42
2 changed files with 117 additions and 116 deletions
+1
View File
@@ -16,6 +16,7 @@ ENV VITE_HCAPTCHA=ee81b2a1-acf3-4d20-b2a4-a7ea94c7eba5
ENV VITE_GOOGLE_AUTH_ENABLED=true ENV VITE_GOOGLE_AUTH_ENABLED=true
ENV VITE_GITHUB_AUTH_ENABLED=true ENV VITE_GITHUB_AUTH_ENABLED=true
ENV VITE_CAPTCHA_ENABLED=true ENV VITE_CAPTCHA_ENABLED=true
ENV VITE_REGISTRATION_DISABLED=True
#ENV VITE_PLAUSIBLE_DATA_URL= #ENV VITE_PLAUSIBLE_DATA_URL=
# change working directory # change working directory
WORKDIR /usr/src/app WORKDIR /usr/src/app
+116 -116
View File
@@ -4,7 +4,7 @@ SPDX-FileCopyrightText: 2023 Marlon W (Mawoka)
SPDX-License-Identifier: MPL-2.0 SPDX-License-Identifier: MPL-2.0
--> -->
<script lang='ts'> <script lang="ts">
import '@fontsource/marck-script/index.css'; import '@fontsource/marck-script/index.css';
import { getLocalization } from '$lib/i18n'; import { getLocalization } from '$lib/i18n';
import { signedIn, pathname } from '$lib/stores'; import { signedIn, pathname } from '$lib/stores';
@@ -44,149 +44,149 @@ SPDX-License-Identifier: MPL-2.0
</script> </script>
<nav <nav
class='w-screen px-4 lg:px-10 py-2 flex flex-col lg:flex-row lg:items-center fixed backdrop-blur-2xl bg-white/70 shadow-md z-30 top-0' class="w-screen px-4 lg:px-10 py-2 flex flex-col lg:flex-row lg:items-center fixed backdrop-blur-2xl bg-white/70 shadow-md z-30 top-0"
> >
<section class='w-full lg:w-max grid grid-cols-3 lg:grid-cols-2'> <section class="w-full lg:w-max grid grid-cols-3 lg:grid-cols-2">
<a href='/' class='font-black tracking-tight text-xl text-black marck-script link-hover' <a href="/" class="font-black tracking-tight text-xl text-black marck-script link-hover"
>ClassQuiz</a >ClassQuiz</a
> >
<div class='flex justify-center'> <div class="flex justify-center">
<a <a
class='lg:pl-6 text-lg font-medium lg:px-4 text-gray-600 hover:text-green-600 link-hover' class="lg:pl-6 text-lg font-medium lg:px-4 text-gray-600 hover:text-green-600 link-hover"
href='/play'>{$t('words.play')}</a href="/play">{$t('words.play')}</a
> >
</div> </div>
<div class='flex justify-end'> <div class="flex justify-end">
<button <button
class='lg:hidden dark:text-black' class="lg:hidden dark:text-black"
id='open-menu' id="open-menu"
on:click={toggleMenu} on:click={toggleMenu}
class:hidden={!openMenu} class:hidden={!openMenu}
aria-label='Open navbar' aria-label="Open navbar"
> >
<svg <svg
xmlns='http://www.w3.org/2000/svg' xmlns="http://www.w3.org/2000/svg"
width='24' width="24"
height='24' height="24"
viewBox='0 0 24 24' viewBox="0 0 24 24"
fill='none' fill="none"
stroke='currentColor' stroke="currentColor"
stroke-width='2' stroke-width="2"
stroke-linecap='round' stroke-linecap="round"
stroke-linejoin='round' stroke-linejoin="round"
display='block' display="block"
id='TextAlignJustified' id="TextAlignJustified"
> >
<path d='M3 6h18M3 12h18M3 18h18' /> <path d="M3 6h18M3 12h18M3 18h18" />
</svg> </svg>
</button> </button>
<!-- Close menu --> <!-- Close menu -->
<button <button
class='hidden dark:text-black' class="hidden dark:text-black"
id='close-menu' id="close-menu"
class:hidden={openMenu} class:hidden={openMenu}
on:click={toggleMenu} on:click={toggleMenu}
aria-label='Close navbar' aria-label="Close navbar"
> >
<svg <svg
xmlns='http://www.w3.org/2000/svg' xmlns="http://www.w3.org/2000/svg"
width='14' width="14"
height='14' height="14"
viewBox='0 0 24 24' viewBox="0 0 24 24"
fill='none' fill="none"
stroke='currentColor' stroke="currentColor"
stroke-width='3' stroke-width="3"
stroke-linecap='round' stroke-linecap="round"
stroke-linejoin='round' stroke-linejoin="round"
display='block' display="block"
id='Cross' id="Cross"
> >
<path d='M20 20L4 4m16 0L4 20' /> <path d="M20 20L4 4m16 0L4 20" />
</svg> </svg>
</button> </button>
</div> </div>
</section> </section>
<ul id='menu-items' class='lg:flex w-full flex-col lg:flex-row' class:hidden={openMenu}> <ul id="menu-items" class="lg:flex w-full flex-col lg:flex-row" class:hidden={openMenu}>
<li class='py-2 lg:hidden'> <li class="py-2 lg:hidden">
<BrownButton href='https://mawoka.eu/donate' target='_blank' <BrownButton href="https://mawoka.eu/donate" target="_blank"
>{$t('navbar.donate')} <span class=''>❤️</span></BrownButton >{$t('navbar.donate')} <span class="">❤️</span></BrownButton
> >
</li> </li>
{#if $signedIn} {#if $signedIn}
<li class='py-2'> <li class="py-2">
<a <a
class='text-lg font-medium lg:px-4 text-gray-600 hover:text-green-600 link-hover' class="text-lg font-medium lg:px-4 text-gray-600 hover:text-green-600 link-hover"
href='/dashboard'>{$t('words.dashboard')}</a href="/dashboard">{$t('words.dashboard')}</a
> >
</li> </li>
<li class='py-2'> <li class="py-2">
<a <a
class='text-lg font-medium lg:px-4 text-gray-600 hover:text-green-600 link-hover' class="text-lg font-medium lg:px-4 text-gray-600 hover:text-green-600 link-hover"
href='/explore'>{$t('words.explore')}</a href="/explore">{$t('words.explore')}</a
> >
</li> </li>
<li class='py-2'> <li class="py-2">
<a <a
class='text-lg font-medium lg:px-4 text-gray-600 hover:text-green-600 link-hover' class="text-lg font-medium lg:px-4 text-gray-600 hover:text-green-600 link-hover"
href='/search'>{$t('words.search')}</a href="/search">{$t('words.search')}</a
> >
</li> </li>
<li class='py-2'> <li class="py-2">
<a <a
class='text-lg font-medium lg:px-4 text-gray-600 hover:text-green-600 link-hover' class="text-lg font-medium lg:px-4 text-gray-600 hover:text-green-600 link-hover"
href='/api/v1/users/logout'>{$t('words.logout')}</a href="/api/v1/users/logout">{$t('words.logout')}</a
> >
</li> </li>
{:else} {:else}
{#if !import.meta.env.VITE_REGISTRATION_DISABLED} {#if !import.meta.env.VITE_REGISTRATION_DISABLED}
<li class='py-2'> <li class="py-2">
<a <a
class='text-lg font-medium lg:px-4 text-gray-600 hover:text-green-600 link-hover' class="text-lg font-medium lg:px-4 text-gray-600 hover:text-green-600 link-hover"
href='/account/register'>{$t('words.register')}</a href="/account/register">{$t('words.register')}</a
> >
</li> </li>
{/if} {/if}
<li class='py-2'> <li class="py-2">
<a <a
class='text-lg font-medium lg:px-4 text-gray-600 hover:text-green-600 link-hover' class="text-lg font-medium lg:px-4 text-gray-600 hover:text-green-600 link-hover"
href='/account/login?returnTo={$pathname}'>{$t('words.login')}</a href="/account/login?returnTo={$pathname}">{$t('words.login')}</a
> >
</li> </li>
<li class='py-2'> <li class="py-2">
<a <a
class='text-lg font-medium lg:px-4 text-gray-600 hover:text-green-600 link-hover' class="text-lg font-medium lg:px-4 text-gray-600 hover:text-green-600 link-hover"
href='/explore'>{$t('words.explore')}</a href="/explore">{$t('words.explore')}</a
> >
</li> </li>
<li class='py-2'> <li class="py-2">
<a <a
class='text-lg font-medium lg:px-4 text-gray-600 hover:text-green-600 link-hover' class="text-lg font-medium lg:px-4 text-gray-600 hover:text-green-600 link-hover"
href='/search'>{$t('words.search')}</a href="/search">{$t('words.search')}</a
> >
</li> </li>
<li class='py-2'> <li class="py-2">
<a <a
target='_blank' target="_blank"
class='text-lg font-medium lg:px-4 text-gray-600 hover:text-green-600 link-hover' class="text-lg font-medium lg:px-4 text-gray-600 hover:text-green-600 link-hover"
href='https://github.com/mawoka-myblock/ClassQuiz'>GitHub</a href="https://github.com/mawoka-myblock/ClassQuiz">GitHub</a
> >
</li> </li>
<li class='py-2'> <li class="py-2">
<a <a
class='text-lg font-medium lg:px-4 text-gray-600 hover:text-green-600 link-hover' class="text-lg font-medium lg:px-4 text-gray-600 hover:text-green-600 link-hover"
href='/docs'>{$t('words.docs')}</a href="/docs">{$t('words.docs')}</a
> >
</li> </li>
{/if} {/if}
</ul> </ul>
<div <div
class='justify-self-end gap-2 h-full flex justify-center items-center lg:relative fixed right-12 -top-1/2 pt-11 lg:right-0 lg:top-0 lg:p-0' class="justify-self-end gap-2 h-full flex justify-center items-center lg:relative fixed right-12 -top-1/2 pt-11 lg:right-0 lg:top-0 lg:p-0"
> >
<div class='whitespace-nowrap hidden lg:block'> <div class="whitespace-nowrap hidden lg:block">
<BrownButton href='https://mawoka.eu/donate' target='_blank' <BrownButton href="https://mawoka.eu/donate" target="_blank"
>{$t('navbar.donate')} <span class=''>❤️</span></BrownButton >{$t('navbar.donate')} <span class="">❤️</span></BrownButton
> >
</div> </div>
{#if darkMode} {#if darkMode}
@@ -195,23 +195,23 @@ SPDX-License-Identifier: MPL-2.0
switchDarkMode(false); switchDarkMode(false);
}} }}
use:tippy={{ content: 'Switch light mode on' }} use:tippy={{ content: 'Switch light mode on' }}
aria-label='Activate light mode' aria-label="Activate light mode"
> >
<!-- Heroicons: sun --> <!-- Heroicons: sun -->
<svg <svg
class='w-6 h-6 text-black' class="w-6 h-6 text-black"
fill='none' fill="none"
aria-label='Sun-Icon' aria-label="Sun-Icon"
stroke='currentColor' stroke="currentColor"
viewBox='0 0 24 24' viewBox="0 0 24 24"
xmlns='http://www.w3.org/2000/svg' xmlns="http://www.w3.org/2000/svg"
> >
<path <path
stroke-linecap='round' stroke-linecap="round"
stroke-linejoin='round' stroke-linejoin="round"
stroke-width='2' stroke-width="2"
stroke='currentColor' stroke="currentColor"
d='M12 3v1m0 16v1m9-9h-1M4 12H3m15.364 6.364l-.707-.707M6.343 6.343l-.707-.707m12.728 0l-.707.707M6.343 17.657l-.707.707M16 12a4 4 0 11-8 0 4 4 0 018 0z' d="M12 3v1m0 16v1m9-9h-1M4 12H3m15.364 6.364l-.707-.707M6.343 6.343l-.707-.707m12.728 0l-.707.707M6.343 17.657l-.707.707M16 12a4 4 0 11-8 0 4 4 0 018 0z"
/> />
</svg> </svg>
</button> </button>
@@ -220,23 +220,23 @@ SPDX-License-Identifier: MPL-2.0
on:click={() => { on:click={() => {
switchDarkMode(true); switchDarkMode(true);
}} }}
aria-label='Activate darkmode' aria-label="Activate darkmode"
use:tippy={{ content: 'Switch dark mode on' }} use:tippy={{ content: 'Switch dark mode on' }}
> >
<!-- Heroicons: moon --> <!-- Heroicons: moon -->
<svg <svg
aria-label='Moon-Icon' aria-label="Moon-Icon"
class='w-6 h-6' class="w-6 h-6"
fill='none' fill="none"
stroke='currentColor' stroke="currentColor"
viewBox='0 0 24 24' viewBox="0 0 24 24"
xmlns='http://www.w3.org/2000/svg' xmlns="http://www.w3.org/2000/svg"
> >
<path <path
stroke-linecap='round' stroke-linecap="round"
stroke-linejoin='round' stroke-linejoin="round"
stroke-width='2' stroke-width="2"
d='M20.354 15.354A9 9 0 018.646 3.646 9.003 9.003 0 0012 21a9.003 9.003 0 008.354-5.646z' d="M20.354 15.354A9 9 0 018.646 3.646 9.003 9.003 0 0012 21a9.003 9.003 0 008.354-5.646z"
/> />
</svg> </svg>
</button> </button>
@@ -245,20 +245,20 @@ SPDX-License-Identifier: MPL-2.0
</nav> </nav>
<style> <style>
.heart { .heart {
animation: heartbeat 1s linear infinite; animation: heartbeat 1s linear infinite;
} }
@keyframes heartbeat { @keyframes heartbeat {
0% { 0% {
transform: scale(1); transform: scale(1);
} }
50% { 50% {
transform: scale(2); transform: scale(2);
} }
100% { 100% {
transform: scale(2); transform: scale(2);
opacity: 0; opacity: 0;
} }
} }
</style> </style>