chore(#150): update docs components

docs/components/app/Header.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="w-full navbar">
+  <div class="w-full navbar bg-white">
     <div class="flex-none" :class="{ 'lg:hidden': $route.path !== '/' }">
       <label for="sidebar" class="btn btn-square btn-ghost">
         <svg

docs/components/app/Menu.vue

@@ -8,7 +8,11 @@
         v-bind="item.props"
         v-text="item.text"
       />
-      <ul v-if="children && item.children" class="menu">
+      <ul
+        v-if="children && item.children"
+        v-show="$route.path.startsWith(item.props.to)"
+        class="menu"
+      >
         <li v-for="(child, childKey) of item.children" :key="childKey">
           <component
             :is="child.component"

docs/components/app/Sidebar.vue

@@ -16,22 +16,5 @@
         <span>Navigation</span>
       </li>
     </AppMenu>
-
-    <!-- API menu -->
-    <ul class="mb-5 menu">
-      <li slot="title" class="menu-title">
-        <span>API documents</span>
-      </li>
-      <li>
-        <NuxtLink class="rounded-btn" :to="{ path: '/api', hash: '#packages' }"
-          >Packages</NuxtLink
-        >
-        <!-- <ul class="menu">
-          <li v-for="item of $store.state.packages" :key="item">
-            <NuxtLink class="rounded-btn" :to="`/api/packages/${item}/`" v-text="item" />
-          </li>
-        </ul> -->
-      </li>
-    </ul>
   </div>
 </template>

docs/pages/api.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="container mx-auto my-20 px-5">
-    <h1 class="text-4xl border-b mb-10">API Documentation</h1>
+    <h1 class="text-4xl text-primary border-b mb-10">API Documentation</h1>
 
     <NuxtChild />
   </div>

docs/pages/api/_.vue

@@ -1,31 +1,22 @@
 <template>
   <div>
     <!-- TODO: Add link to GitHub -->
-    <div class="card shadow bg-white mb-10">
-      <div class="card-body">
-        <div class="text-sm breadcrumbs">
-          <ul>
-            <li v-for="dir of dirs" :key="dir" v-text="dir" />
-          </ul>
-        </div>
-        <h2 class="mb-5 text-3xl">{{ title }}</h2>
+    <div class="text-sm breadcrumbs">
+      <ul>
+        <li v-for="dir of dirs" :key="dir" v-text="dir" />
+      </ul>
+    </div>
+    <h2 class="mb-5 text-3xl">{{ title }}</h2>
 
-        <div>
-          <!-- TODO: Link to module page? -->
-          <div v-if="module" class="badge badge-primary">{{ module }}</div>
-          <!-- TODO: Add file type badge; Component, Mixin, etc -->
-        </div>
-      </div>
+    <div>
+      <!-- TODO: Link to module page? -->
+      <div v-if="module" class="badge badge-primary">{{ module }}</div>
+      <!-- TODO: Add file type badge; Component, Mixin, etc -->
     </div>
 
     <NuxtContent
       v-if="document"
-      class="
-        prose prose-green prose-sm
-        sm:prose sm:prose-green
-        lg:prose-lg
-        xl:prose-xl
-      "
+      class="prose prose-sm sm:prose lg:prose-lg xl:prose-xl"
       :document="document"
     />
   </div>

docs/pages/guide.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="container mx-auto my-20 px-5">
-    <h1 class="text-4xl border-b mb-10">Guide</h1>
+    <h1 class="text-4xl text-secondary border-b mb-10">Guide</h1>
 
     <NuxtChild />
   </div>

docs/pages/guide/_.vue

@@ -3,12 +3,7 @@
     <!-- TODO: Add breadcrumb / path -->
     <NuxtContent
       v-if="document"
-      class="
-        prose prose-green prose-sm
-        sm:prose sm:prose-green
-        lg:prose-lg
-        xl:prose-xl
-      "
+      class="prose prose-sm sm:prose lg:prose-lg xl:prose-xl"
       :document="document"
     />
   </div>

package.json

@@ -13,7 +13,7 @@
     "build:docs": "./packages/docgen/bin/druxt-docgen.js",
     "changeset": "changeset",
     "clean": "yarn clean:dist && yarn clean:docs",
-    "clean:docs": "rimraf docs/content/api || true",
+    "clean:docs": "rimraf docs/content/api/packages || true",
     "clean:dist": "rimraf packages/*/dist || true",
     "dev": "siroc dev",
     "lint": "eslint --ext .js,.vue packages/*/src",