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_GITHUB_AUTH_ENABLED=true
ENV VITE_CAPTCHA_ENABLED=true
ENV VITE_REGISTRATION_DISABLED=True
#ENV VITE_PLAUSIBLE_DATA_URL=
# change working directory
WORKDIR /usr/src/app
+116 -116
View File
@@ -4,7 +4,7 @@ SPDX-FileCopyrightText: 2023 Marlon W (Mawoka)
SPDX-License-Identifier: MPL-2.0
-->
<script lang='ts'>
<script lang="ts">
import '@fontsource/marck-script/index.css';
import { getLocalization } from '$lib/i18n';
import { signedIn, pathname } from '$lib/stores';
@@ -44,149 +44,149 @@ SPDX-License-Identifier: MPL-2.0
</script>
<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'>
<a href='/' class='font-black tracking-tight text-xl text-black marck-script link-hover'
>ClassQuiz</a
<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"
>ClassQuiz</a
>
<div class='flex justify-center'>
<div class="flex justify-center">
<a
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
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
>
</div>
<div class='flex justify-end'>
<div class="flex justify-end">
<button
class='lg:hidden dark:text-black'
id='open-menu'
class="lg:hidden dark:text-black"
id="open-menu"
on:click={toggleMenu}
class:hidden={!openMenu}
aria-label='Open navbar'
aria-label="Open navbar"
>
<svg
xmlns='http://www.w3.org/2000/svg'
width='24'
height='24'
viewBox='0 0 24 24'
fill='none'
stroke='currentColor'
stroke-width='2'
stroke-linecap='round'
stroke-linejoin='round'
display='block'
id='TextAlignJustified'
xmlns="http://www.w3.org/2000/svg"
width="24"
height="24"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
stroke-width="2"
stroke-linecap="round"
stroke-linejoin="round"
display="block"
id="TextAlignJustified"
>
<path d='M3 6h18M3 12h18M3 18h18' />
<path d="M3 6h18M3 12h18M3 18h18" />
</svg>
</button>
<!-- Close menu -->
<button
class='hidden dark:text-black'
id='close-menu'
class="hidden dark:text-black"
id="close-menu"
class:hidden={openMenu}
on:click={toggleMenu}
aria-label='Close navbar'
aria-label="Close navbar"
>
<svg
xmlns='http://www.w3.org/2000/svg'
width='14'
height='14'
viewBox='0 0 24 24'
fill='none'
stroke='currentColor'
stroke-width='3'
stroke-linecap='round'
stroke-linejoin='round'
display='block'
id='Cross'
xmlns="http://www.w3.org/2000/svg"
width="14"
height="14"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
stroke-width="3"
stroke-linecap="round"
stroke-linejoin="round"
display="block"
id="Cross"
>
<path d='M20 20L4 4m16 0L4 20' />
<path d="M20 20L4 4m16 0L4 20" />
</svg>
</button>
</div>
</section>
<ul id='menu-items' class='lg:flex w-full flex-col lg:flex-row' class:hidden={openMenu}>
<li class='py-2 lg:hidden'>
<BrownButton href='https://mawoka.eu/donate' target='_blank'
>{$t('navbar.donate')} <span class=''>❤️</span></BrownButton
<ul id="menu-items" class="lg:flex w-full flex-col lg:flex-row" class:hidden={openMenu}>
<li class="py-2 lg:hidden">
<BrownButton href="https://mawoka.eu/donate" target="_blank"
>{$t('navbar.donate')} <span class="">❤️</span></BrownButton
>
</li>
{#if $signedIn}
<li class='py-2'>
<li class="py-2">
<a
class='text-lg font-medium lg:px-4 text-gray-600 hover:text-green-600 link-hover'
href='/dashboard'>{$t('words.dashboard')}</a
class="text-lg font-medium lg:px-4 text-gray-600 hover:text-green-600 link-hover"
href="/dashboard">{$t('words.dashboard')}</a
>
</li>
<li class='py-2'>
<li class="py-2">
<a
class='text-lg font-medium lg:px-4 text-gray-600 hover:text-green-600 link-hover'
href='/explore'>{$t('words.explore')}</a
class="text-lg font-medium lg:px-4 text-gray-600 hover:text-green-600 link-hover"
href="/explore">{$t('words.explore')}</a
>
</li>
<li class='py-2'>
<li class="py-2">
<a
class='text-lg font-medium lg:px-4 text-gray-600 hover:text-green-600 link-hover'
href='/search'>{$t('words.search')}</a
class="text-lg font-medium lg:px-4 text-gray-600 hover:text-green-600 link-hover"
href="/search">{$t('words.search')}</a
>
</li>
<li class='py-2'>
<li class="py-2">
<a
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
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
>
</li>
{:else}
{#if !import.meta.env.VITE_REGISTRATION_DISABLED}
<li class='py-2'>
<li class="py-2">
<a
class='text-lg font-medium lg:px-4 text-gray-600 hover:text-green-600 link-hover'
href='/account/register'>{$t('words.register')}</a
class="text-lg font-medium lg:px-4 text-gray-600 hover:text-green-600 link-hover"
href="/account/register">{$t('words.register')}</a
>
</li>
{/if}
<li class='py-2'>
<li class="py-2">
<a
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
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
>
</li>
<li class='py-2'>
<li class="py-2">
<a
class='text-lg font-medium lg:px-4 text-gray-600 hover:text-green-600 link-hover'
href='/explore'>{$t('words.explore')}</a
class="text-lg font-medium lg:px-4 text-gray-600 hover:text-green-600 link-hover"
href="/explore">{$t('words.explore')}</a
>
</li>
<li class='py-2'>
<li class="py-2">
<a
class='text-lg font-medium lg:px-4 text-gray-600 hover:text-green-600 link-hover'
href='/search'>{$t('words.search')}</a
class="text-lg font-medium lg:px-4 text-gray-600 hover:text-green-600 link-hover"
href="/search">{$t('words.search')}</a
>
</li>
<li class='py-2'>
<li class="py-2">
<a
target='_blank'
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
target="_blank"
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
>
</li>
<li class='py-2'>
<li class="py-2">
<a
class='text-lg font-medium lg:px-4 text-gray-600 hover:text-green-600 link-hover'
href='/docs'>{$t('words.docs')}</a
class="text-lg font-medium lg:px-4 text-gray-600 hover:text-green-600 link-hover"
href="/docs">{$t('words.docs')}</a
>
</li>
{/if}
</ul>
<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'>
<BrownButton href='https://mawoka.eu/donate' target='_blank'
>{$t('navbar.donate')} <span class=''>❤️</span></BrownButton
<div class="whitespace-nowrap hidden lg:block">
<BrownButton href="https://mawoka.eu/donate" target="_blank"
>{$t('navbar.donate')} <span class="">❤️</span></BrownButton
>
</div>
{#if darkMode}
@@ -195,23 +195,23 @@ SPDX-License-Identifier: MPL-2.0
switchDarkMode(false);
}}
use:tippy={{ content: 'Switch light mode on' }}
aria-label='Activate light mode'
aria-label="Activate light mode"
>
<!-- Heroicons: sun -->
<svg
class='w-6 h-6 text-black'
fill='none'
aria-label='Sun-Icon'
stroke='currentColor'
viewBox='0 0 24 24'
xmlns='http://www.w3.org/2000/svg'
class="w-6 h-6 text-black"
fill="none"
aria-label="Sun-Icon"
stroke="currentColor"
viewBox="0 0 24 24"
xmlns="http://www.w3.org/2000/svg"
>
<path
stroke-linecap='round'
stroke-linejoin='round'
stroke-width='2'
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'
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
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"
/>
</svg>
</button>
@@ -220,23 +220,23 @@ SPDX-License-Identifier: MPL-2.0
on:click={() => {
switchDarkMode(true);
}}
aria-label='Activate darkmode'
aria-label="Activate darkmode"
use:tippy={{ content: 'Switch dark mode on' }}
>
<!-- Heroicons: moon -->
<svg
aria-label='Moon-Icon'
class='w-6 h-6'
fill='none'
stroke='currentColor'
viewBox='0 0 24 24'
xmlns='http://www.w3.org/2000/svg'
aria-label="Moon-Icon"
class="w-6 h-6"
fill="none"
stroke="currentColor"
viewBox="0 0 24 24"
xmlns="http://www.w3.org/2000/svg"
>
<path
stroke-linecap='round'
stroke-linejoin='round'
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'
stroke-linecap="round"
stroke-linejoin="round"
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"
/>
</svg>
</button>
@@ -245,20 +245,20 @@ SPDX-License-Identifier: MPL-2.0
</nav>
<style>
.heart {
animation: heartbeat 1s linear infinite;
}
.heart {
animation: heartbeat 1s linear infinite;
}
@keyframes heartbeat {
0% {
transform: scale(1);
}
50% {
transform: scale(2);
}
100% {
transform: scale(2);
opacity: 0;
}
}
@keyframes heartbeat {
0% {
transform: scale(1);
}
50% {
transform: scale(2);
}
100% {
transform: scale(2);
opacity: 0;
}
}
</style>