Attempt to fix prod cascade

directus · Jul 27, 2023 · 3d1d060 · 3d1d060
1 parent a56ac14
commit 3d1d060
Show file tree

Hide file tree

Showing 3 changed files with 9 additions and 12 deletions.
diff --git a/components/Base/Container.vue b/components/Base/Container.vue
@@ -9,13 +9,13 @@ withDefaults(defineProps<BaseContainerProps>(), {
 </script>
 
 <template>
-	<component :is="tag" class="container">
+	<component :is="tag" class="base-container">
 		<slot />
 	</component>
 </template>
 
 <style scoped lang="scss">
-.container {
+.base-container {
 	display: grid;
 	grid-template-columns:
 		[full-start] minmax(var(--space-5), 1fr)
@@ -38,7 +38,7 @@ withDefaults(defineProps<BaseContainerProps>(), {
 	}
 }
 
-.container :deep(> *) {
+.base-container :deep(> *) {
 	/** acts as an overridable default */
 	grid-column: standard;
 }

diff --git a/components/Nav/Banner.vue b/components/Nav/Banner.vue
@@ -39,10 +39,11 @@ const dismiss = (id: string) => {
 </template>
 
 <style scoped lang="scss">
-.banner-container {
+.base-container.banner-container {
 	background: linear-gradient(88deg, var(--purple-300) 0%, var(--pink-200) 100%);
 	padding-block: var(--space-1);
 	cursor: pointer;
+	grid-column: full;
 }
 
 .banner {

diff --git a/components/Nav/Header.vue b/components/Nav/Header.vue
@@ -29,7 +29,7 @@ const { data: menu } = useAsyncData('header-nav', () =>
 const headerContainer = ref();
 
 const navActive = ref(false);
-const navActiveSection = ref<string | null>('62c04c6c-5793-4702-8ed1-73dd563fd605');
+const navActiveSection = ref<string | null>(null);
 
 const toggleActiveSection = (id: string) => {
 	if (unref(navActiveSection) === id) {
@@ -59,7 +59,7 @@ onClickOutside(headerContainer, resetNavState);
 <template>
 	<BaseContainer ref="headerContainer" class="header-container">
 		<ClientOnly>
-			<NavBanner class="banner-bar" />
+			<NavBanner />
 		</ClientOnly>
 
 		<header class="header">
@@ -132,7 +132,7 @@ a {
 	}
 }
 
-.header-container {
+.base-container.header-container {
 	position: fixed;
 	top: 0;
 	z-index: 5;
@@ -143,10 +143,6 @@ a {
 	width: 100%;
 }
 
-.banner-bar {
-	grid-column: full;
-}
-
 .header {
 	display: flex;
 	flex-wrap: wrap;
@@ -223,7 +219,7 @@ a {
 }
 
 @media (width > 75rem) {
-	.header-container {
+	.base-container.header-container {
 		position: sticky;
 		top: 0;
 		overflow: visible;