Merge branch 'release-3.9' into merge-3.9

webapp/sass/layout/_headers.scss

@@ -5,7 +5,9 @@
     border-left: none;
     font-size: 14px;
     line-height: 56px;
+    position: relative;
     width: 100%;
+    z-index: 5;
 
     .member-popover__trigger,
     .pinned-posts-button {

webapp/sass/layout/_markdown.scss

@@ -31,6 +31,12 @@ h6 {
     font-weight: 700;
     line-height: 1.5;
     margin: 10px 0;
+
+    .emoticon {
+        min-height: 1.5em;
+        min-width: 1.5em;
+        vertical-align: top;
+    }
 }
 
 .markdown__paragraph-inline {

webapp/sass/layout/_navigation.scss

@@ -41,6 +41,14 @@
             width: 43px;
             z-index: 5;
 
+            > span {
+                > svg {
+                    position: relative;
+                    top: 13px;
+                    vertical-align: top;
+                }
+            }
+
             .icon-bar {
                 background: $white;
                 width: 21px;
@@ -49,7 +57,8 @@
             .icon-search {
                 font-size: 17px;
                 position: relative;
-                top: -2px;
+                top: 11px;
+                vertical-align: top;
             }
 
             .icon--white {
@@ -93,7 +102,7 @@
             .description {
                 color: $white;
                 display: inline-block;
-                margin-right: .5em;
+                margin-right: 1em;
 
                 &.info-popover {
                     @include background-size(100% 100%);

webapp/sass/layout/_post.scss

@@ -651,6 +651,12 @@
             visibility: visible;
         }
 
+        .post__header {
+            .col__reply {
+                z-index: 7;
+            }
+        }
+
         .post__body {
             background: transparent !important;
         }

webapp/sass/layout/_sidebar-right.scss

@@ -8,7 +8,7 @@
     position: fixed;
     right: 0;
     width: 400px;
-    z-index: 6;
+    z-index: 8;
 
     &.webrtc {
         z-index: 5;

webapp/sass/responsive/_mobile.scss

@@ -1,6 +1,12 @@
 @charset 'UTF-8';
 
 @media screen and (max-width: 768px) {
+    .member-role .member-menu,
+    .member-drop .member-menu {
+        right: 0;
+        top: 30px;
+    }
+
     .post-code {
         word-wrap: normal;
     }
@@ -109,9 +115,10 @@
             font-weight: 200;
             height: 30px;
             left: 50%;
-            line-height: 27px;
+            line-height: 0;
             margin-left: -15px;
             opacity: 1;
+            padding-top: 13px;
             position: fixed;
             text-align: center;
             text-shadow: none;
@@ -856,6 +863,18 @@
 
             .navbar-brand {
                 white-space: nowrap;
+
+                .heading {
+                    line-height: normal;
+                    position: relative;
+                    top: 11px;
+                    vertical-align: top;
+                }
+
+                .header-dropdown__icon {
+                    top: 18px;
+                    vertical-align: top;
+                }
             }
 
             .dropdown {
@@ -892,9 +911,10 @@
                     font-weight: 200;
                     height: 30px;
                     left: 50%;
-                    line-height: 27px;
+                    line-height: 0;
                     margin-left: -15px;
                     opacity: 1;
+                    padding-top: 13px;
                     position: fixed;
                     text-align: center;
                     text-shadow: none;
@@ -1734,7 +1754,7 @@
     }
 }
 
-@media screen and (max-width: 320px) and (max-height: 560px) {
+@media screen and (max-width: 380px) and (max-height: 580px) {
     #navbar {
         .navbar-default {
             .dropdown-menu {
@@ -1743,7 +1763,8 @@
                 > li {
                     > a {
                         border: none;
-                        line-height: 28px;
+                        font-size: 13px;
+                        line-height: 27px;
                     }
                 }
             }
@@ -1751,16 +1772,19 @@
     }
 }
 
+
+
 // on iOS, allow clicks within an input's label to actually propagate through to the input itself,
 // but still allow clicks to a elements to go trough
 // http://stackoverflow.com/a/34810294/6325807
 label {
-  span {
-    pointer-events: none;
-  }
-  span a {
-    pointer-events: all;
-  }
+    span {
+        pointer-events: none;
+    }
+
+    span a {
+        pointer-events: all;
+    }
 }
 
 @media screen and (-webkit-min-device-pixel-ratio: 0) {

webapp/sass/routes/_signup.scss

@@ -215,7 +215,9 @@
             display: inline-block;
             height: 18px;
             margin-right: 8px;
+            position: relative;
             text-align: center;
+            top: -1px;
             width: 18px;
         }
 
@@ -231,6 +233,18 @@
             text-align: left;
             width: 200px;
 
+            > span {
+                position: relative;
+                top: 11px;
+                vertical-align: top;
+
+                > span {
+                    display: inline-block;
+                    line-height: normal;
+                    vertical-align: top;
+                }
+            }
+
             &.gitlab {
                 background: #554488;
 
@@ -238,10 +252,6 @@
                     background: darken(#554488, 10%);
                 }
 
-                span {
-                    vertical-align: middle;
-                }
-
                 .icon {
                     background-image: url('../images/gitlabLogo.png');
                 }
@@ -254,10 +264,6 @@
                     background: darken(#dd4b39, 10%);
                 }
 
-                span {
-                    vertical-align: middle;
-                }
-
                 .icon {
                     background-image: url('../images/googleLogo.png');
                 }
@@ -270,10 +276,6 @@
                     background: darken(#0079d6, 10%);
                 }
 
-                span {
-                    vertical-align: middle;
-                }
-
                 .icon {
                     background-image: url('../images/office365Logo.png');
                 }
@@ -285,10 +287,6 @@
                 &:hover {
                     background: darken(#3AA1CF, 10%);
                 }
-
-                span {
-                    vertical-align: middle;
-                }
             }
 
             &.email {
@@ -297,10 +295,6 @@
                 &:hover {
                     background: $primary-color--hover;
                 }
-
-                span {
-                    vertical-align: middle;
-                }
             }
 
             &.saml {
@@ -309,10 +303,6 @@
                 &:hover {
                     background: darken(#34a28b, 10%);
                 }
-
-                span {
-                    vertical-align: middle;
-                }
             }
 
             &.btn--full {