Update layout

assets/js/components/Navbar.vue

@@ -2,7 +2,9 @@
   <div>
     <div class="sm:flex">
       <div class="w-full sm:w-1/3 lg:w-1/4 flex items-center">
-        <div class="w-3/4 py-5">{{ siteName }}</div>
+        <div class="w-3/4 py-5">
+          <div class="font-semibold">{{ siteTitle }}</div>
+        </div>
 
         <div class="w-1/4 text-right sm:hidden">
           <button type="button" class="nav-toggle appearance-none" @click="hidden = !hidden" aria-label="Toggle main menu">
@@ -32,14 +34,8 @@
 <script>
 export default {
   props: {
-    siteName: {
-      type: String,
-      required: true,
-    },
-    pageUrl: {
-      type: String,
-      required: true,
-    },
+    siteTitle: String,
+    pageUrl: String,
   },
 
   methods: {

assets/sass/components/button.sass

@@ -1,5 +1,5 @@
 .button
-  @apply bg-blue border-blue border-2 inline-block rounded-lg text-white no-underline px-4 py-2
+  @apply bg-blue border-blue border inline-block text-white no-underline py-1 px-3 rounded
 
   &:active,
   &:focus,
@@ -7,4 +7,4 @@
     @apply bg-white text-blue
 
   &:focus
-    @apply px-4 py-2 m-0
+    @apply px-3 py-1 m-0

assets/sass/components/markdown.sass

@@ -8,7 +8,7 @@
   p,
   li
     code
-      @apply bg-grey-lighter inline-block font-mono text-sm px-1 py-px border border-grey-light
+      @apply bg-grey-lighter inline-block font-mono text-xs px-1 py-px border border-grey-light
 
   p:last-child
     @apply mb-0
@@ -16,7 +16,7 @@
   pre code,
   .hljs
     @apply bg-grey-lighter block border-grey-dark border-l-4 font-mono
-    @apply leading-loose overflow-x-scroll p-6 rounded text-sm
+    @apply leading-loose overflow-x-scroll p-6 rounded text-xs
 
   figure
     @apply block mb-8