fix(ui): site-title style (#196)

This fixes that the header and title are broken on devices with low resolutions such as the iPhone SE due to word wrapping when I set long title.

| Before | After |
| :-----: | :----: |
| ![before](https://user-images.githubusercontent.com/38746192/50142909-92361280-02ee-11e9-8df5-b6dc4988843c.png) | ![after](https://user-images.githubusercontent.com/38746192/50142923-9bbf7a80-02ee-11e9-82d0-932045e1574a.png) |

src/components/Header.vue

@@ -72,6 +72,7 @@ export default {
   font-size: 1.2rem;
   display: flex;
   align-items: center;
+  white-space: nowrap;
 
   & a {
     color: #000;
@@ -81,11 +82,24 @@ export default {
 
 .header-inner {
   padding: 0 20px;
-  display: flex;
-  justify-content: space-between;
+  position: relative;
+  overflow: hidden;
 }
 
 .header-left {
   display: flex;
 }
+
+.header-right {
+  position: absolute;
+  right: 0;
+  top: 0;
+  height: calc(var(--header-height) - 1px);
+  background: var(--sidebar-bg);
+  padding: 0 20px;
+
+  @media (max-width: 768px) {
+    display: none;
+  }
+}
 </style>