X-Git-Url: https://git.immae.eu/?a=blobdiff_plain;f=client%2Fsrc%2Fapp%2Fshared%2Fvideo%2Fvideo-miniature.component.scss;h=4799e00c240dcf9ed46064f89b4cc1e92c8340e2;hb=11dd0c2e4202e7ad68d8b7e6706de846401d29ff;hp=f44bdf9a93c3aa04da27efab85f462bc5aa73add;hpb=28f3d1b36a70426795240c9370e47b6c4ba847f8;p=github%2FChocobozzz%2FPeerTube.git diff --git a/client/src/app/shared/video/video-miniature.component.scss b/client/src/app/shared/video/video-miniature.component.scss index f44bdf9a9..4799e00c2 100644 --- a/client/src/app/shared/video/video-miniature.component.scss +++ b/client/src/app/shared/video/video-miniature.component.scss @@ -1,11 +1,13 @@ @import '_variables'; @import '_mixins'; +@import '_miniature'; .video-miniature { + width: $video-miniature-width; + display: inline-block; - padding-right: 15px; margin-bottom: 30px; - height: 175px; + height: 195px; vertical-align: top; .video-miniature-information { @@ -14,26 +16,7 @@ line-height: normal; .video-miniature-name { - @include ellipsis-multiline( - $font-size: 1rem, - $line-height: 1, - $lines-to-show: 2 - ); - transition: color 0.2s; - font-size: 16px; - font-weight: $font-semibold; - color: var(--mainForegroundColor); - margin-top: 5px; - margin-bottom: 5px; - - &:hover { - text-decoration: none; - } - - &.blur-filter { - filter: blur(3px); - padding-left: 4px; - } + @include miniature-name; } .video-miniature-created-at-views { @@ -44,11 +27,9 @@ .video-miniature-account, .video-miniature-channel { @include disable-default-a-behaviour; + @include ellipsis; display: block; - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; font-size: 13px; color: $grey-foreground-color;