Sidebar activestates
continuous-integration/drone/push Build is passing Details

This commit is contained in:
Nicolai Ort 2021-08-21 19:45:14 +02:00
parent 092762011d
commit a3c379a813
Signed by: niggl
GPG Key ID: 13AFA55AF62F269F
1 changed files with 14 additions and 2 deletions

View File

@ -2,8 +2,11 @@
import UserStore from '$lib/UserStore';
import { onDestroy } from 'svelte';
import Apiclient from './Apiclient';
import { page } from '$app/stores';
$: logged_in = false;
$: currentPage = $page.path;
console.log(currentPage)
const unsubscribe = UserStore.subscribe((value) => {
logged_in = value.isLoggedIn;
@ -21,7 +24,6 @@
class="flex flex-col w-64 h-screen px-4 py-8 bg-white border-r dark:bg-gray-800 dark:border-gray-600"
>
<h2 class="text-3xl font-semibold text-gray-800 dark:text-white">LinkyLinky</h2>
<div class="relative mt-6">
<span class="absolute inset-y-0 left-0 flex items-center pl-3">
<svg class="w-5 h-5 text-gray-400" viewBox="0 0 24 24" fill="none">
@ -45,7 +47,9 @@
<div class="flex flex-col justify-between flex-1 mt-6">
<nav>
<a
class="flex items-center px-4 py-2 text-gray-700 bg-gray-200 rounded-md dark:bg-gray-700 dark:text-gray-200"
class="flex items-center px-4 py-2 text-gray-700 rounded-md dark:text-gray-200"
class:dark:bg-gray-700={currentPage == '/'}
class:bg-gray-200={currentPage == '/'}
href="./"
>
<svg class="w-5 h-5" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
@ -66,6 +70,8 @@
{#if logged_in}
<a
class="flex items-center px-4 py-2 mt-5 text-gray-600 transition-colors duration-200 transform rounded-md dark:text-gray-400 hover:bg-gray-200 dark:hover:bg-gray-700 dark:hover:text-gray-200 hover:text-gray-700"
class:dark:bg-gray-700={currentPage == '/links'}
class:bg-gray-200={currentPage == '/links'}
href="./links"
>
<svg
@ -87,6 +93,8 @@
</a>
<a
class="flex items-center px-4 py-2 mt-5 text-gray-600 transition-colors duration-200 transform rounded-md dark:text-gray-400 hover:bg-gray-200 dark:hover:bg-gray-700 dark:hover:text-gray-200 hover:text-gray-700"
class:dark:bg-gray-700={currentPage == '/visits'}
class:bg-gray-200={currentPage == '/visits'}
href="./visits"
>
<svg
@ -115,6 +123,8 @@
<!-- <a
class="flex items-center px-4 py-2 mt-5 text-gray-600 transition-colors duration-200 transform rounded-md dark:text-gray-400 hover:bg-gray-200 dark:hover:bg-gray-700 dark:hover:text-gray-200 hover:text-gray-700"
class:dark:bg-gray-700={currentPage=="/"}
class:bg-gray-200={currentPage=="/"}
href="#"
>
<svg class="w-5 h-5" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
@ -160,6 +170,8 @@
{:else}
<a
class="flex items-center px-4 py-2 mt-5 text-gray-600 transition-colors duration-200 transform rounded-md dark:text-gray-400 hover:bg-gray-200 dark:hover:bg-gray-700 dark:hover:text-gray-200 hover:text-gray-700"
class:dark:bg-gray-700={currentPage == '/login'}
class:bg-gray-200={currentPage == '/login'}
href="./login"
>
<svg