From c68c432c8f0f779fa0802ca88d4d0e8eb9113831 Mon Sep 17 00:00:00 2001
From: Sebin Nyshkim <sebin.nyshkim@icloud.com>
Date: Thu, 29 Sep 2022 02:18:19 +0200
Subject: [PATCH] refactor: remove HeaderBar component

---
 src/App.vue                  | 24 +-----------------------
 src/components/HeaderBar.vue | 30 ------------------------------
 2 files changed, 1 insertion(+), 53 deletions(-)
 delete mode 100644 src/components/HeaderBar.vue

diff --git a/src/App.vue b/src/App.vue
index f0cd523..389fb4a 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -1,32 +1,10 @@
 <script setup lang="ts">
-import { reactive } from "vue";
-
 import { RouterView } from "vue-router";
 import SiteNavigation from "@/components/SiteNavigation.vue";
-import NavToggle from "@/components/NavToggle.vue";
-import HeaderBar from "@/components/HeaderBar.vue";
-
-interface State {
-  navActive: boolean;
-}
-
-const state: State = reactive({
-  navActive: false,
-});
-
-const toggleNav = (): void => {
-  state.navActive = !state.navActive;
-  document.body.classList.toggle("scroll-lock");
-};
 </script>
 
 <template>
-  <SiteNavigation :isActive="state.navActive" @selected="toggleNav" />
-
-  <HeaderBar>
-    <NavToggle @click.prevent="toggleNav" />
-    <template #heading>{{ $route.meta.title }}</template>
-  </HeaderBar>
+  <SiteNavigation />
 
   <main>
     <RouterView />
diff --git a/src/components/HeaderBar.vue b/src/components/HeaderBar.vue
deleted file mode 100644
index f0ec075..0000000
--- a/src/components/HeaderBar.vue
+++ /dev/null
@@ -1,30 +0,0 @@
-<template>
-  <header class="header-bar">
-    <slot></slot>
-
-    <h1 class="header-bar__title">
-      <slot name="heading"></slot>
-    </h1>
-  </header>
-</template>
-
-<style lang="scss">
-.header-bar {
-  display: flex;
-  flex-flow: row nowrap;
-  justify-content: stretch;
-  align-items: center;
-
-  position: sticky;
-  top: 0;
-  z-index: 1;
-
-  background-color: var(--color-header-bar);
-  backdrop-filter: blur(0.5rem);
-
-  &__title {
-    color: var(--color-header-bar-title);
-    margin: 0;
-  }
-}
-</style>