From 2c63d431d57f2a457eda7b856733b90e7eda0cc1 Mon Sep 17 00:00:00 2001 From: wukko <me@wukko.me> Date: Tue, 25 Jun 2024 00:12:23 +0600 Subject: [PATCH] web/Sidebar: dynamic settings tab link based on device type --- web/src/components/sidebar/Sidebar.svelte | 17 ++++++++++++++--- 1 file changed, 14 insertions(+), 3 deletions(-) diff --git a/web/src/components/sidebar/Sidebar.svelte b/web/src/components/sidebar/Sidebar.svelte index cc013117..9add0c6b 100644 --- a/web/src/components/sidebar/Sidebar.svelte +++ b/web/src/components/sidebar/Sidebar.svelte @@ -1,4 +1,4 @@ -<script> +<script lang="ts"> import CobaltLogo from "$components/sidebar/CobaltLogo.svelte"; import SidebarTab from "$components/sidebar/SidebarTab.svelte"; @@ -12,9 +12,20 @@ import IconHeart from "@tabler/icons-svelte/IconHeart.svelte"; import IconInfoCircle from "@tabler/icons-svelte/IconInfoCircle.svelte"; - const settingsLink = "/settings/general/appearance"; + let screenWidth: number, + settingsLink: string; + + $: isMobile = screenWidth <= 750; + + $: if (isMobile) { + settingsLink = "/settings"; + } else { + settingsLink = "/settings/general/appearance"; + } </script> +<svelte:window bind:innerWidth={screenWidth} /> + <nav id="sidebar"> <CobaltLogo /> <div id="sidebar-tabs"> @@ -89,7 +100,7 @@ } #sidebar::before { - content: ''; + content: ""; z-index: 1; width: 100%; height: 100%;