Fix anonymous nsfw policy

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

diff --git a/client/src/app/videos/+video-watch/video-watch-playlist.component.scss b/client/src/app/videos/+video-watch/video-watch-playlist.component.scss
index 5da55c2f8ddfa3d8947059afa8f3e4c085c8e537..0b0a2a899a38216cc6caa8a0913a8be11229bc01 100644 (file)
--- a/client/src/app/videos/+video-watch/video-watch-playlist.component.scss
+++ b/client/src/app/videos/+video-watch/video-watch-playlist.component.scss
@@ -7,7 +7,7 @@
   min-width: 200px;
   max-width: 470px;
   height: 66vh;
-  background-color: var(--mainBackgroundColor);
+  background-color: pvar(--mainBackgroundColor);
   overflow-y: auto;
   border-bottom: 1px solid $separator-border-color;
 
@@ -22,7 +22,7 @@
     }
 
     .playlist-by-index {
-      color: $grey-foreground-color;
+      color: pvar(--greyForegroundColor);
       display: flex;
 
       .playlist-by {
@@ -34,10 +34,29 @@
         margin: 0 3px;
       }
     }
+
+    .playlist-controls {
+      display: flex;
+      margin: 10px 0;
+
+      my-global-icon:not(:last-child) {
+        margin-right: .5rem;
+      }
+
+      my-global-icon {
+        &:not(.active) {
+          opacity: .5
+        }
+
+        ::ng-deep {
+          cursor: pointer;
+        }
+      }
+    }
   }
 
   my-video-playlist-element-miniature {
-    /deep/ {
+    ::ng-deep {
       .video {
         .position {
           margin-right: 0;
@@ -53,6 +72,11 @@
       my-video-thumbnail {
         @include thumbnail-size-component(90px, 50px);
       }
+
+      .fake-thumbnail {
+        width: 90px;
+        height: 50px;
+      }
     }
   }
 }