feat: mobile scale improvements, workflow

This commit is contained in:
Luka Dekanozishvili 2026-02-01 13:14:03 +01:00
parent 2f1a928aa3
commit f14604f219
8 changed files with 117 additions and 67 deletions

View file

@ -1,44 +1,45 @@
<script lang="ts">
import { goto } from "$app/navigation";
import { PUBLIC_BACKEND_API_HOST } from "$env/static/public";
import { auth, setUserLoggedOut } from "./auth.svelte";
// import { goto } from "$app/navigation";
// import { PUBLIC_BACKEND_API_HOST } from "$env/static/public";
// import { auth, setUserLoggedOut } from "./auth.svelte";
import { auth } from "./auth.svelte";
async function toggleMfa() {
try {
const res = await fetch(`${PUBLIC_BACKEND_API_HOST}/api/v1/user/update-mfa`, {
credentials: "include",
method: "PATCH",
headers: { "Content-Type": "application/json" },
body: JSON.stringify({ enable_mfa: auth.isMfaEnabled }),
});
// async function toggleMfa() {
// try {
// const res = await fetch(`${PUBLIC_BACKEND_API_HOST}/api/v1/user/update-mfa`, {
// credentials: "include",
// method: "PATCH",
// headers: { "Content-Type": "application/json" },
// body: JSON.stringify({ enable_mfa: auth.isMfaEnabled }),
// });
if (res.status === 401 || res.status === 500) {
setUserLoggedOut();
goto('/login');
throw new Error('Unauthorized');
} else if (res.status !== 204) {
let msg = await res.text();
throw new Error(`Failed updating MFA: ${msg}`);
}
} catch (err) {
// TODO: show error to user
console.error(err);
auth.isMfaEnabled = !auth.isMfaEnabled;
}
}
// if (res.status === 401 || res.status === 500) {
// setUserLoggedOut();
// goto('/login');
// throw new Error('Unauthorized');
// } else if (res.status !== 204) {
// let msg = await res.text();
// throw new Error(`Failed updating MFA: ${msg}`);
// }
// } catch (err) {
// // TODO: show error to user
// console.error(err);
// auth.isMfaEnabled = !auth.isMfaEnabled;
// }
// }
let { sideMenuOpen = $bindable() } = $props()
let innerWidth: number | null | undefined = $state();
let isMobile: boolean = $derived.by(() =>{
if (!innerWidth) return false;
return innerWidth < 768;
if (!innerWidth) return false;
return innerWidth < 768;
});
let isXs: boolean = $derived.by(() =>{
if (!innerWidth) return false;
return innerWidth < 480;
let isXxs: boolean = $derived.by(() =>{
if (!innerWidth) return false;
return innerWidth < 360;
});
</script>
@ -103,7 +104,7 @@
</div>
{:else}
<div class="xs:gap-4 flex">
{#if isXs}
{#if isXxs}
<a href="/register"><button style="box-shadow: 0 0 10px rgba(0,0,0,0.6)" class="btn btn-primary break-keep whitespace-nowrap rounded-lg">Register</button></a>
{:else}
<a href="/register"><button style="box-shadow: 0 0 10px rgba(0,0,0,0.6)" class="btn btn-primary break-keep whitespace-nowrap rounded-lg">Create an account</button></a>
@ -113,4 +114,4 @@
{/if}
</div>
</div>
<div class="divider bg-primary-content/20 fixed mt-[63px] z-41 h-0.25 w-screen"></div>
<div class="divider bg-primary-content/20 fixed mt-[63px] z-41 h-0.25 w-full"></div>