Merge branch 'release/2.2.0' into develop

[github/Chocobozzz/PeerTube.git] / client / src / app / shared / video / video-miniature.component.scss

diff --git a/client/src/app/shared/video/video-miniature.component.scss b/client/src/app/shared/video/video-miniature.component.scss
index 3988cc0556380d0135a1eb524a7aeb931e9c1962..23d918d009ef19d02753a2e214d23340a27700c6 100644 (file)
--- a/client/src/app/shared/video/video-miniature.component.scss
+++ b/client/src/app/shared/video/video-miniature.component.scss
@@ -36,7 +36,7 @@ $more-margin-right: 15px;
 
         display: block;
         font-size: 13px;
-        color: $grey-foreground-color;
+        color: var(--greyForegroundColor);
 
         &:hover {
           color: $grey-foreground-hover-color;
@@ -74,15 +74,23 @@ $more-margin-right: 15px;
       ::ng-deep .playlist-dropdown.show + my-action-dropdown .dropdown-root {
         opacity: 1;
       }
-    }
 
-    &:hover .video-actions ::ng-deep .dropdown-root {
-      opacity: 1;
+      ::ng-deep .more-icon {
+        opacity: .6;
+
+        &:hover {
+          opacity: 1;
+        }
+      }
     }
 
     @media screen and (max-width: $small-view) {
-      .video-miniature-information .video-miniature-name {
-        margin-top: 0;
+      .video-miniature-information {
+        margin: 0 10px;
+
+        .video-miniature-name {
+          margin-top: 0;
+        }
       }
 
       .video-actions {
@@ -96,11 +104,17 @@ $more-margin-right: 15px;
     }
   }
 
+  &:hover ::ng-deep .video-thumbnail .video-thumbnail-actions-overlay,
+  &:hover .video-bottom .video-actions ::ng-deep .dropdown-root {
+    opacity: 1;
+  }
+
   &.display-as-row {
     flex-direction: row;
     margin-bottom: 0;
     height: auto;
-    width: 100%;
+    display: flex;
+    flex-grow: 1;
 
     my-video-thumbnail {
       margin-right: 10px;