X-Git-Url: https://git.immae.eu/?a=blobdiff_plain;f=client%2Fsrc%2Fapp%2F%2Bvideo-channels%2Fvideo-channels.component.scss;h=e946707efa1aba97f418d7db01d7e49bf2c5f005;hb=f6500729850549e632399155d0f3b69822e28b16;hp=fb71844bdfeef5a45c42c3cd6a9650a2c03acf42;hpb=900f7820814b95b07ef0bcac04036a95abfbe060;p=github%2FChocobozzz%2FPeerTube.git

diff --git a/client/src/app/+video-channels/video-channels.component.scss b/client/src/app/+video-channels/video-channels.component.scss
index fb71844bd..e946707ef 100644
--- a/client/src/app/+video-channels/video-channels.component.scss
+++ b/client/src/app/+video-channels/video-channels.component.scss
@@ -11,16 +11,30 @@
   --myGreyOwnerFontSize: 14px;
 }
 
+.banner {
+  @include block-ratio('img', $banner-inverted-ratio);
+}
+
 .section-label {
   @include section-label-responsive;
 }
 
 .links {
-  @include fluid-videos-miniature-margins;
+  @include grid-videos-miniature-margins;
+}
+
+.actor-info {
+  min-width: 1px;
+  width: 100%;
+
+  > h4,
+  > .actor-handle {
+    @include ellipsis;
+  }
 }
 
 .channel-info {
-  @include fluid-videos-miniature-margins(false, 15px);
+  @include grid-videos-miniature-margins(false, 15px);
 
   display: grid;
   grid-template-columns: 1fr auto;
@@ -36,8 +50,14 @@
   @include avatar-row-responsive(var(--myChannelImgMargin), var(--myGreyChannelFontSize));
 }
 
+.support-button {
+  @include button-with-icon(21px, 0, -1px);
+}
+
 .channel-description {
   grid-column: 1;
+  word-break: break-word;
+  padding-bottom: var(--myGlobalTopPadding);
 }
 
 .show-more {
@@ -64,12 +84,6 @@
   display: none;
 }
 
-.created-at {
-  margin-top: 15px;
-  color: pvar(--greyForegroundColor);
-  padding-bottom: 60px;
-}
-
 .owner-card {
   margin-left: 105px;
   grid-column: 2;
@@ -104,6 +118,10 @@
     h4 {
       font-size: 18px;
       margin: 0;
+
+      a {
+        color: pvar(--mainForegroundColor);
+      }
     }
 
     .actor-handle {
@@ -113,7 +131,8 @@
   }
 
   .owner-description {
-    height: 140px;
+    max-height: 140px;
+    word-break: break-word;
 
     @include fade-text(120px, pvar(--mainBackgroundColor));
   }
@@ -213,7 +232,8 @@
   }
 
   .view-account.complete {
-    display: inline-block;
+    display: block;
+    text-align: right;
     margin-top: 10px;
     color: pvar(--mainColor);
   }