X-Git-Url: https://git.immae.eu/?a=blobdiff_plain;f=client%2Fsrc%2Fapp%2F%2Baccounts%2Faccount-video-channels%2Faccount-video-channels.component.scss;h=30b8098be8eaa61e3a1ab2b54741d3bb2e83940b;hb=eaa529528cafcfb291009f9f99d296c81e792899;hp=f9d09764462354ec5bdcf734f8fe766083b2b62b;hpb=c7027c06e9a73dad99d3f9bd9937a41a763850ce;p=github%2FChocobozzz%2FPeerTube.git diff --git a/client/src/app/+accounts/account-video-channels/account-video-channels.component.scss b/client/src/app/+accounts/account-video-channels/account-video-channels.component.scss index f9d097644..30b8098be 100644 --- a/client/src/app/+accounts/account-video-channels/account-video-channels.component.scss +++ b/client/src/app/+accounts/account-video-channels/account-video-channels.component.scss @@ -1,6 +1,7 @@ -@import '_variables'; -@import '_mixins'; -@import '_miniature'; +@use 'sass:math'; +@use '_variables' as *; +@use '_mixins' as *; +@use '_miniature' as *; .margin-content { @include grid-videos-miniature-margins; @@ -28,14 +29,15 @@ grid-template-rows: auto 1fr; my-actor-avatar { - @include actor-avatar-size(75px); + @include margin-right(15px); grid-column: 1; grid-row: 1 / 3; - margin-right: 15px; } a { + @include peertube-word-wrap; + color: pvar(--mainForegroundColor); } @@ -49,19 +51,11 @@ } .actor-counters { + @include margin-left(15px); + @include actor-counters; + grid-row: 1; grid-column: 3; - color: pvar(--greyForegroundColor); - font-size: 16px; - display: flex; - align-items: center; - margin-left: 15px; - } - - .actor-counters > *:not(:last-child)::after { - content: '•'; - margin: 0 10px; - color: pvar(--mainColor); } .description-html { @@ -90,7 +84,8 @@ my-subscribe-button { overflow: hidden; my-video-miniature { - margin-right: 15px; + @include margin-right(15px); + min-width: $video-thumbnail-medium-width; max-width: $video-thumbnail-medium-width; } @@ -105,7 +100,7 @@ my-subscribe-button { position: absolute; right: 0; background: linear-gradient(90deg, transparent 0, pvar(--channelBackgroundColor) 45px); - padding: ($video-thumbnail-medium-height / 2 - 10px) 15px 0 60px; + padding: (math.div($video-thumbnail-medium-height, 2) - 10px) 15px 0 60px; z-index: z(miniature) + 1; a {