From 537631002b2c0c3dd4c8d1825219b4165af4fdcb Mon Sep 17 00:00:00 2001
From: taehoon <th.dev91@gmail.com>
Date: Sun, 3 Feb 2019 14:47:02 -0500
Subject: [PATCH 1/4] Add logo and sitename to the side drawer area

---
 src/components/side_drawer/side_drawer.js  |  6 ++++++
 src/components/side_drawer/side_drawer.vue | 25 ++++++++++++++++++++--
 2 files changed, 29 insertions(+), 2 deletions(-)

diff --git a/src/components/side_drawer/side_drawer.js b/src/components/side_drawer/side_drawer.js
index 754a57e0..40ffa1dd 100644
--- a/src/components/side_drawer/side_drawer.js
+++ b/src/components/side_drawer/side_drawer.js
@@ -26,6 +26,12 @@ const SideDrawer = {
     },
     suggestionsEnabled () {
       return this.$store.state.instance.suggestionsEnabled
+    },
+    logo () {
+      return this.$store.state.instance.logo
+    },
+    sitename () {
+      return this.$store.state.instance.name
     }
   },
   methods: {
diff --git a/src/components/side_drawer/side_drawer.vue b/src/components/side_drawer/side_drawer.vue
index fc90977b..2810d0c7 100644
--- a/src/components/side_drawer/side_drawer.vue
+++ b/src/components/side_drawer/side_drawer.vue
@@ -8,8 +8,11 @@
       @touchmove="touchMove"
     >
       <div class="side-drawer-heading" @click="toggleDrawer">
-        <user-card-content :user="currentUser" :switcher="false" :hideBio="true" v-if="currentUser">
-        </user-card-content>
+        <div class="side-drawer__logo-wrapper">
+          <img :src="logo"/>
+          <span>{{sitename}}</span>
+        </div>
+        <user-card-content :user="currentUser" :switcher="false" :hideBio="true" v-if="currentUser"/>
       </div>
       <ul>
         <li v-if="currentUser" @click="toggleDrawer">
@@ -139,6 +142,24 @@
   box-shadow: var(--panelShadow);
   background-color: $fallback--bg;
   background-color: var(--bg, $fallback--bg);
+
+  &__logo-wrapper {
+    display: flex;
+    align-items: center;
+    padding: 0.85em;
+
+    img {
+      flex: none;
+      height: 50px;
+      margin-right: 0.85em;
+    }
+
+    span {
+      overflow: hidden;
+      text-overflow: ellipsis;
+      white-space: nowrap;
+    }
+  }
 }
 
 .side-drawer-click-outside-closed {

From 4528a4cbfa259ab525652fd69bd5f90484957ac3 Mon Sep 17 00:00:00 2001
From: taehoon <th.dev91@gmail.com>
Date: Sun, 3 Feb 2019 20:05:07 -0500
Subject: [PATCH 2/4] Show logo/sitename in the side drawer only if logged out

---
 src/components/side_drawer/side_drawer.vue | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/src/components/side_drawer/side_drawer.vue b/src/components/side_drawer/side_drawer.vue
index 2810d0c7..2f86fba0 100644
--- a/src/components/side_drawer/side_drawer.vue
+++ b/src/components/side_drawer/side_drawer.vue
@@ -8,7 +8,7 @@
       @touchmove="touchMove"
     >
       <div class="side-drawer-heading" @click="toggleDrawer">
-        <div class="side-drawer__logo-wrapper">
+        <div class="side-drawer__logo-wrapper" v-if="!currentUser">
           <img :src="logo"/>
           <span>{{sitename}}</span>
         </div>
@@ -175,7 +175,6 @@
   flex-direction: column;
   align-items: stretch;
   display: flex;
-  min-height: 7em;
   padding: 0;
   margin: 0;
 

From 5675b9326ccae1f70d76c1dac7d9b382fd2fe432 Mon Sep 17 00:00:00 2001
From: taehoon <th.dev91@gmail.com>
Date: Mon, 4 Feb 2019 12:25:28 -0500
Subject: [PATCH 3/4] Improve readability using v-if and v-else

---
 src/components/side_drawer/side_drawer.vue | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/components/side_drawer/side_drawer.vue b/src/components/side_drawer/side_drawer.vue
index 2f86fba0..158fdf59 100644
--- a/src/components/side_drawer/side_drawer.vue
+++ b/src/components/side_drawer/side_drawer.vue
@@ -8,11 +8,11 @@
       @touchmove="touchMove"
     >
       <div class="side-drawer-heading" @click="toggleDrawer">
-        <div class="side-drawer__logo-wrapper" v-if="!currentUser">
+        <user-card-content :user="currentUser" :switcher="false" :hideBio="true" v-if="currentUser"/>
+        <div class="side-drawer__logo-wrapper" v-else>
           <img :src="logo"/>
           <span>{{sitename}}</span>
         </div>
-        <user-card-content :user="currentUser" :switcher="false" :hideBio="true" v-if="currentUser"/>
       </div>
       <ul>
         <li v-if="currentUser" @click="toggleDrawer">

From 13ee6243419b9130101bff2e4d19d67dc37f1a9d Mon Sep 17 00:00:00 2001
From: taehoon <th.dev91@gmail.com>
Date: Mon, 4 Feb 2019 13:34:07 -0500
Subject: [PATCH 4/4] Do not use BEM

---
 src/components/side_drawer/side_drawer.vue | 30 +++++++++++-----------
 1 file changed, 15 insertions(+), 15 deletions(-)

diff --git a/src/components/side_drawer/side_drawer.vue b/src/components/side_drawer/side_drawer.vue
index 158fdf59..a6c6f237 100644
--- a/src/components/side_drawer/side_drawer.vue
+++ b/src/components/side_drawer/side_drawer.vue
@@ -9,7 +9,7 @@
     >
       <div class="side-drawer-heading" @click="toggleDrawer">
         <user-card-content :user="currentUser" :switcher="false" :hideBio="true" v-if="currentUser"/>
-        <div class="side-drawer__logo-wrapper" v-else>
+        <div class="side-drawer-logo-wrapper" v-else>
           <img :src="logo"/>
           <span>{{sitename}}</span>
         </div>
@@ -142,23 +142,23 @@
   box-shadow: var(--panelShadow);
   background-color: $fallback--bg;
   background-color: var(--bg, $fallback--bg);
+}
 
-  &__logo-wrapper {
-    display: flex;
-    align-items: center;
-    padding: 0.85em;
+.side-drawer-logo-wrapper {
+  display: flex;
+  align-items: center;
+  padding: 0.85em;
 
-    img {
-      flex: none;
-      height: 50px;
-      margin-right: 0.85em;
-    }
+  img {
+    flex: none;
+    height: 50px;
+    margin-right: 0.85em;
+  }
 
-    span {
-      overflow: hidden;
-      text-overflow: ellipsis;
-      white-space: nowrap;
-    }
+  span {
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
   }
 }