X-Git-Url: https://git.immae.eu/?a=blobdiff_plain;f=client%2Fsrc%2Fapp%2Fshared%2Fshared-video-playlist%2Fvideo-playlist-element-miniature.component.scss;h=c476b3ac19a4a646d681f05381a686d6ef8755fa;hb=8cbc40b2fe9d36ef0505b9441276ca561342e9e9;hp=082a5d9b2e2fbd0d647c34b9b026c45b1382910c;hpb=2d0d756e855e65e7235a86067b7e695b4ce6fc0f;p=github%2FChocobozzz%2FPeerTube.git

diff --git a/client/src/app/shared/shared-video-playlist/video-playlist-element-miniature.component.scss b/client/src/app/shared/shared-video-playlist/video-playlist-element-miniature.component.scss
index 082a5d9b2..c476b3ac1 100644
--- a/client/src/app/shared/shared-video-playlist/video-playlist-element-miniature.component.scss
+++ b/client/src/app/shared/shared-video-playlist/video-playlist-element-miniature.component.scss
@@ -1,6 +1,6 @@
-@import '_variables';
-@import '_mixins';
-@import '_miniature';
+@use '_variables' as *;
+@use '_mixins' as *;
+@use '_miniature' as *;
 
 $thumbnail-width: 130px;
 $thumbnail-height: 72px;
@@ -17,8 +17,9 @@ my-video-thumbnail {
 
 my-video-thumbnail,
 .fake-thumbnail {
+  @include margin-right(10px);
+
   display: flex; // Avoids an issue with line-height that adds space below the element
-  margin-right: 10px;
 }
 
 .video {
@@ -60,8 +61,9 @@ my-video-thumbnail,
     cursor: pointer;
 
     .position {
+      @include margin-right(10px);
+
       font-weight: $font-semibold;
-      margin-right: 10px;
       color: pvar(--greyForegroundColor);
       min-width: 25px;
 
@@ -84,23 +86,26 @@ my-video-thumbnail,
         width: auto;
       }
 
-      .video-info-account, .video-info-timestamp {
+      .video-info-account,
+      .video-info-timestamp {
         color: pvar(--greyForegroundColor);
       }
     }
   }
 
   .video-info-name {
+    @include ellipsis;
+
     font-size: 18px;
     font-weight: $font-semibold;
     display: inline-block;
-
-    @include ellipsis;
   }
 
-  .more, my-edit-button {
+  .more,
+  my-edit-button {
+    @include margin-left(auto);
+
     justify-self: flex-end;
-    margin-left: auto;
     cursor: pointer;
     min-width: 24px;
   }
@@ -118,30 +123,41 @@ my-video-thumbnail,
       display: flex;
 
       &::after {
-        border: none;
+        border: 0;
       }
     }
+  }
+}
 
-    .dropdown-item {
-      @include dropdown-with-icon-item;
-    }
+.dropdown-menu {
 
-    .timestamp-options {
-      padding-top: 0;
-      padding-left: 35px;
-      margin-bottom: 15px;
+  .dropdown-item {
+    @include dropdown-with-icon-item;
 
-      > div {
-        display: flex;
-        align-items: center;
-      }
+    cursor: pointer;
+  }
 
-      input {
-        @include peertube-button;
-        @include orange-button;
+  .timestamp-options {
+    @include padding-left(35px);
 
-        margin-top: 10px;
-      }
+    padding-top: 0;
+    margin-bottom: 15px;
+
+    > div {
+      display: flex;
+      align-items: center;
+      margin-bottom: 5px;
+    }
+
+    my-peertube-checkbox {
+      @include margin-right(5px);
+    }
+
+    input {
+      @include peertube-button;
+      @include orange-button;
+
+      margin-top: 10px;
     }
   }
 }