fix(theme): incorrect page layout when navbar: false, close #270 (#273)

theme/src/client/components/Nav/VPNav.vue

@@ -29,7 +29,7 @@ watchEffect(() => {
 </script>
 
 <template>
-  <div class="vp-nav" :class="{ fixed }">
+  <header v-if="hasNavbar" class="vp-nav" :class="{ fixed }">
     <VPNavbar :is-screen-open="isScreenOpen" @toggle-screen="toggleScreen">
       <template #nav-bar-title-before>
         <slot name="nav-bar-title-before" />
@@ -53,7 +53,7 @@ watchEffect(() => {
         <slot name="nav-screen-content-after" />
       </template>
     </VPNavScreen>
-  </div>
+  </header>
 </template>
 
 <style scoped>

theme/src/client/styles/vars.css

@@ -505,7 +505,7 @@
   --vp-nav-height: 0px;
 }
 
-.hide-nav .sidebar {
+.hide-nav .vp-sidebar {
   --vp-nav-height: 22px;
 }