Merge branch 'develop' into shigusegubu

* develop:
  small fix
  Made showing format selection optional and default to false
  Fix mistakes
  Change styles a bit, make pre-formatted blocks not overflow but scroll
  Add styles for h1/2/3/4/5 tags in status html
  post status form: styling fixes for content-type selector, align icons with selector
  Pass user id to fetchFriends
  i18n: make "plain text" translatable
  add the ability to select a post's content type
  fix
  Add titles to source/expand buttons
  Add titles to post visibility icons

src/components/notifications/notifications.scss

@@ -22,8 +22,6 @@
   }
 
   .loadmore-error {
-    position: absolute;
-    right: 0.6em;
     min-width: 6em;
     text-align: center;
     padding: 0 0.25em 0 0.25em;

src/components/post_status_form/post_status_form.js

@@ -138,6 +138,9 @@ const PostStatusForm = {
     },
     scopeOptionsEnabled () {
       return this.$store.state.config.scopeOptionsEnabled
+    },
+    formattingOptionsEnabled () {
+      return this.$store.state.config.formattingOptionsEnabled
     }
   },
   methods: {

src/components/post_status_form/post_status_form.vue

@@ -32,11 +32,24 @@
         @input="resize"
         @paste="paste">
       </textarea>
-      <div v-if="scopeOptionsEnabled" class="visibility-tray">
-        <i v-on:click="changeVis('direct')" class="icon-mail-alt" :class="vis.direct" :title="$t('post_status.scope.direct')"></i>
-        <i v-on:click="changeVis('private')" class="icon-lock" :class="vis.private" :title="$t('post_status.scope.private')"></i>
-        <i v-on:click="changeVis('unlisted')" class="icon-lock-open-alt" :class="vis.unlisted" :title="$t('post_status.scope.unlisted')"></i>
-        <i v-on:click="changeVis('public')" class="icon-globe" :class="vis.public" :title="$t('post_status.scope.public')"></i>
+      <div class="visibility-tray">
+        <span class="text-format" v-if="formattingOptionsEnabled">
+          <label for="post-content-type" class="select">
+            <select id="post-content-type" v-model="newStatus.contentType" class="form-control">
+              <option value="text/plain">{{$t('post_status.content_type.plain_text')}}</option>
+              <option value="text/html">HTML</option>
+              <option value="text/markdown">Markdown</option>
+            </select>
+            <i class="icon-down-open"></i>
+          </label>
+        </span>
+
+        <div v-if="scopeOptionsEnabled">
+          <i v-on:click="changeVis('direct')" class="icon-mail-alt" :class="vis.direct" :title="$t('post_status.scope.direct')"></i>
+          <i v-on:click="changeVis('private')" class="icon-lock" :class="vis.private" :title="$t('post_status.scope.private')"></i>
+          <i v-on:click="changeVis('unlisted')" class="icon-lock-open-alt" :class="vis.unlisted" :title="$t('post_status.scope.unlisted')"></i>
+          <i v-on:click="changeVis('public')" class="icon-globe" :class="vis.public" :title="$t('post_status.scope.public')"></i>
+        </div>
       </div>
     </div>
     <div style="position:relative;" v-if="candidates">

src/components/status/status.js

@@ -282,6 +282,11 @@ const Status = {
         }
       }
     }
+  },
+  filters: {
+    capitalize: function (str) {
+      return str.charAt(0).toUpperCase() + str.slice(1)
+    }
   }
 }
 

src/components/status/status.vue

@@ -58,11 +58,15 @@
                 <timeago :since="status.created_at" :auto-update="60"></timeago>
               </router-link>
               <div class="visibility-icon" v-if="status.visibility">
-                <i :class="visibilityIcon(status.visibility)"></i>
+                <i :class="visibilityIcon(status.visibility)" :title="status.visibility | capitalize"></i>
               </div>
-              <a :href="status.external_url" target="_blank" v-if="!status.is_local" class="source_url"><i class="icon-link-ext-alt"></i></a>
+              <a :href="status.external_url" target="_blank" v-if="!status.is_local" class="source_url" title="Source">
+                <i class="icon-link-ext-alt"></i>
+              </a>
               <template v-if="expandable">
-                <a href="#" @click.prevent="toggleExpanded"><i class="icon-plus-squared"></i></a>
+                <a href="#" @click.prevent="toggleExpanded" title="Expand">
+                  <i class="icon-plus-squared"></i>
+                </a>
               </template>
               <a href="#" @click.prevent="toggleMute" v-if="unmuted"><i class="icon-eye-off"></i></a>
             </div>
@@ -331,11 +335,35 @@
       font-style: italic;
     }
 
+    pre {
+      overflow: auto;
+    }
+
     p {
       margin: 0;
       margin-top: 0.2em;
       margin-bottom: 0.5em;
     }
+
+    h1 {
+      font-size: 1.1em;
+      line-height: 1.2em;
+      margin: 1.4em 0;
+    }
+
+    h2 {
+      font-size: 1.1em;
+      margin: 1.0em 0;
+    }
+
+    h3 {
+      font-size: 1em;
+      margin: 1.2em 0;
+    }
+
+    h4 {
+      margin: 1.1em 0;
+    }
   }
 
   .retweet-info {

src/components/timeline/timeline.vue

@@ -66,8 +66,6 @@
   }
 
   .loadmore-error {
-    position: absolute;
-    right: 0.6em;
     font-size: 14px;
     min-width: 6em;
     text-align: center;

src/components/user_card/user_card.vue

@@ -73,12 +73,14 @@
   border-radius: var(--panelRadius, $fallback--panelRadius);
   border-style: solid;
   border-color: $fallback--border;
-	border-color: var(--border, $fallback--border);
+  border-color: var(--border, $fallback--border);
   border-width: 1px;
   overflow: hidden;
 
   .panel-heading {
     background: transparent;
+    flex-direction: column;
+    align-items: stretch;
   }
 
   p {