IBCornelsen/online-energieausweis
1
0
Fork 0
Code Issues 272 Pull Requests Actions Packages Projects 1 Releases Wiki Activity

Mobile Seite schön gemacht und generelle Verbesserungen

Browse Source
This commit is contained in:
Moritz Utcke
2024-03-01 14:33:13 +07:00
parent db7cc9af33
commit 26058e3205
13 changed files with 75 additions and 209 deletions
Download Patch File Download Diff File Expand all files Collapse all files

29
src/components/Dashboard/DashboardSidebar.svelte
View File

@@ -1,12 +1,14 @@
<script lang="ts">
import { ripple } from "svelte-ripple-action";
import type { RippleOptions } from "svelte-ripple-action/dist/constants";
import { Home, Reader, EnvelopeClosed, Cube, Bell, Gear, LockClosed } from "radix-svelte-icons"
import { Home, Reader, EnvelopeClosed, Cube, Bell, Gear, LockClosed, HamburgerMenu } from "radix-svelte-icons"
import NotificationProvider from "#components/NotificationProvider/NotificationProvider.svelte";
import DashboardNotification from "./DashboardNotification.svelte";
import { notifications } from "#components/NotificationProvider/shared";
import ThemeController from "#components/ThemeController.svelte";
import { BenutzerClient } from "#components/Ausweis/types";
import Cross1 from "radix-svelte-icons/src/lib/icons/Cross1.svelte";
import { slide } from "svelte/transition";
export let lightTheme: boolean;
export let benutzer: BenutzerClient;
@@ -15,10 +17,29 @@
center: false,
color: lightTheme ? "rgba(233,233,233,0.1)" : "rgba(113, 128, 150, 0.1)",
};
let headerOpen = false;
</script>
<aside class="hidden md:flex bg-base-100 border-r border-r-base-300 flex-col py-8">
<a href="/" class="px-8"
<header class="fixed top-0 left-0 w-full h-16 flex items-center justify-between px-4 border-b z-20">
<button on:click={() => headerOpen = !headerOpen}>
{#if headerOpen}
<Cross1 size={28}></Cross1>
{:else}
<HamburgerMenu size={28}></HamburgerMenu>
{/if}
</button>
<a href="/" class="block md:hidden"
><img
src="/images/header/logo-big.svg"
class="w-24"
alt="IBCornelsen - Logo"
/></a
>
</header>
<aside class:hidden={!headerOpen} class="fixed left-0 top-16 w-full h-[calc(100%-4rem)] flex z-30 md:relative md:h-auto md:w-auto md:top-0 md:flex bg-base-100 border-r border-r-base-300 flex-col py-8">
<a href="/" class="px-8 hidden md:block"
><img
src="/images/header/logo-big.svg"
class="w-36"
@@ -26,7 +47,7 @@
/></a
>
<div class="menu flex flex-col gap-2 mt-12 px-0">
<div class="menu flex flex-col gap-2 mt-0 md:mt-12 px-0">
<a use:ripple={rippleOptions} class="button-tab" href="/dashboard">
<Home width={22} height={22} />
Home