watch view visual tweaks and search/comment placeholder dismiss on focus (#983)

[github/Chocobozzz/PeerTube.git] / client / src / app / videos / +video-watch / video-watch.component.scss

diff --git a/client/src/app/videos/+video-watch/video-watch.component.scss b/client/src/app/videos/+video-watch/video-watch.component.scss
index 9bd510c9fb82116af596167d0c139bdfd90270ad..afd846af32393f34e938c124bac964ac5099a4ce 100644 (file)
--- a/client/src/app/videos/+video-watch/video-watch.component.scss
+++ b/client/src/app/videos/+video-watch/video-watch.component.scss
@@ -76,12 +76,9 @@
 
 .video-bottom {
   margin-top: 40px;
-  display: flex;
-  flex-grow: 1;
 
   .video-info {
     flex-grow: 1;
-    margin-right: 40px;
     // Set min width for flex item
     min-width: 1px;
 
@@ -284,10 +281,13 @@
         }
 
         .video-info-likes-dislikes-bar {
-          height: 5px;
+          $likes-bar-height: 2px;
+          height: $likes-bar-height;
+          margin-top: -$likes-bar-height;
           width: 186px;
           background-color: #E5E5E5;
-          margin-top: 25px;
+          position: relative;
+          top: 10px;
 
           .likes-bar {
             height: 100%;
@@ -439,19 +439,14 @@
 @media screen and (max-width: 1600px) {
   .video-bottom {
     .video-info {
-      margin-right: 20px;
-
       .video-info-first-row {
         flex-direction: column;
-        margin-bottom: 30px;
+        margin-bottom: 20px;
 
         .video-actions-rates {
           margin-top: 20px;
+          margin-bottom: 10px;
           align-items: start;
-
-          .video-info-likes-dislikes-bar {
-            margin-top: 10px;
-          }
         }
       }