X-Git-Url: https://git.librecmc.org/?a=blobdiff_plain;f=client%2Fsrc%2Fapp%2Fshared%2Fvideo%2Fvideo-miniature.component.scss;h=b63fd2989efcad94cdf57756c8ae6aaecac64e19;hb=e612209767ebe1deb0af7688c96b7f979bb52b44;hp=3658ee3c006608852a77bbf014370b15db5062db;hpb=dc8902634864841be7ca483b8e1c0f5afa609c32;p=oweals%2Fpeertube.git

diff --git a/client/src/app/shared/video/video-miniature.component.scss b/client/src/app/shared/video/video-miniature.component.scss
index 3658ee3c0..b63fd2989 100644
--- a/client/src/app/shared/video/video-miniature.component.scss
+++ b/client/src/app/shared/video/video-miniature.component.scss
@@ -3,7 +3,7 @@
 @import '_miniature';
 
 $more-button-width: 41px;
-$more-margin-right: 10px;
+$more-margin-right: 15px;
 
 .video-miniature {
   width: $video-miniature-width;
@@ -64,7 +64,6 @@ $more-margin-right: 10px;
 
     .video-actions {
       margin-top: 3px;
-      margin-right: $more-margin-right;
       width: $more-button-width;
       height: 30px;
 
@@ -75,10 +74,14 @@ $more-margin-right: 10px;
       ::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) {
@@ -97,11 +100,17 @@ $more-margin-right: 10px;
     }
   }
 
+  &: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;
@@ -109,8 +118,10 @@ $more-margin-right: 10px;
 
     .video-bottom {
       .video-miniature-information {
-        width: auto;
-        min-width: 500px;
+        @media screen and (min-width: $small-view) {
+          width: auto;
+          min-width: 500px;
+        }
 
         .video-miniature-name {
           @include ellipsis-multiline(1.3em, 2);