fix: improve responsiveness

Author: natedunn

src/views/components/DocHeader.vue

@@ -2,7 +2,7 @@
   <header>
     <div :class="tw`flex flex-col-reverse md:flex-row`">
       <div :class="tw`flex-auto`">
-        <h1 :class="tw`font-bold text(gray-900 dark:gray-100 4xl)`">
+        <h1 :class="tw`mt-4 font-bold text(gray-900 dark:gray-100 4xl)`">
           <slot name="title"></slot>
         </h1>
         <h2 :class="tw`mt-1 text(gray-500 dark:gray-400 lg)`">

src/views/layouts/default.vue

@@ -5,13 +5,13 @@
         <MainNav />
       </Container>
     </div>
-    <div :class="tw`mt-8 layout`">
+    <div :class="tw`lg:mt-8 layout`">
       <Container>
-        <div :class="tw`grid grid-cols-4 gap-12 mt-12`">
-          <div :class="tw`col-span-1 mt-1.5`">
+        <div :class="tw`lg:grid grid-cols-4 gap-12 mt-12`">
+          <div :class="tw`col-span-1 lg:mt-1.5`">
             <Sidebar />
           </div>
-          <div :class="tw`col-span-3`">
+          <div :class="tw`col-span-3 mt-14 lg:mt-0`">
             <BaseLayout />
           </div>
         </div>