diff --git a/source/_posts/2018-11-20-rebuilding-bartik-with-vuejs-tailwind-css.md b/source/_posts/2018-11-20-rebuilding-bartik-with-vuejs-tailwind-css.md
index 5f427be6..e4002772 100644
--- a/source/_posts/2018-11-20-rebuilding-bartik-with-vuejs-tailwind-css.md
+++ b/source/_posts/2018-11-20-rebuilding-bartik-with-vuejs-tailwind-css.md
@@ -62,7 +62,8 @@ export default {
 
 `src/components/Welcome.vue`:
 
-```
+<div v-pre markdown="1">{% raw %}
+```vuejs
 <template>
   <div>
     <div class="bg-blue-dark">
@@ -93,7 +94,7 @@ export default {
             <div class="font-serif">
               <h1 class="font-normal">Welcome to {{ title }}</h1>
               <p>No front page content has been created yet.</p>
-              <p>Follow the <a href="#0" class="">User Guide</a> to start building your site.</p>
+              <p>Follow the <a href="#0" class="text-blue-dark hover:text-blue no-underline border-b border-blue border-dotted hover:bg-solid">User Guide</a> to start building your site.</p>
             </div>
 
             <div class="mt-10">
@@ -104,19 +105,22 @@ export default {
           </div>
 
           <div class="w-full md:w-1/3 lg:w-1/4 flex-none md:px-6">
-            <drupal-block>
-              <h2 class="font-serif font-normal text-base text-grey-darkest border-b border-solid border-grey-light mb-3">Search</h2>
+            <div class="w-full md:w-1/3 lg:w-1/4 flex-none md:px-6">
+                <div class="p-4" style="background-color: #f6f6f2">
+                  <h2 class="font-serif font-normal text-base text-grey-darkest border-b border-solid border-grey-light mb-3">Search</h2>
 
-              <div>
-                <form action="#" class="flex">
-                  <input type="text" class="border border-solid border-grey p-2 w-full xl:w-auto">
+                  <div>
+                    <form action="#" class="flex">
+                      <input type="text" class="border border-solid border-grey p-2 w-full xl:w-auto">
 
-                  <button type="submit" class="bg-grey-light px-3 rounded-full border-b border-solid border-grey-dark ml-2 flex-none" style="background-color: #f0f0f0">
-                    <img src="img/loupe.svg" class="block">
-                  </button>
-                </form>
+                      <button type="submit" class="bg-grey-light px-3 rounded-full border-b border-solid border-grey-dark ml-2 flex-none" style="background-color: #f0f0f0">
+                        <img src="img/loupe.svg" class="block">
+                      </button>
+                    </form>
+                  </div>
+                </div>
               </div>
-            </drupal-block>
+            </div>
           </div>
         </div>
       </div>
@@ -144,12 +148,10 @@ export default {
 </template>
 
 <script>
-import DrupalBlock from './DrupalBlock.vue'
 import MainMenu from './MainMenu.vue';
 
 export default {
   components: {
-      DrupalBlock,
       MainMenu,
   },
 
@@ -161,44 +163,8 @@ export default {
   }
 }
 </script>
-
-<style lang="sass">
-#header a
-  @apply text-white no-underline
-
-  &:hover,
-  &:focus
-    @apply underline
-
-#main a
-  @apply text-blue-dark no-underline border-b border-blue border-dotted
-
-  &:hover,
-  &:focus
-    @apply text-blue border-solid
-
-#footer a
-    @apply text-white no-underline border-b border-dotted border-white
-</style>
-```
-
-`src/components/DrupalBlock.vue`:
-
-```
-<template>
-    <div class="drupal-block">
-        <slot></slot>
-    </div>
-</template>
-
-<style lang="sass" scoped>
-.drupal-block
-  @apply bg-grey-lightest p-4
-
-  &:not(:last-child)
-    @apply mb-4
-</style>
 ```
+{% endraw %}</div>
 
 ## Making it responsive
 
diff --git a/source/_posts/2018-12-06-rebuilding-bartik-with-vuejs-tailwind-css-part-2.md b/source/_posts/2018-12-06-rebuilding-bartik-with-vuejs-tailwind-css-part-2.md
new file mode 100644
index 00000000..8e82de1b
--- /dev/null
+++ b/source/_posts/2018-12-06-rebuilding-bartik-with-vuejs-tailwind-css-part-2.md
@@ -0,0 +1,137 @@
+---
+title: Rebuilding Bartik (Drupal’s Default Theme) with Vue.js and Tailwind CSS - part 2
+tags:
+    - drupal
+    - tailwind-css
+    - tweet
+    - vuejs
+has_tweets: true
+draft: true
+---
+{% block excerpt %}
+In the [original post](/blog/rebuilding-bartik-with-vuejs-tailwind-css) I detailed how I built a clone of Drupal’s Bartik theme with [Vue.js][1] and [Tailwind CSS][2]. This post details some updates that I’ve made to it since then.
+{% endblock %}
+
+{% block content %}
+## Customising Tailwind
+
+```js
+let colors = {
+  'transparent': 'transparent',
+
+  'black': '#22292f',
+  'grey-darkest': '#3d4852',
+  'grey-dark': '#8795a1',
+  'grey': '#b8c2cc',
+  'grey-light': '#dae1e7',
+  'grey-lighter': '#f0f0f0',
+  'grey-lightest': '#F6F6F2',
+  'white': '#ffffff',
+
+  'blue-dark': '#2779bd',
+  'blue': '#3490dc',
+  'blue-light': '#bcdefa',
+}
+```
+
+## Extracting Tailwind components for link styling
+
+`src/components/Welcome.vue`:
+
+<div v-pre markdown="1">{% raw %}
+```vuejs
+<template>
+  ...
+
+  <div id="footer" class="text-xs text-white">
+    <div class="container mx-auto px-4 pt-16 pb-4">
+      <div class="border-t border-solid border-grey-darkest pt-6 -mb-6">
+        <div class="mb-6">
+          <p><a href="#0">Contact</a></p>
+        </div>
+
+        <div class="mb-6">
+          <p>
+            A clone of <a href="https://www.drupal.org">Drupal</a>’s default theme (Bartik).
+            Built by <a href="https://www.oliverdavies.uk">Oliver Davies</a>
+            using <a href="https://vuejs.org">Vue.js</a>
+            and <a href="https://tailwindcss.com">Tailwind CSS</a>.
+          </p>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+```
+
+```vuejs
+<style lang="sass">
+#header a
+  @apply text-white no-underline
+
+  &:hover,
+  &:focus
+    @apply underline
+
+#main a
+  @apply text-blue-dark no-underline border-b border-blue border-dotted
+
+  &:hover,
+  &:focus
+    @apply text-blue border-solid
+
+#footer a
+  @apply text-white no-underline border-b border-dotted border-white
+
+  &:hover,
+  &:focus
+    @apply border-none
+</style>
+```
+{% endraw %}</div>
+
+## Extracting a Vue component for Drupal blocks
+
+`src/components/DrupalBlock.vue`:
+
+```vuejs
+<template>
+    <div class="drupal-block">
+        <slot></slot>
+    </div>
+</template>
+
+<style lang="sass" scoped>
+.drupal-block
+  @apply bg-grey-lightest p-4
+
+  &:not(:last-child)
+    @apply mb-4
+</style>
+```
+
+`src/components/Welcome.vue`:
+
+```vuejs
+<drupal-block>
+  <h2 class="font-serif font-normal text-base text-grey-darkest border-b border-solid border-grey-light mb-3">Search</h2>
+
+  <div>
+    <form action="#" class="flex">
+      <input type="text" class="border border-solid border-grey p-2 w-full xl:w-auto">
+
+      <button type="submit" class="bg-grey-lighter px-3 rounded-full border-b border-solid border-grey-dark ml-2 flex-none">
+        <img src="img/loupe.svg" class="block">
+      </button>
+    </form>
+  </div>
+</drupal-block>
+```
+{% endblock %}
+
+[0]: https://www.drupal.org
+[1]: https://vuejs.org
+[2]: https://tailwindcss.com
+[3]: https://github.com/opdavies/rebuilding-bartik
+[4]: https://rebuilding-bartik.netlify.com
+[5]: https://www.drupal.org/project/tailwindcss