aboutsummaryrefslogtreecommitdiffhomepage
path: root/client/src/sass/include
diff options
context:
space:
mode:
authorRigel Kent <sendmemail@rigelk.eu>2018-09-02 23:36:22 +0200
committerChocobozzz <me@florianbigard.com>2018-09-03 08:49:29 +0200
commit769ac6c11fe3e8d79643032daa784a60116a6630 (patch)
treeb3bafeda3d15b65156cc92987c5a5c819011cbae /client/src/sass/include
parent8542dc33e32ca28d542eaa9a25db7c20eccfd6f6 (diff)
downloadPeerTube-769ac6c11fe3e8d79643032daa784a60116a6630.tar.gz
PeerTube-769ac6c11fe3e8d79643032daa784a60116a6630.tar.zst
PeerTube-769ac6c11fe3e8d79643032daa784a60116a6630.zip
add title ellipsis over two lines to miniatures
Diffstat (limited to 'client/src/sass/include')
-rw-r--r--client/src/sass/include/_mixins.scss27
-rw-r--r--client/src/sass/include/_variables.scss2
2 files changed, 29 insertions, 0 deletions
diff --git a/client/src/sass/include/_mixins.scss b/client/src/sass/include/_mixins.scss
index aafe478f9..99225e4e5 100644
--- a/client/src/sass/include/_mixins.scss
+++ b/client/src/sass/include/_mixins.scss
@@ -16,6 +16,33 @@
16 } 16 }
17} 17}
18 18
19/**
20 * This mixin will crop text in block for needed amount of lines and put ellipsis at the end
21 *
22 * @param $font-size font-size property
23 * @param $line-height line-height property
24 * @param $lines-to-show amount of lines to show
25 */
26 @mixin ellipsis-multiline($font-size: 1rem, $line-height: 1, $lines-to-show: 2) {
27 display: block;
28 /* Fallback for non-webkit */
29 display: -webkit-box;
30 max-height: $font-size*$line-height*$lines-to-show;
31 /* Fallback for non-webkit */
32 font-size: $font-size;
33 line-height: $line-height;
34 -webkit-line-clamp: $lines-to-show;
35 -webkit-box-orient: vertical;
36 overflow: hidden;
37 text-overflow: ellipsis;
38}
39
40@mixin prefix($property, $parameters...) {
41 @each $prefix in -webkit-, -moz-, -ms-, -o-, "" {
42 #{$prefix}#{$property}: $parameters;
43 }
44}
45
19@mixin peertube-word-wrap { 46@mixin peertube-word-wrap {
20 word-break: normal; 47 word-break: normal;
21 word-wrap: break-word; 48 word-wrap: break-word;
diff --git a/client/src/sass/include/_variables.scss b/client/src/sass/include/_variables.scss
index ba7abeef1..7fd178c3b 100644
--- a/client/src/sass/include/_variables.scss
+++ b/client/src/sass/include/_variables.scss
@@ -10,6 +10,8 @@ $orange-hoover-color: #F97D46;
10 10
11$black-background: #000; 11$black-background: #000;
12$grey-background: #f6f2f2; 12$grey-background: #f6f2f2;
13$bg-color: #fff;
14$fg-color: #000;
13 15
14$red: #FF0000; 16$red: #FF0000;
15$green: #39CC0B; 17$green: #39CC0B;