X-Git-Url: https://git.immae.eu/?a=blobdiff_plain;f=client%2Fsrc%2Fsass%2Finclude%2F_miniature.scss;h=070aa339868d397915d8fb95e9eb202b45f887b9;hb=c27463a603186b623500b03c6a56b330a6568350;hp=3b86f29b4fcc59657624e2e77e4f20c7eac5be94;hpb=dc48fdbe68e9dd3a3a6028181e61d8595d98e654;p=github%2FChocobozzz%2FPeerTube.git diff --git a/client/src/sass/include/_miniature.scss b/client/src/sass/include/_miniature.scss index 3b86f29b4..070aa3398 100644 --- a/client/src/sass/include/_miniature.scss +++ b/client/src/sass/include/_miniature.scss @@ -3,9 +3,8 @@ @mixin miniature-name { @include ellipsis-multiline(1.1em, 2); + @include peertube-word-wrap(false); - word-break: break-all; - word-wrap: break-word; transition: color 0.2s; font-weight: $font-semibold; color: pvar(--mainForegroundColor); @@ -21,12 +20,12 @@ } @mixin miniature-thumbnail { - @include disable-outline; - $play-overlay-transition: 0.2s ease; $play-overlay-height: 26px; $play-overlay-width: 18px; + @include disable-outline; + display: flex; flex-direction: column; position: relative; @@ -47,7 +46,8 @@ opacity: 0; background-color: rgba(0, 0, 0, 0.3); - &, .icon { + &, + .icon { transition: all $play-overlay-transition; } @@ -79,7 +79,7 @@ &.blur-filter { filter: blur(20px); - transform : scale(1.03); + transform: scale(1.03); } } } @@ -129,10 +129,7 @@ column-gap: 30px; grid-template-columns: repeat( auto-fill, - minmax( - var(--miniatureMinWidth), - 1fr - ) + minmax(var(--miniatureMinWidth), 1fr) ); .video-wrapper,