LobotomyLabs/classquiz-ai
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

♻️ Moved buttons into own components

Browse Source
This commit is contained in:
Mawoka
2023-01-27 22:25:57 +01:00
parent 0083b1552a
commit 2d05ee26bd
6 changed files with 102 additions and 69 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/routes/account/settings/+page.svelte
+11 -12
View File
@@ -9,6 +9,7 @@
import { UAParser } from 'ua-parser-js';
import Spinner from '$lib/Spinner.svelte';
import { onMount } from 'svelte';
import BrownButton from '$lib/components/buttons/brown.svelte';
const { t } = getLocalization();
@@ -176,11 +177,11 @@
</p>
</div>
<div class="p-4 flex justify-center">
<a
href="/account/settings/security"
class="text-lg rounded-lg bg-[#B07156] p-2 hover:bg-opacity-80 transition h-fit m-auto"
>Security-Settings</a
>
<div class="m-auto">
<BrownButton href="/account/settings/security"
>Security-Settings
</BrownButton>
</div>
</div>
</div>
<div>
@@ -206,13 +207,11 @@
bind:value={changePasswordData.newPasswordConfirm}
/></label
>
<button
class="border-2 px-2 py-1 rounded-md border-black text-slate-100 hover:bg-amber-700 hover:text-indigo-100 transition duration-75 disabled:cursor-not-allowed disabled:opacity-50"
disabled={!passwordChangeDataValid}
type="submit"
>
{$t('settings_page.change_password_submit')}
</button>
<div>
<BrownButton disabled={!passwordChangeDataValid} type="submit">
{$t('settings_page.change_password_submit')}
</BrownButton>
</div>
</form>
<div>
<button on:click={add_api_key}>Add API-Key</button>
frontend/src/routes/account/settings/security/+page.svelte
+14 -23
View File
@@ -9,6 +9,7 @@
import { startRegistration } from '@simplewebauthn/browser';
import TotpSetup from './totp_setup.svelte';
import BackupCodes from './backup_codes.svelte';
import BrownButton from '$lib/components/buttons/brown.svelte';
let user_data: object | undefined;
let security_keys: Array<{ id: number }> | undefined;
@@ -102,11 +103,9 @@
<div class="h-full w-full border-r-2 border-black">
<h2 class="text-center text-2xl">Backup-Code</h2>
<div class="flex h-full w-full justify-center">
<button
class="m-auto text-lg rounded-lg bg-[#B07156] p-4 hover:bg-opacity-80 transition"
on:click={get_backup_code}
>Get Backup-Codes
</button>
<div class="m-auto">
<BrownButton on:click={get_backup_code}>Get Backup-Codes</BrownButton>
</div>
</div>
</div>
<div class="h-full w-full">
@@ -171,11 +170,9 @@
{/if}
</div>
<div class="flex justify-center">
<button
on:click={add_security_key}
class="m-auto rounded-lg bg-[#B07156] p-2 hover:bg-opacity-80 transition m-2"
>Add Security-Key</button
>
<div class="m-auto">
<BrownButton on:click={add_security_key}>Add Security-Key</BrownButton>
</div>
</div>
<div class="flex justify-center">
<ul class="list-disc block">
@@ -203,19 +200,13 @@
</div>
<div class="flex justify-center">
{#if totp_activated}
<button
on:click={disable_totp}
class="m-auto rounded-lg bg-[#B07156] p-2 hover:bg-opacity-80 transition m-2"
>Disable Totp</button
>
{:else}
<button
on:click={enable_totp}
class="m-auto rounded-lg bg-[#B07156] p-2 hover:bg-opacity-80 transition m-2"
>Enable Totp</button
>
{/if}
<div class="m-auto">
{#if totp_activated}
<BrownButton on:click={disable_totp}>Disable Totp</BrownButton>
{:else}
<BrownButton on:click={enable_totp}>Enable Totp</BrownButton>
{/if}
</div>
</div>
</div>
</div>
frontend/src/routes/dashboard/+page.svelte
+6 -20
View File
@@ -10,6 +10,7 @@
import { navbarVisible, signedIn } from '$lib/stores';
import Spinner from '$lib/Spinner.svelte';
import Fuse from 'fuse.js';
import BrownButton from '$lib/components/buttons/brown.svelte';
interface QuizData {
id: string;
@@ -100,27 +101,12 @@
Primary
</button>-->
<div class="w-full grid grid-cols-4 gap-2">
<a
href="/create"
class="px-4 py-2 leading-5 text-black dark:text-white transition-colors duration-200 transform bg-[#B07156] rounded text-center focus:outline-none disabled:cursor-not-allowed disabled:opacity-50 dark:hover:bg-gray-600 text-white"
>{$t('words.create')}
</a>
<a
href="/import"
class="px-4 py-2 leading-5 text-black dark:text-white transition-colors duration-200 transform bg-[#B07156] rounded text-center focus:outline-none disabled:cursor-not-allowed disabled:opacity-50 dark:hover:bg-gray-600 text-white"
>{$t('words.import')}
</a>
<a
href="/api/v1/users/logout"
class="px-4 py-2 leading-5 text-black dark:text-white transition-colors duration-200 transform bg-[#B07156] rounded text-center focus:outline-none disabled:cursor-not-allowed disabled:opacity-50 dark:hover:bg-gray-600 text-white"
>{$t('words.logout')}
</a>
<a
href="/account/settings"
class="px-4 py-2 leading-5 text-black dark:text-white transition-colors duration-200 transform bg-[#B07156] rounded text-center focus:outline-none disabled:cursor-not-allowed disabled:opacity-50 dark:hover:bg-gray-600 text-white"
>
<BrownButton href="/create">{$t('words.create')}</BrownButton>
<BrownButton href="/import">{$t('words.import')}</BrownButton>
<BrownButton href="/api/v1/users/logout">{$t('words.logout')}</BrownButton>
<BrownButton href="/account/settings">
{$t('words.settings')}
</a>
</BrownButton>
</div>
{#if quizzes.length !== 0}
{#await import('$lib/dashboard/main_slider.svelte')}