X-Git-Url: https://git.immae.eu/?a=blobdiff_plain;f=client%2Fsrc%2Fapp%2F%2Bmy-account%2Fmy-account-video-playlists%2Fmy-account-video-playlist-elements.component.scss;h=13a4b0074f75f9273aeb486e1aeca343b472af07;hb=2711491ce1903adafb6a7768569a46ef68bfcd10;hp=a4ca0f45daba6b9844231008cbce5680a8e07521;hpb=610d0be13b3d01f653ef269271dd667a57c85ef2;p=github%2FChocobozzz%2FPeerTube.git

diff --git a/client/src/app/+my-account/my-account-video-playlists/my-account-video-playlist-elements.component.scss b/client/src/app/+my-account/my-account-video-playlists/my-account-video-playlist-elements.component.scss
index a4ca0f45d..13a4b0074 100644
--- a/client/src/app/+my-account/my-account-video-playlists/my-account-video-playlist-elements.component.scss
+++ b/client/src/app/+my-account/my-account-video-playlists/my-account-video-playlist-elements.component.scss
@@ -3,18 +3,34 @@
 @import '_miniature';
 
 .playlist-info {
-  background-color: var(--submenuColor);
-  margin-left: -15px;
+  background-color: pvar(--submenuColor);
+  margin-left: -$not-expanded-horizontal-margins;
   margin-top: -$sub-menu-margin-bottom;
 
-  padding: $sub-menu-margin-bottom 0 -15px 0;
+  padding: 10px;
 
   display: flex;
-  justify-content: center;
+  flex-direction: column;
+  justify-content: flex-start;
+  align-items: center;
 
   /* fix ellipsis dots background color */
   ::ng-deep .miniature-name::after {
-    background-color: var(--submenuColor) !important;
+    background-color: pvar(--submenuColor) !important;
+  }
+}
+
+.playlist-buttons {
+  display:flex;
+  margin: 30px 0 10px 0;
+
+  .share-button {
+    @include peertube-button;
+    @include button-with-icon(17px, 3px, -1px);
+    @include grey-button;
+    @include apply-svg-color(pvar(--actionButtonColor));
+
+    margin-right: 10px;
   }
 }
 
@@ -45,6 +61,8 @@
 
 @media screen and (max-width: $small-view) {
   .playlist-info {
-    margin-top: -$sub-menu-margin-bottom-small-view;
+    width: 100vw;
+    padding-top: 20px;
+    margin-left: calc(#{var(--expanded-horizontal-margin-content)} * -1);
   }
 }