From 66b59f2752e47a9f6349810c8de6d2947d811de0 Mon Sep 17 00:00:00 2001
From: wakarimasen <wakarimasen@airmail.cc>
Date: Tue, 11 Apr 2017 11:47:19 +0200
Subject: [PATCH 01/18] Fix daily average on accounts younger than a day

---
 src/components/user_card_content/user_card_content.vue | 5 ++---
 1 file changed, 2 insertions(+), 3 deletions(-)

diff --git a/src/components/user_card_content/user_card_content.vue b/src/components/user_card_content/user_card_content.vue
index 8c971d53..7b89a7f2 100644
--- a/src/components/user_card_content/user_card_content.vue
+++ b/src/components/user_card_content/user_card_content.vue
@@ -79,9 +79,8 @@
         return this.$store.state.users.currentUser
       },
       dailyAvg () {
-        return Math.round(
-          this.user.statuses_count / ((new Date() - new Date(this.user.created_at)) / (60 * 60 * 24 * 1000))
-        )
+        const days = Math.ceil((new Date() - new Date(this.user.created_at)) / (60 * 60 * 24 * 1000))
+        return Math.round(this.user.statuses_count / days)
       }
     },
     methods: {

From a675cfbb3ebd9c4c093a4535cc5cd0e672a45500 Mon Sep 17 00:00:00 2001
From: Shpuld Shpuldson <shpuld@gmail.com>
Date: Wed, 12 Apr 2017 18:25:19 +0300
Subject: [PATCH 02/18] Goto-original-arrow button now sets conversation
 highlight/focus even when inline, setting focus now scrolls you to the
 focused post smoothly. Hide the arrow button when not expanded.

---
 src/components/conversation/conversation.js  |  8 +++++
 src/components/conversation/conversation.vue |  2 +-
 src/components/status/status.js              | 36 +++++++++++++++++++-
 src/components/status/status.vue             | 12 +++----
 4 files changed, 49 insertions(+), 9 deletions(-)

diff --git a/src/components/conversation/conversation.js b/src/components/conversation/conversation.js
index 281b0183..fa042d23 100644
--- a/src/components/conversation/conversation.js
+++ b/src/components/conversation/conversation.js
@@ -8,6 +8,11 @@ const sortAndFilterConversation = (conversation) => {
 }
 
 const conversation = {
+  data() {
+    return {
+      highlight: this.statusoid.id
+    }
+  },
   props: [
     'statusoid',
     'collapsable'
@@ -54,6 +59,9 @@ const conversation = {
       } else {
         return (id === this.statusoid.id)
       }
+    },
+    setHighlight(id) {
+      this.highlight = id
     }
   }
 }
diff --git a/src/components/conversation/conversation.vue b/src/components/conversation/conversation.vue
index 726cfb65..8b1e00ac 100644
--- a/src/components/conversation/conversation.vue
+++ b/src/components/conversation/conversation.vue
@@ -8,7 +8,7 @@
     </div>
     <div class="panel-body">
       <div class="timeline">
-        <status v-for="status in conversation" :key="status.id" :statusoid="status" :expandable='false' :focused="focused(status.id)" :inConversation='true'></status>
+        <status v-for="status in conversation" @goto="setHighlight" :key="status.id" :statusoid="status" :expandable='false' :focused="focused(status.id)" :inConversation='true' :highlight="highlight"></status>
       </div>
     </div>
   </div>
diff --git a/src/components/status/status.js b/src/components/status/status.js
index bb026fe1..b06bc08d 100644
--- a/src/components/status/status.js
+++ b/src/components/status/status.js
@@ -11,7 +11,8 @@ const Status = {
     'statusoid',
     'expandable',
     'inConversation',
-    'focused'
+    'focused',
+    'highlight'
   ],
   data: () => ({
     replying: false,
@@ -53,6 +54,15 @@ const Status = {
       return {
         borderBottomColor: this.$store.state.config.colors['base02']
       }
+    },
+    isFocused () {
+      // retweet or root of an expanded conversation
+      if(this.focused)
+        return true
+      // use conversation highlight only when in conversation
+      else if(!this.inConversation)
+        return false
+      return this.highlight == this.status.id
     }
   },
   components: {
@@ -75,6 +85,10 @@ const Status = {
     toggleReplying () {
       this.replying = !this.replying
     },
+    gotoOriginal () {
+      // only handled by conversation, not status_or_conversation
+      this.$emit('goto', this.status.in_reply_to_status_id)
+    },
     toggleExpanded () {
       this.$emit('toggleExpanded')
     },
@@ -84,6 +98,26 @@ const Status = {
     toggleUserExpanded () {
       this.userExpanded = !this.userExpanded
     }
+  },
+  watch: {
+    'highlight': function (newfocus) {
+      if(this.status.id == newfocus) {
+        let rect = this.$el.getBoundingClientRect()
+        if(rect.top < 100)
+          window.scrollBy({
+            left: 0,
+            top: rect.top - 200,
+            behavior: 'smooth'
+          })
+        // will be useful when scrolling down to replies or root posts is in
+        else if(rect.bottom > window.innerHeight - 100)
+          window.scrollBy({
+            left: 0,
+            top: rect.bottom + 200,
+            behavior: 'smooth'
+          })
+      }
+    }
   }
 }
 
diff --git a/src/components/status/status.vue b/src/components/status/status.vue
index b471888a..db33a200 100644
--- a/src/components/status/status.vue
+++ b/src/components/status/status.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="status-el base00-background base03-border" v-if="!status.deleted" v-bind:class="[{ 'base01-background': focused }, { 'status-conversation': inConversation }]" >
+  <div class="status-el base00-background base03-border" v-if="!status.deleted" v-bind:class="[{ 'base01-background': isFocused }, { 'status-conversation': inConversation }]" >
     <template v-if="muted">
       <div class="media status container muted">
         <small><router-link :to="{ name: 'user-profile', params: { id: status.user.id } }">{{status.user.screen_name}}</router-link></small>
@@ -35,12 +35,10 @@
                   {{status.in_reply_to_screen_name}}
                 </router-link>
               </small>
-              <template v-if="isReply">
-                  <small>
-                      <router-link :to="{ name: 'conversation', params: { id: status.in_reply_to_status_id } }">
-                          <i class="icon-reply"></i>
-                      </router-link>
-                  </small>
+              <template v-if="isReply && !expandable">
+                <small>
+                  <a href="#" @click.prevent="gotoOriginal" ><i class="icon-reply"></i></a>
+                </small>
               </template>
               -
               <small>

From 3f477986cfe3dcf0077f45c263b152d0b96cb0f0 Mon Sep 17 00:00:00 2001
From: Shpuld Shpuldson <shpuld@gmail.com>
Date: Wed, 12 Apr 2017 18:47:47 +0300
Subject: [PATCH 03/18] Removed smooth scrolling, does not work in other
 browsers than FF

---
 src/components/status/status.js | 12 ++----------
 1 file changed, 2 insertions(+), 10 deletions(-)

diff --git a/src/components/status/status.js b/src/components/status/status.js
index b06bc08d..11e4430f 100644
--- a/src/components/status/status.js
+++ b/src/components/status/status.js
@@ -104,18 +104,10 @@ const Status = {
       if(this.status.id == newfocus) {
         let rect = this.$el.getBoundingClientRect()
         if(rect.top < 100)
-          window.scrollBy({
-            left: 0,
-            top: rect.top - 200,
-            behavior: 'smooth'
-          })
+          window.scrollBy(0, rect.top - 200)
         // will be useful when scrolling down to replies or root posts is in
         else if(rect.bottom > window.innerHeight - 100)
-          window.scrollBy({
-            left: 0,
-            top: rect.bottom + 200,
-            behavior: 'smooth'
-          })
+          window.scrollBy(0, rect.bottom + 200)
       }
     }
   }

From c9891703219607c19069ff26a4956a7636e5ab3a Mon Sep 17 00:00:00 2001
From: Shpuld Shpuldson <shpuld@gmail.com>
Date: Wed, 12 Apr 2017 19:07:55 +0300
Subject: [PATCH 04/18] lint fixes

---
 src/components/conversation/conversation.js |  6 +++---
 src/components/status/status.js             | 21 ++++++++++++---------
 2 files changed, 15 insertions(+), 12 deletions(-)

diff --git a/src/components/conversation/conversation.js b/src/components/conversation/conversation.js
index fa042d23..f3aeb216 100644
--- a/src/components/conversation/conversation.js
+++ b/src/components/conversation/conversation.js
@@ -8,7 +8,7 @@ const sortAndFilterConversation = (conversation) => {
 }
 
 const conversation = {
-  data() {
+  data () {
     return {
       highlight: this.statusoid.id
     }
@@ -60,8 +60,8 @@ const conversation = {
         return (id === this.statusoid.id)
       }
     },
-    setHighlight(id) {
-      this.highlight = id
+    setHighlight (id) {
+      this.highlight = Number(id)
     }
   }
 }
diff --git a/src/components/status/status.js b/src/components/status/status.js
index 11e4430f..82de0fd2 100644
--- a/src/components/status/status.js
+++ b/src/components/status/status.js
@@ -57,12 +57,13 @@ const Status = {
     },
     isFocused () {
       // retweet or root of an expanded conversation
-      if(this.focused)
+      if (this.focused) {
         return true
-      // use conversation highlight only when in conversation
-      else if(!this.inConversation)
+      } else if (!this.inConversation) {
         return false
-      return this.highlight == this.status.id
+      }
+      // use conversation highlight only when in conversation
+      return this.status.id === this.highlight
     }
   },
   components: {
@@ -100,14 +101,16 @@ const Status = {
     }
   },
   watch: {
-    'highlight': function (newfocus) {
-      if(this.status.id == newfocus) {
+    'highlight': function (id) {
+      id = Number(id)
+      if (this.status.id === id) {
         let rect = this.$el.getBoundingClientRect()
-        if(rect.top < 100)
+        if (rect.top < 100) {
           window.scrollBy(0, rect.top - 200)
-        // will be useful when scrolling down to replies or root posts is in
-        else if(rect.bottom > window.innerHeight - 100)
+        } else if(rect.bottom > window.innerHeight - 100) {
+          // will be useful when scrolling down to replies or root posts is in
           window.scrollBy(0, rect.bottom + 200)
+        }
       }
     }
   }

From d8a01454dc4c0613fc2310beea6c9a82da8e679f Mon Sep 17 00:00:00 2001
From: Shpuld Shpuldson <shpuld@gmail.com>
Date: Wed, 12 Apr 2017 19:10:38 +0300
Subject: [PATCH 05/18] another lint fix

---
 src/components/status/status.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/status/status.js b/src/components/status/status.js
index 82de0fd2..5e7bde53 100644
--- a/src/components/status/status.js
+++ b/src/components/status/status.js
@@ -107,7 +107,7 @@ const Status = {
         let rect = this.$el.getBoundingClientRect()
         if (rect.top < 100) {
           window.scrollBy(0, rect.top - 200)
-        } else if(rect.bottom > window.innerHeight - 100) {
+        } else if (rect.bottom > window.innerHeight - 100) {
           // will be useful when scrolling down to replies or root posts is in
           window.scrollBy(0, rect.bottom + 200)
         }

From 446de1c623020cb0687bf2dd868b39be5267ef1d Mon Sep 17 00:00:00 2001
From: Shpuld Shpuldson <shpuld@gmail.com>
Date: Thu, 13 Apr 2017 02:05:31 +0300
Subject: [PATCH 06/18] Potential new default dark and light themes added
 (base16-pleroma-dark, base16-pleroma-light). The new dark one set as the
 default.

---
 static/config.json                  |  2 +-
 static/css/base16-pleroma-dark.css  | 33 +++++++++++++++++++++++++++++
 static/css/base16-pleroma-light.css | 33 +++++++++++++++++++++++++++++
 static/css/themes.json              |  2 ++
 4 files changed, 69 insertions(+), 1 deletion(-)
 create mode 100644 static/css/base16-pleroma-dark.css
 create mode 100644 static/css/base16-pleroma-light.css

diff --git a/static/config.json b/static/config.json
index fb8d4015..3b6d56c4 100644
--- a/static/config.json
+++ b/static/config.json
@@ -1,6 +1,6 @@
 {
   "name": "Pleroma FE",
-  "theme": "base16-ashes.css",
+  "theme": "base16-pleroma-dark.css",
   "background": "/static/bg.jpg",
   "logo": "/static/logo.png"
 }
diff --git a/static/css/base16-pleroma-dark.css b/static/css/base16-pleroma-dark.css
new file mode 100644
index 00000000..8190d2a7
--- /dev/null
+++ b/static/css/base16-pleroma-dark.css
@@ -0,0 +1,33 @@
+.base00-background { background-color: #161c20; }
+.base01-background { background-color: #282e32; }
+.base02-background { background-color: #343a3f; }
+.base03-background { background-color: #4e5256; }
+.base04-background { background-color: #ababab; }
+.base05-background { background-color: #b9b9b9; }
+.base06-background { background-color: #d0d0d0; }
+.base07-background { background-color: #e7e7e7; }
+.base08-background { background-color: #baaa9c; }
+.base09-background { background-color: #999999; }
+.base0A-background { background-color: #a0a0a0; }
+.base0B-background { background-color: #8e8e8e; }
+.base0C-background { background-color: #868686; }
+.base0D-background { background-color: #686868; }
+.base0E-background { background-color: #747474; }
+.base0F-background { background-color: #5e5e5e; }
+
+.base00 { color: #161c20; }
+.base01 { color: #282e32; }
+.base02 { color: #36393e; }
+.base03 { color: #4e5256; }
+.base04 { color: #ababab; }
+.base05 { color: #b9b9b9; }
+.base06 { color: #d0d0d0; }
+.base07 { color: #e7e7e7; }
+.base08 { color: #baaa9c; }
+.base09 { color: #999999; }
+.base0A { color: #a0a0a0; }
+.base0B { color: #8e8e8e; }
+.base0C { color: #868686; }
+.base0D { color: #686868; }
+.base0E { color: #747474; }
+.base0F { color: #5e5e5e; }
diff --git a/static/css/base16-pleroma-light.css b/static/css/base16-pleroma-light.css
new file mode 100644
index 00000000..1a85689a
--- /dev/null
+++ b/static/css/base16-pleroma-light.css
@@ -0,0 +1,33 @@
+.base00-background { background-color: #f2f4f6; }
+.base01-background { background-color: #dde2e6; }
+.base02-background { background-color: #c0c6cb; }
+.base03-background { background-color: #a4a4a4; }
+.base04-background { background-color: #545454; }
+.base05-background { background-color: #304055; }
+.base06-background { background-color: #040404; }
+.base07-background { background-color: #000000; }
+.base08-background { background-color: #e92f2f; }
+.base09-background { background-color: #e09448; }
+.base0A-background { background-color: #dddd13; }
+.base0B-background { background-color: #0ed839; }
+.base0C-background { background-color: #23edda; }
+.base0D-background { background-color: #3b48e3; }
+.base0E-background { background-color: #f996e2; }
+.base0F-background { background-color: #69542d; }
+
+.base00 { color: #f2f4f6; }
+.base01 { color: #dde2e6; }
+.base02 { color: #c0c6cb; }
+.base03 { color: #a4a4a4; }
+.base04 { color: #545454; }
+.base05 { color: #304055; }
+.base06 { color: #040404; }
+.base07 { color: #000000; }
+.base08 { color: #e46f0f; }
+.base09 { color: #e09448; }
+.base0A { color: #dddd13; }
+.base0B { color: #0ed839; }
+.base0C { color: #23edda; }
+.base0D { color: #3b48e3; }
+.base0E { color: #f996e2; }
+.base0F { color: #69542d; }
diff --git a/static/css/themes.json b/static/css/themes.json
index e3c35d6d..ea8e5a0c 100644
--- a/static/css/themes.json
+++ b/static/css/themes.json
@@ -1,4 +1,6 @@
 [
+"base16-pleroma-dark.css",
+"base16-pleroma-light.css",
 "base16-3024.css",
 "base16-apathy.css",
 "base16-ashes.css",

From 3fb50205fb718123815ad93681cbb1133719a327 Mon Sep 17 00:00:00 2001
From: Shpuld Shpuldson <shpuld@gmail.com>
Date: Thu, 13 Apr 2017 08:31:57 -0400
Subject: [PATCH 07/18] Updated README.md screenshot.

---
 README.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/README.md b/README.md
index bdab5251..114228d8 100644
--- a/README.md
+++ b/README.md
@@ -2,7 +2,7 @@
 
 > A Qvitter-style frontend for certain GS servers.
 
-![screenshot](http://i.imgur.com/3q30Zxt.jpg)
+![screenshot](https://my.mixtape.moe/kjzioz.PNG)
 
 # FOR ADMINS
 

From 83205b8c0e317d63c9cef86ede6a84a69021f4e2 Mon Sep 17 00:00:00 2001
From: Shpuld Shpuldson <shpuld@gmail.com>
Date: Thu, 13 Apr 2017 16:17:57 +0300
Subject: [PATCH 08/18] Make sidepanel scroll independently from timeline,
 allows for seeing notifications and posting new statuses even when scrolled
 deep down.

---
 src/App.scss                                  | 28 +++++++++++++++++++
 src/App.vue                                   | 12 +++++---
 .../notifications/notifications.scss          |  2 ++
 3 files changed, 38 insertions(+), 4 deletions(-)

diff --git a/src/App.scss b/src/App.scss
index 8a1942c6..6e584f3d 100644
--- a/src/App.scss
+++ b/src/App.scss
@@ -222,6 +222,12 @@ nav {
     flex-basis: 35%;
 }
 
+.sidebar-flexer {
+  flex: 1;
+  flex-basis: 35%;
+  width: 365px;
+}
+
 .mobile-shown {
     display: none;
 }
@@ -238,6 +244,28 @@ nav {
     }
 }
 
+@media all and (min-width: 960px) {
+  .sidebar {
+    overflow: hidden;
+    max-height: 100vh;
+    max-width: 345px;
+    position: fixed;
+    margin-top: -10px;
+
+    .sidebar-container {
+      height: 96vh;
+      padding-top: 10px;
+      margin-right: -40px;
+      padding-right: 25px;
+      overflow-x: hidden;
+      overflow-y: auto;
+    }
+  }
+  .sidebar-flexer {
+    max-height: 96vh;
+  }
+}
+
 @media all and (max-width: 959px) {
     .mobile-hidden {
         display: none;
diff --git a/src/App.vue b/src/App.vue
index c4b3cb13..fcfdae97 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -15,10 +15,14 @@
         <button @click="activatePanel('sidebar')">Sidebar</button>
         <button @click="activatePanel('timeline')">Timeline</button>
       </div>
-      <div class="sidebar" :class="{ 'mobile-hidden': mobileActivePanel != 'sidebar' }">
-        <user-panel></user-panel>
-        <nav-panel></nav-panel>
-        <notifications v-if="currentUser"></notifications>
+      <div class="sidebar-flexer" :class="{ 'mobile-hidden': mobileActivePanel != 'sidebar'}">
+        <div class="sidebar" :class="{ 'mobile-hidden': mobileActivePanel != 'sidebar' }">
+          <div class="sidebar-container">
+            <user-panel></user-panel>
+            <nav-panel></nav-panel>
+            <notifications v-if="currentUser"></notifications>
+          </div>
+        </div>
       </div>
       <div class="main" :class="{ 'mobile-hidden': mobileActivePanel != 'timeline' }">
         <transition name="fade">
diff --git a/src/components/notifications/notifications.scss b/src/components/notifications/notifications.scss
index 9bc2a5ec..c7c650a9 100644
--- a/src/components/notifications/notifications.scss
+++ b/src/components/notifications/notifications.scss
@@ -1,6 +1,8 @@
 @import '../../_variables.scss';
 
 .notifications {
+  // a bit of a hack to allow scrolling below notifications
+  padding-bottom: 15em;
 
   .panel-heading {
     // force the text to stay centered, while keeping

From f1764796e1f757bd6d51db9b3d8ade3e0d0d80b5 Mon Sep 17 00:00:00 2001
From: Shpuld Shpuldson <shpuld@gmail.com>
Date: Thu, 13 Apr 2017 17:01:18 +0300
Subject: [PATCH 09/18] Fixed flex issue between 980 and 960 pixels width

---
 src/App.scss | 13 ++++++++-----
 1 file changed, 8 insertions(+), 5 deletions(-)

diff --git a/src/App.scss b/src/App.scss
index 6e584f3d..16278e98 100644
--- a/src/App.scss
+++ b/src/App.scss
@@ -213,18 +213,19 @@ nav {
 }
 
 .main {
-    flex: 1;
-    flex-basis: 65%;
+    flex-basis: 60%;
+    flex-grow: 1;
+    flex-shrink: 1;
 }
 
 .sidebar {
-    flex: 1;
-    flex-basis: 35%;
+  flex: 1;
+  flex-basis: 35%;
 }
 
 .sidebar-flexer {
   flex: 1;
-  flex-basis: 35%;
+  flex-basis: 345px;
   width: 365px;
 }
 
@@ -263,6 +264,8 @@ nav {
   }
   .sidebar-flexer {
     max-height: 96vh;
+    flex-shrink: 0;
+    flex-grow: 0;
   }
 }
 

From 69ef9101d4066df5df6780a2bfaeaa949869df02 Mon Sep 17 00:00:00 2001
From: Shpuld Shpuldson <shpuld@gmail.com>
Date: Thu, 13 Apr 2017 17:57:20 +0300
Subject: [PATCH 10/18] Fix login screen, (remove one duplicate line from user
 card css).

---
 src/App.scss                                           | 7 ++++---
 src/components/user_card_content/user_card_content.vue | 1 -
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/App.scss b/src/App.scss
index 16278e98..0f5c13c7 100644
--- a/src/App.scss
+++ b/src/App.scss
@@ -219,7 +219,7 @@ nav {
 }
 
 .sidebar {
-  flex: 1;
+  flex: 0;
   flex-basis: 35%;
 }
 
@@ -249,17 +249,18 @@ nav {
   .sidebar {
     overflow: hidden;
     max-height: 100vh;
-    max-width: 345px;
+    width: 345px;
     position: fixed;
     margin-top: -10px;
 
     .sidebar-container {
       height: 96vh;
+      width: 360px;
       padding-top: 10px;
       margin-right: -40px;
       padding-right: 25px;
       overflow-x: hidden;
-      overflow-y: auto;
+      overflow-y: scroll;
     }
   }
   .sidebar-flexer {
diff --git a/src/components/user_card_content/user_card_content.vue b/src/components/user_card_content/user_card_content.vue
index 7b89a7f2..bba16584 100644
--- a/src/components/user_card_content/user_card_content.vue
+++ b/src/components/user_card_content/user_card_content.vue
@@ -116,7 +116,6 @@
 }
 
 .profile-panel-body {
-  padding-top: 0em;
   top: -0em;
   padding-top: 4em;
 }

From 2efddaf874b4125dac26415e251d4e542cb0b816 Mon Sep 17 00:00:00 2001
From: Shpuld Shpuldson <shpuld@gmail.com>
Date: Thu, 13 Apr 2017 23:36:16 +0300
Subject: [PATCH 11/18] Tweak values to minimize distracting artifacting when
 scrollbars are smaller or don't exist.

---
 src/App.scss | 7 +++----
 1 file changed, 3 insertions(+), 4 deletions(-)

diff --git a/src/App.scss b/src/App.scss
index 0f5c13c7..0a7e1ce5 100644
--- a/src/App.scss
+++ b/src/App.scss
@@ -249,16 +249,15 @@ nav {
   .sidebar {
     overflow: hidden;
     max-height: 100vh;
-    width: 345px;
+    width: 350px;
     position: fixed;
     margin-top: -10px;
 
     .sidebar-container {
       height: 96vh;
-      width: 360px;
+      width: 362px;
       padding-top: 10px;
-      margin-right: -40px;
-      padding-right: 25px;
+      padding-right: 20px;
       overflow-x: hidden;
       overflow-y: scroll;
     }

From e64905d88ba25074c6ac4f683abd4c1f54870e08 Mon Sep 17 00:00:00 2001
From: Shpuld Shpuldson <shpuld@gmail.com>
Date: Fri, 14 Apr 2017 13:43:53 +0300
Subject: [PATCH 12/18] Change attachments margin to not cause the element to
 overflow.

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

diff --git a/src/components/attachment/attachment.vue b/src/components/attachment/attachment.vue
index 1ba1c02a..d50664b6 100644
--- a/src/components/attachment/attachment.vue
+++ b/src/components/attachment/attachment.vue
@@ -33,10 +33,10 @@
   .attachments {
       display: flex;
       flex-wrap: wrap;
-      margin-right: -0.8em;
+      margin-right: -0.7em;
       .attachment {
           flex: 1 0 30%;
-          margin: 0.5em 0.8em 0.6em 0.0em;
+          margin: 0.5em 0.7em 0.6em 0.0em;
           align-self: flex-start;
 
           &.html {

From c708ebb5d2467d601d7cbcffa2459e745ef02d0a Mon Sep 17 00:00:00 2001
From: Shpuld Shpuldson <shpuld@gmail.com>
Date: Fri, 14 Apr 2017 15:58:34 +0300
Subject: [PATCH 13/18] Fix statusoid == undefined bug that prevented
 conversation opening in new tabs.

---
 src/components/conversation/conversation.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/conversation/conversation.js b/src/components/conversation/conversation.js
index f3aeb216..e89fa84f 100644
--- a/src/components/conversation/conversation.js
+++ b/src/components/conversation/conversation.js
@@ -10,7 +10,7 @@ const sortAndFilterConversation = (conversation) => {
 const conversation = {
   data () {
     return {
-      highlight: this.statusoid.id
+      highlight: null
     }
   },
   props: [

From dd662469130315396b9bd0cae6f06e940a4a045a Mon Sep 17 00:00:00 2001
From: Shpuld Shpuldson <shpuld@gmail.com>
Date: Fri, 14 Apr 2017 20:08:37 +0300
Subject: [PATCH 14/18] Add lang="en" to html to potentially fix font fall-back
 issues on some language/font setups.

---
 index.html | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/index.html b/index.html
index 668b21bb..b7654cc1 100644
--- a/index.html
+++ b/index.html
@@ -1,5 +1,5 @@
 <!DOCTYPE html>
-<html>
+<html lang="en">
   <head>
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width, initial-scale=1">

From 6d7fcb057d7578ed33c556641a4ff25c6be74d4e Mon Sep 17 00:00:00 2001
From: Roger Braun <roger@rogerbraun.net>
Date: Fri, 14 Apr 2017 22:08:08 +0200
Subject: [PATCH 15/18] Add missing route-link end tags.

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

diff --git a/src/components/notifications/notifications.vue b/src/components/notifications/notifications.vue
index 661d842c..a326e9cd 100644
--- a/src/components/notifications/notifications.vue
+++ b/src/components/notifications/notifications.vue
@@ -14,11 +14,11 @@
           <div class='text'>
             <timeago :since="notification.action.created_at" :auto-update="240"></timeago>
             <div v-if="notification.type === 'favorite'">
-              <h1>{{ notification.action.user.name }}<br><i class="fa icon-star"></i> favorited your <router-link :to="{ name: 'conversation', params: { id: notification.status.id } }">status</h1>
+              <h1>{{ notification.action.user.name }}<br><i class="fa icon-star"></i> favorited your <router-link :to="{ name: 'conversation', params: { id: notification.status.id } }">status</router-link></h1>
               <p>{{ notification.status.text }}</p>
             </div>
             <div v-if="notification.type === 'repeat'">
-              <h1>{{ notification.action.user.name }}<br><i class="fa icon-retweet"></i> repeated your <router-link :to="{ name: 'conversation', params: { id: notification.status.id } }">status</h1>
+              <h1>{{ notification.action.user.name }}<br><i class="fa icon-retweet"></i> repeated your <router-link :to="{ name: 'conversation', params: { id: notification.status.id } }">status</router-link></h1>
               <p>{{ notification.status.text }}</p>
             </div>
             <div v-if="notification.type === 'mention'">

From ca8755a6f368b8239d469b22d7654c211d560581 Mon Sep 17 00:00:00 2001
From: Shpuld Shpuldson <shpuld@gmail.com>
Date: Mon, 17 Apr 2017 10:45:12 +0300
Subject: [PATCH 16/18] Make X icon parent position: relative; to prevent it
 from floating on its own.

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

diff --git a/src/components/post_status_form/post_status_form.vue b/src/components/post_status_form/post_status_form.vue
index 07280a41..b5a3c738 100644
--- a/src/components/post_status_form/post_status_form.vue
+++ b/src/components/post_status_form/post_status_form.vue
@@ -53,6 +53,10 @@
      .attachments {
          padding: 0.5em;
 
+         .attachment {
+           position: relative;
+         }
+
          i {
             position: absolute;
             margin: 10px;

From 6b758741369a5adb8f038b8c6a571fa9fce4aacd Mon Sep 17 00:00:00 2001
From: Shpuld Shpuldson <shpuld@gmail.com>
Date: Mon, 17 Apr 2017 11:18:06 +0300
Subject: [PATCH 17/18] Move attachments below buttons to prevent the buttons
 from shifting after uploading.

---
 .../post_status_form/post_status_form.vue           | 13 +++++++------
 1 file changed, 7 insertions(+), 6 deletions(-)

diff --git a/src/components/post_status_form/post_status_form.vue b/src/components/post_status_form/post_status_form.vue
index 07280a41..d2bcba51 100644
--- a/src/components/post_status_form/post_status_form.vue
+++ b/src/components/post_status_form/post_status_form.vue
@@ -4,6 +4,10 @@
       <div class="form-group" >
         <textarea v-model="newStatus.status" placeholder="Just landed in L.A." rows="3" class="form-control" @keyup.meta.enter="postStatus(newStatus)" @keyup.ctrl.enter="postStatus(newStatus)" @drop="fileDrop" @dragover.prevent="fileDrag"></textarea>
       </div>
+      <div class='form-bottom'>
+        <media-upload @uploading="disableSubmit" @uploaded="addMediaFile" @upload-failed="enableSubmit" :drop-files="dropFiles"></media-upload>
+        <button :disabled="submitDisabled" type="submit" class="btn btn-default base05 base01-background">Submit</button>
+      </div>
       <div class="attachments">
         <div class="attachment" v-for="file in newStatus.files">
           <i class="fa icon-cancel" @click="removeMediaFile(file)"></i>
@@ -13,10 +17,6 @@
           <a v-if="type(file) === 'unknown'" :href="file.image">{{file.url}}</a>
         </div>
       </div>
-      <div class='form-bottom'>
-        <media-upload @uploading="disableSubmit" @uploaded="addMediaFile" @upload-failed="enableSubmit" :drop-files="dropFiles"></media-upload>
-        <button :disabled="submitDisabled" type="submit" class="btn btn-default base05 base01-background">Submit</button>
-      </div>
     </form>
   </div>
 </template>
@@ -44,14 +44,15 @@
      .form-bottom {
          display: flex;
          padding: 0.5em;
+         height: 32px;
 
          button {
-             flex: 2;
+             width: 10em;
          }
      }
 
      .attachments {
-         padding: 0.5em;
+         padding: 0 0.5em;
 
          i {
             position: absolute;

From 88309b446f9adc2c074b653661b182f39a07cfbc Mon Sep 17 00:00:00 2001
From: Shpuld Shpuldson <shpuld@gmail.com>
Date: Mon, 17 Apr 2017 11:42:33 +0300
Subject: [PATCH 18/18] Adjust attachment preview margins.

---
 src/components/post_status_form/post_status_form.vue | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/components/post_status_form/post_status_form.vue b/src/components/post_status_form/post_status_form.vue
index 13f4d465..c3f1b1f0 100644
--- a/src/components/post_status_form/post_status_form.vue
+++ b/src/components/post_status_form/post_status_form.vue
@@ -56,6 +56,7 @@
 
          .attachment {
            position: relative;
+           margin: 0.5em 0.8em 0.2em 0;
          }
 
          i {