Merge branch 'release/4.2.0' into develop

[github/Chocobozzz/PeerTube.git] / client / src / app / +my-library / +my-video-channels / my-video-channels.component.scss

diff --git a/client/src/app/+my-library/+my-video-channels/my-video-channels.component.scss b/client/src/app/+my-library/+my-video-channels/my-video-channels.component.scss
index 191c5169d998cb76c7e42da15e79287bb0670380..ab80f3d012204604b9916038859728b30a346015 100644 (file)
--- a/client/src/app/+my-library/+my-video-channels/my-video-channels.component.scss
+++ b/client/src/app/+my-library/+my-video-channels/my-video-channels.component.scss
@@ -1,5 +1,5 @@
-@import '_variables';
-@import '_mixins';
+@use '_variables' as *;
+@use '_mixins' as *;
 
 h1 my-global-icon {
   position: relative;
@@ -15,7 +15,7 @@ input[type=text] {
 }
 
 my-edit-button {
-  margin-right: 10px;
+  @include margin-right(10px);
 }
 
 .video-channel {
@@ -24,9 +24,7 @@ my-edit-button {
   padding-bottom: 0;
 
   my-actor-avatar {
-    @include actor-avatar-size(80px);
-
-    margin-right: 10px;
+    @include margin-right(10px);
   }
 }
 
@@ -49,9 +47,14 @@ my-edit-button {
 }
 
 .video-channel-name {
+  @include margin-left(5px);
+
   font-size: 14px;
   color: $grey-actor-name;
-  margin-left: 5px;
+}
+
+.video-channel-followers {
+  color: pvar(--mainForegroundColor);
 }
 
 .video-channel-buttons {
@@ -59,9 +62,10 @@ my-edit-button {
   min-width: 190px;
 }
 
-::ng-deep .chartjs-render-monitor {
-  position: relative;
-  top: 1px;
+.chart-container {
+  // Sync these values with the template
+  width: 40vw;
+  height: 100px;
 }
 
 .video-channels-header {
@@ -77,7 +81,7 @@ my-edit-button {
     padding-bottom: 10px;
 
     img {
-      margin-right: 0;
+      @include margin-right(0);
     }
 
     .video-channel-buttons {
@@ -97,7 +101,7 @@ my-edit-button {
   }
 
   .video-channel-name {
-    margin-left: 0 !important;
+    @include margin-left(0 !important);
   }
 }