Multiple UI Improvements (#4253)

Reverting config

Reverting config.json

1 files changed, 33 insertions, 8 deletions

diff --git a/webapp/sass/responsive/_mobile.scss b/webapp/sass/responsive/_mobile.scss
index e0915178a..9a0190ebd 100644
--- a/webapp/sass/responsive/_mobile.scss
+++ b/webapp/sass/responsive/_mobile.scss
@@ -21,6 +21,21 @@
         }
     }
 
+    .video-div {
+        &.embed-responsive-item {
+            height: 0;
+            padding-bottom: 75%;
+
+            iframe {
+                height: 100%;
+                left: 0;
+                position: absolute;
+                top: 0;
+                width: 100%;
+            }
+        }
+    }
+
     .tutorial-steps__container {
         .tutorial__content {
             .tutorial__steps {
@@ -124,6 +139,14 @@
             }
         }
 
+        &.post--compact {
+            .status-wrapper {
+                &:after {
+                    bottom: 12px;
+                }
+            }
+        }
+
         &.same--root {
             &.same--user {
                 .flag-icon__container {
@@ -795,7 +818,7 @@
     }
 
     .sidebar--menu {
-        @include single-transition(transform, .5s, ease);
+        @include single-transition(transform, .35s, ease);
         @include translate3d(290px, 0, 0);
         border: none;
         display: block;
@@ -808,10 +831,11 @@
     }
 
     .sidebar--left {
-        @include single-transition(transform, .5s, ease);
+        @include single-transition(transform, .35s, ease);
         @include translate3d(-290px, 0, 0);
-        width: 290px;
         border: none;
+        width: 290px;
+
         &.sidebar--padded {
             padding-top: 0;
         }
@@ -944,7 +968,7 @@
     }
 
     .inner-wrap {
-        @include single-transition(all, .5s, ease);
+        @include single-transition(all, .35s, ease);
 
         .app__body & {
             &:before {
@@ -955,7 +979,7 @@
                 left: -15px;
                 position: absolute;
                 top: 0;
-                transition: background-color 0.5s ease, z-index 0s ease 0.5s;
+                transition: background-color .35s ease, z-index 0s ease .35s;
                 width: calc(100% + 30px);
                 z-index: 0;
             }
@@ -965,8 +989,9 @@
             @include translate3d(290px, 0, 0);
 
             &:before {
+                @include single-transition(all, .35s, ease);
+
                 background-color: rgba(0, 0, 0, .4);
-                transition: background-color .5s ease;
                 z-index: 9999;
             }
         }
@@ -975,8 +1000,8 @@
             @include translate3d(-290px, 0, 0);
 
             &:before {
-                background-color: rgba(0, 0, 0, 0.4);
-                transition: background-color 0.5s ease;
+                @include single-transition(all, .35s, ease);
+                background-color: rgba(0, 0, 0, .4);
                 z-index: 9999;
             }
         }