From 769ac6c11fe3e8d79643032daa784a60116a6630 Mon Sep 17 00:00:00 2001 From: Rigel Kent Date: Sun, 2 Sep 2018 23:36:22 +0200 Subject: add title ellipsis over two lines to miniatures --- client/src/app/app.component.scss | 2 +- client/src/app/shared/video/video-miniature.component.scss | 13 ++++++++----- 2 files changed, 9 insertions(+), 6 deletions(-) (limited to 'client/src/app') diff --git a/client/src/app/app.component.scss b/client/src/app/app.component.scss index ded45b5f7..e772e3a37 100644 --- a/client/src/app/app.component.scss +++ b/client/src/app/app.component.scss @@ -14,7 +14,7 @@ position: fixed; top: 0; width: 100%; - background-color: #fff; + background-color: $bg-color; z-index: 1000; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.16); display: flex; diff --git a/client/src/app/shared/video/video-miniature.component.scss b/client/src/app/shared/video/video-miniature.component.scss index 6883650f4..cc643f9d9 100644 --- a/client/src/app/shared/video/video-miniature.component.scss +++ b/client/src/app/shared/video/video-miniature.component.scss @@ -14,14 +14,17 @@ line-height: normal; .video-miniature-name { - display: block; - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; + @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: #000; + color: $fg-color; + margin-top: 5px; + margin-bottom: 5px; &:hover { text-decoration: none; -- cgit v1.2.3