From cd376356583be500278fa7674586a028a8bcb89f Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E3=83=9D=E3=83=BC=E3=83=AB=20=E3=82=A6=E3=82=A7=E3=83=83?=
 =?UTF-8?q?=E3=83=96?= <netopwibby@thenetwork.email>
Date: Thu, 24 May 2018 11:45:15 -0500
Subject: [PATCH] Fixed Vue rendering issues due to custom HTML tags

---
 .vuepress/scss/pages/_documentation.scss | 72 ++++++++++++------------
 .vuepress/theme/Layout.vue               | 33 ++++++-----
 2 files changed, 52 insertions(+), 53 deletions(-)

diff --git a/.vuepress/scss/pages/_documentation.scss b/.vuepress/scss/pages/_documentation.scss
index b748cf8..5cd983e 100644
--- a/.vuepress/scss/pages/_documentation.scss
+++ b/.vuepress/scss/pages/_documentation.scss
@@ -8,45 +8,15 @@
     padding-top: 2rem;
   }
 
-  .blog-post {
-    a {
-      display: inline-block;
-      position: relative;
 
-      &::after {
-        content: "";
-        display: block;
-      }
-    }
 
-    author {
-      &::before {
-        content: "by";
-        left: -1.2rem;
-      }
-    }
+  .blog-post__title {
+    display: inline-block;
+    position: relative;
 
-    date {
-      margin-right: 1.4rem;
-      margin-left: 3.1rem;
-
-      &::before {
-        content: "posted";
-        left: -3.1rem;
-      }
-    }
-
-    author,
-    date {
-      display: inline-block;
-      position: relative;
-
-      &::before {
-        color: rgba($black, 0.5);
-        font-style: italic;
-        position: absolute;
-        vertical-align: bottom;
-      }
+    &::after {
+      content: "";
+      display: block;
     }
   }
 
@@ -55,4 +25,34 @@
     line-height: 1;
     margin-bottom: 1rem;
   }
+
+  .blog-post__meta__author {
+    &::before {
+      content: "by";
+      left: -1.2rem;
+    }
+  }
+
+  .blog-post__meta__date {
+    margin-right: 1.4rem;
+    margin-left: 3.1rem;
+
+    &::before {
+      content: "posted";
+      left: -3.1rem;
+    }
+  }
+
+  .blog-post__meta__author,
+  .blog-post__meta__date {
+    display: inline-block;
+    position: relative;
+
+    &::before {
+      color: rgba($black, 0.5);
+      font-style: italic;
+      position: absolute;
+      vertical-align: bottom;
+    }
+  }
 }
diff --git a/.vuepress/theme/Layout.vue b/.vuepress/theme/Layout.vue
index ad8333a..724dba0 100644
--- a/.vuepress/theme/Layout.vue
+++ b/.vuepress/theme/Layout.vue
@@ -149,42 +149,42 @@
 
               <ul class="blog-posts">
                 <li class="blog-post">
-                  <a href="https://lbry.io/news/we-are-hiring-our-boss">We're Hiring Our Boss</a>
+                  <a class="blog-post__title" href="https://lbry.io/news/we-are-hiring-our-boss">We're Hiring Our Boss</a>
                   <div class="blog-post__meta">
-                    <date>2018/05/11</date>
-                    <author>Samuel Bryan</author>
+                    <span class="blog-post__meta__date">2018/05/11</span>
+                    <span class="blog-post__meta__author">Samuel Bryan</span>
                   </div>
                 </li>
 
                 <li class="blog-post">
-                  <a href="https://lbry.io/news/lbry-development-community-update-apr-2018">Development and Community Update April 2018</a>
+                  <a class="blog-post__title" href="https://lbry.io/news/lbry-development-community-update-apr-2018">Development and Community Update April 2018</a>
                   <div class="blog-post__meta">
-                    <date>2018/05/04</date>
-                    <author>Samuel Bryan</author>
+                    <span class="blog-post__meta__date">2018/05/04</span>
+                    <span class="blog-post__meta__author">Samuel Bryan</span>
                   </div>
                 </li>
 
                 <li class="blog-post">
-                  <a href="https://lbry.io/news/imineblocks">Hey, mine your own business!</a>
+                  <a class="blog-post__title" href="https://lbry.io/news/imineblocks">Hey, mine your own business!</a>
                   <div class="blog-post__meta">
-                    <date>2018/04/05</date>
-                    <author>Reilly Smith</author>
+                    <span class="blog-post__meta__date">2018/04/05</span>
+                    <span class="blog-post__meta__author">Reilly Smith</span>
                   </div>
                 </li>
 
                 <li class="blog-post">
-                  <a href="https://lbry.io/news/lbry-development-community-update-mar-2018">Development and Community Update March 2018</a>
+                  <a class="blog-post__title" href="https://lbry.io/news/lbry-development-community-update-mar-2018">Development and Community Update March 2018</a>
                   <div class="blog-post__meta">
-                    <date>2018/04/03</date>
-                    <author>Tom Zarebczan</author>
+                    <span class="blog-post__meta__date">2018/04/03</span>
+                    <span class="blog-post__meta__author">Tom Zarebczan</span>
                   </div>
                 </li>
 
                 <li class="blog-post">
-                  <a href="https://lbry.io/news/if-you-still-havent-found-what-youre-searching-for">If you still haven't found what you're searching for...</a>
+                  <a class="blog-post__title" href="https://lbry.io/news/if-you-still-havent-found-what-youre-searching-for">If you still haven't found what you're searching for...</a>
                   <div class="blog-post__meta">
-                    <date>2018/03/22</date>
-                    <author>Brinck Slattery</author>
+                    <span class="blog-post__meta__date">2018/03/22</span>
+                    <span class="blog-post__meta__author">Brinck Slattery</span>
                   </div>
                 </li>
               </ul>
@@ -296,8 +296,7 @@ export default {
 
 
 
-    // Toggle beta message
-    if (
+    if ( // Toggle beta message
       localStorage.getItem("hide lbry alert") &&
       localStorage.getItem("hide lbry alert") === "true" // cannot set Booleans for some reason
     ) {