web/settings: fix header on mobile at certain scales

This commit is contained in:
wukko 2024-07-14 20:52:22 +06:00
parent 1712dc8948
commit ad3703ab73
No known key found for this signature in database
GPG key ID: 3E30B3F26C7B4AA2
2 changed files with 7 additions and 3 deletions

View file

@ -17,7 +17,7 @@
href="/settings/{tabLink}" href="/settings/{tabLink}"
class:active={isActive} class:active={isActive}
role="button" role="button"
> >
<div class="settings-tab-left"> <div class="settings-tab-left">
<div class="tab-icon" style="background: var(--{iconColor})"> <div class="tab-icon" style="background: var(--{iconColor})">
<slot></slot> <slot></slot>

View file

@ -46,8 +46,8 @@
<svelte:window bind:innerWidth={screenWidth} /> <svelte:window bind:innerWidth={screenWidth} />
<div id="settings-page"> <div id="settings-page">
<div id="settings-sidebar"> <div id="settings-sidebar" class:back-visible={!isHome && isMobile}>
<div id="settings-header" class:back-visible={!isHome && isMobile}> <div id="settings-header">
{#if isMobile} {#if isMobile}
{#if !isHome} {#if !isHome}
<a <a
@ -165,6 +165,10 @@
padding-top: var(--settings-padding); padding-top: var(--settings-padding);
} }
#settings-sidebar.back-visible {
overflow: visible;
}
#settings-sidebar { #settings-sidebar {
gap: 24px; gap: 24px;
} }