Icons and Navigation Bar

docs/.vuepress/config.js

@@ -4,7 +4,10 @@ module.exports = {
         { text: 'Hello', link: '/hello' },
         { text: 'Articles', link: '/articles' },
         { text: 'Media', link: '/media' },
-      ]
-
+      ],
+      logo: '/artris_logo.svg',
+      search: false,
+      githubIcon: '/github_icon.svg',
+      twitterIcon: '/twitter_icon.svg'
     }
-  }
+  }

docs/.vuepress/theme/Icons.vue

@@ -0,0 +1,46 @@
+<template>
+<ul style="list-style: none;">
+  <li>
+    <a href="https://github.com/Artris">
+    <img class="icon-github"
+    v-if="$site.themeConfig.githubIcon"
+    :src="$withBase($site.themeConfig.githubIcon)">
+    </a>
+  </li>
+  <li>
+    <a href="https://twitter.com/artris_code">
+    <img class="icon-twitter"
+    v-if="$site.themeConfig.githubIcon"
+    :src="$withBase($site.themeConfig.twitterIcon)">
+    </a>
+  </li>
+</ul>
+</template>
+
+<style lang="stylus">
+@import './styles/config.styl';
+
+.icon-github {
+  position: relative;
+  min-width: $navbarHeight - 1.4rem;
+  top: -10 rem;
+  left: 100 rem;
+  width: 30px;
+  height: 30px;
+  margin-bottom: 1 rem;
+}
+
+.icon-twitter {
+  position: relative;
+  min-width: $navbarHeight - 1.4rem;
+  top: -10 rem;
+  left: 100 rem;
+  width: 30px;
+  height: 30px;
+  margin-bottom: 1 rem;
+}
+
+.ul {
+  list-style: none;
+}
+</style>

docs/.vuepress/theme/Layout.vue

@@ -9,6 +9,7 @@
       <slot name="sidebar-top" slot="top"/>
       <slot name="sidebar-bottom" slot="bottom"/>
     </Sidebar>
+
     <div class="custom-layout" v-if="$page.frontmatter.layout">
       <component :is="$page.frontmatter.layout"/>
     </div>
@@ -17,45 +18,45 @@
       <slot name="page-top" slot="top"/>
       <slot name="page-bottom" slot="bottom"/>
     </Page>
+    <Icons/>   
   </div>
 </template>
 
 <script>
-import Vue from 'vue'
-import nprogress from 'nprogress'
-import Home from './Home.vue'
-import Navbar from './Navbar.vue'
-import Page from './Page.vue'
-import Sidebar from './Sidebar.vue'
-import { resolveSidebarItems } from './util'
+import Vue from "vue";
+import nprogress from "nprogress";
+import Home from "./Home.vue";
+import Navbar from "./Navbar.vue";
+import Page from "./Page.vue";
+import Sidebar from "./Sidebar.vue";
+import Icons from "./Icons.vue";
+import { resolveSidebarItems } from "./util";
 
 export default {
-  components: { Home, Page, Sidebar, Navbar },
-  data () {
+  components: { Home, Page, Sidebar, Navbar, Icons },
+  data() {
     return {
       isSidebarOpen: false
-    }
+    };
   },
 
   computed: {
-    shouldShowNavbar () {
-      const { themeConfig } = this.$site
-      const { frontmatter } = this.$page
-      if (
-        frontmatter.navbar === false ||
-        themeConfig.navbar === false) {
-        return false
+    shouldShowNavbar() {
+      const { themeConfig } = this.$site;
+      const { frontmatter } = this.$page;
+      if (frontmatter.navbar === false || themeConfig.navbar === false) {
+        return false;
       }
       return (
         this.$title ||
         themeConfig.logo ||
         themeConfig.repo ||
         themeConfig.nav ||
         this.$themeLocaleConfig.nav
-      )
+      );
     },
-    shouldShowSidebar () {
-      const { frontmatter } = this.$page
+    shouldShowSidebar() {
+      const { frontmatter } = this.$page;
       return (
         !frontmatter.layout &&
         !frontmatter.home &&

docs/.vuepress/theme/Navbar.vue

@@ -50,7 +50,7 @@ export default {
   .logo
     height $navbarHeight - 1.4rem
     min-width $navbarHeight - 1.4rem
-    margin-right 0.8rem
+    margin-left 50rem
     vertical-align top
   .site-name
     font-size 1.3rem

docs/lazy-jar/lazy-jar-article-1.md

@@ -0,0 +1 @@
+<app></app>