adjust sticky nav height for desktop

follow up to #347
processing · May 9, 2024 · 88c778b · 88c778b
1 parent 373850f
commit 88c778b
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 1 deletion.
diff --git a/src/components/Settings/index.astro b/src/components/Settings/index.astro
@@ -5,6 +5,7 @@ import {
  removeLocalePrefix,
  getUiTranslator,
 } from "@/src/i18n/utils";
+import { jumpToState } from "@/src/globals/state";
 import { AccessibilitySettings } from "@components/AccessibilitySettings/";
 import SearchForm from "@components/SearchForm/index.astro";
 import { LocaleSelect } from "@components/LocaleSelect";
@@ -72,7 +73,7 @@ const a11ySettingsProps = [
 const { hideSearch } = Astro.props;
 ---
 
-<div class={styles.container}>
+<div class={`${styles.container} ${jumpToState ? "" : "noJumpTo"}`}>
  <div id="settings-placeholder" class={styles.placeholder}></div>
  <div id="settings-hitbox" class={styles.hitbox}></div>
  <div id="settings-container" class={`${styles.wrapper} settings`}>

diff --git a/src/components/Settings/styles.module.scss b/src/components/Settings/styles.module.scss
@@ -93,6 +93,16 @@
  position 0.3s;
 }
 
+.container:global(.noJumpTo) .wrapper:global(.open) {
+ top: 40px;
+ @media (min-width: $breakpoint-tablet) {
+ top: 0px;
+ }
+}
+
 .wrapper:global(.open) {
  top: 80px;
+ @media (min-width: $breakpoint-tablet) {
+ top: 0px;
+ }
 }