fix: #1096 (navbar) (up);

Betarena · Mar 7, 2023 · 5753c4a · 5753c4a
1 parent ef1af3b
commit 5753c4a
Show file tree

Hide file tree

Showing 2 changed files with 28 additions and 2 deletions.
diff --git a/src/lib/components/_Platform_alert.svelte b/src/lib/components/_Platform_alert.svelte
@@ -5,10 +5,36 @@
 <script lang="ts">
 	import type { Cache_Single_Lang_Header_Translation_Response } from '$lib/models/navbar/types';
 	import { sessionStore } from '$lib/store/session';
+	import { viewport_change } from '$lib/utils/platform-functions';
+	import { onMount } from 'svelte';
 
 	export let HEADER_TRANSLATION_DATA: Cache_Single_Lang_Header_Translation_Response;
 
 	let show: boolean = true;
+
+  // ~~~~~~~~~~~~~~~~~~~~~
+	// VIEWPORT CHANGES | IMPORTANT
+	// ~~~~~~~~~~~~~~~~~~~~~
+
+	const TABLET_VIEW = 1160;
+	const MOBILE_VIEW = 560;
+	let mobileExclusive, tabletExclusive: boolean = false;
+
+	onMount(async () => {
+		[tabletExclusive, mobileExclusive] =
+			viewport_change(TABLET_VIEW, MOBILE_VIEW);
+		window.addEventListener(
+			'resize',
+			function () {
+				[tabletExclusive, mobileExclusive] =
+					viewport_change(
+						TABLET_VIEW,
+						MOBILE_VIEW
+					);
+			}
+		);
+	});
+  
 </script>
 
 <!-- ===================
@@ -22,7 +48,7 @@
 	{#if HEADER_TRANSLATION_DATA.scores_top_bar_messages.status && show}
 		<div 
       id="platform-alert-container"
-      class:update-z-index={$sessionStore.livescoreShowCalendar}>
+      class:update-z-index={$sessionStore.livescoreShowCalendar && mobileExclusive}>
 			<p 
         class="
           s-12 

diff --git a/src/lib/components/_main_/header/Header.svelte b/src/lib/components/_main_/header/Header.svelte
@@ -545,7 +545,7 @@ TODO:FIXME: not generating for each LANG
 <header 
   class="column-space-center"
   class:user-active={PROFILE_URL == $page.route.id}
-  class:update-z-index={$sessionStore.livescoreShowCalendar}>
+  class:update-z-index={$sessionStore.livescoreShowCalendar && mobileExclusive}>
 	<!-- 
   [ℹ] area outside to close action (inner header)
   -->