lfk/frontend
2
0
Fork 0
Code Issues 3 Pull Requests Actions Projects Releases Wiki Activity

almost fixed...

Browse Source
This commit is contained in:
Philipp Dormann 2021-04-07 21:28:21 +02:00
parent 0acaffbdfa
commit 495a6b22bd
2 changed files with 280 additions and 282 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
package.json
View File

@ -13,7 +13,7 @@
"check-password-strength": "2.0.2", "check-password-strength": "2.0.2",
"@odit/lfk-client-js": "0.10.1", "@odit/lfk-client-js": "0.10.1",
"@odit/license-exporter": "0.0.11", "@odit/license-exporter": "0.0.11",
"@sveltejs/vite-plugin-svelte": "1.0.0-next.5", "@sveltejs/vite-plugin-svelte": "1.0.0-next.6",
"@types/html-minifier": "4.0.0", "@types/html-minifier": "4.0.0",
"auto-changelog": "2.2.1", "auto-changelog": "2.2.1",
"autoprefixer": "10.2.5", "autoprefixer": "10.2.5",
@ -28,12 +28,12 @@
"svelte-i18n": "3.3.9", "svelte-i18n": "3.3.9",
"svelte-preprocess": "4.7.0", "svelte-preprocess": "4.7.0",
"svelte-select": "3.17.0", "svelte-select": "3.17.0",
"tailwindcss": "2.0.4", "tailwindcss": "2.1.1",
"tinro": "0.6.1", "tinro": "0.6.1",
"toastify-js": "1.10.0", "toastify-js": "1.10.0",
"validator": "13.5.2", "validator": "13.5.2",
"vite": "2.1.5", "vite": "2.1.5",
"vite-plugin-windicss": "0.12.2", "vite-plugin-windicss": "0.12.5",
"xlsx": "0.16.9" "xlsx": "0.16.9"
}, },
"release-it": { "release-it": {

30
src/components/dashboard/Dashboard.svelte
View File

@ -1,33 +1,30 @@
<script> <script>
import { clickOutside } from "../base/outsideclick";
import { _ } from "svelte-i18n"; import { _ } from "svelte-i18n";
import localForage from "localforage"; import localForage from "localforage";
import store from "../../store"; import store from "../../store";
import { router } from "tinro"; import { router } from "tinro";
import NoComponentLoaded from "../base/NoComponentLoaded.svelte"; import NoComponentLoaded from "../base/NoComponentLoaded.svelte";
import { AuthService } from "@odit/lfk-client-js"; import { AuthService } from "@odit/lfk-client-js";
import { onMount } from "svelte"; $: navOpen = true;
$: navOpen = false;
function logout() { function logout() {
localForage.clear(); localForage.clear();
location.replace("/"); location.replace("/");
} }
// onMount(()=>{
// navOpen=true;
// })
</script> </script>
<section class="min-h-screen bg-gray-50"> <section class="min-h-screen bg-gray-50">
<nav {#if navOpen}
<div
class:-translate-x-full={!navOpen} class:-translate-x-full={!navOpen}
class:translate-x-0={navOpen} class:translate-x-0={navOpen}
class="select-none fixed top-0 left-0 z-20 h-full pb-10 overflow-x-hidden overflow-y-auto transition origin-left transform border-r w-60 md:translate-x-0 bg-gray-50"> class="select-none fixed top-0 left-0 z-20 h-full pb-10 overflow-x-hidden overflow-y-auto transition origin-left transform border-r w-60 md:translate-x-0 bg-gray-50">
<a href="/" class="flex items-center px-4 py-5"> <a href="/" class="flex items-center px-4 py-5">
<img src="/lfk-logo.png" alt="Logo" class="h-10" /> <img src="/lfk-logo.png" alt="Logo" class="h-10" />
<h3 class="text-lg">Lauf für Kaya! Admin</h3> <h3 class="text-lg">Lauf für Kaya! Admin</h3>
</a> </a>
<nav class="text-sm font-medium text-gray-600" aria-label="Main Navigation"> <nav
class="text-sm font-medium text-gray-600"
aria-label="Main Navigation">
<a <a
class:bg-gray-100={$router.path === '/'} class:bg-gray-100={$router.path === '/'}
class="flex items-center px-4 py-3 transition cursor-pointer group hover:bg-gray-100 hover:text-gray-900" class="flex items-center px-4 py-3 transition cursor-pointer group hover:bg-gray-100 hover:text-gray-900"
@ -303,14 +300,16 @@ import { onMount } from "svelte";
<span>{$_('logout')}</span> <span>{$_('logout')}</span>
</span> </span>
</nav> </nav>
</nav> </div>
{/if}
<div class="ml-0 transition md:ml-60"> <div class="ml-0 transition md:ml-60">
<header <header
class="flex items-center justify-between w-full px-4 bg-white border-b h-14 md:hidden">
<button
on:click={() => { on:click={() => {
navOpen = true; navOpen = true;
}} }}
class="flex items-center justify-between w-full px-4 bg-white border-b h-14 md:hidden"> class="block btn btn-light md:hidden">
<button class="block btn btn-light md:hidden">
<span class="sr-only">Menu</span><svg <span class="sr-only">Menu</span><svg
class="w-4 h-4" class="w-4 h-4"
xmlns="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg"
@ -324,14 +323,13 @@ import { onMount } from "svelte";
<NoComponentLoaded /> <NoComponentLoaded />
</slot> </slot>
</div> </div>
{#if navOpen} {#if navOpen === true}
<div <div
on:click={() => { on:click={() => {
navOpen = false; navOpen = false;
console.log({ navOpen }); console.log({ navOpen });
}} }}
class:bg-opacity-0={!navOpen} class:hidden={!navOpen}
class:bg-opacity-25={navOpen} class="fixed inset-0 z-10 w-screen h-screen bg-black bg-opacity-25 md:hidden" />
class="fixed inset-0 z-10 w-screen h-screen bg-black md:hidden bg-opacity-0" />
{/if} {/if}
</section> </section>