]>
Commit | Line | Data |
---|---|---|
501bc6c2 | 1 | .video-miniature { |
a01f107b | 2 | margin: 15px 10px; |
501bc6c2 | 3 | display: inline-block; |
501bc6c2 | 4 | position: relative; |
e54163c2 | 5 | height: 190px; |
0d7d2ad9 | 6 | vertical-align: top; |
501bc6c2 C |
7 | |
8 | .video-miniature-thumbnail { | |
af14488f | 9 | display: inline-block; |
501bc6c2 | 10 | position: relative; |
d6e32a2e C |
11 | border-radius: 3px; |
12 | overflow: hidden; | |
501bc6c2 | 13 | |
92fb909c C |
14 | &:hover { |
15 | text-decoration: none !important; | |
16 | } | |
17 | ||
d6e32a2e C |
18 | img.blur-filter { |
19 | filter: blur(5px); | |
20 | transform : scale(1.03); | |
383bfc83 C |
21 | } |
22 | ||
23 | .video-miniature-thumbnail-overlay { | |
501bc6c2 | 24 | position: absolute; |
383bfc83 C |
25 | right: 0px; |
26 | bottom: 0px; | |
501bc6c2 | 27 | display: inline-block; |
383bfc83 C |
28 | background-color: rgba(0, 0, 0, 0.7); |
29 | color: #fff; | |
30 | padding: 3px 5px; | |
501bc6c2 | 31 | font-size: 11px; |
383bfc83 C |
32 | font-weight: bold; |
33 | width: 100%; | |
34 | ||
35 | .video-miniature-thumbnail-overlay-views { | |
36 | ||
37 | } | |
38 | ||
39 | .video-miniature-thumbnail-overlay-duration { | |
40 | float: right; | |
41 | } | |
501bc6c2 C |
42 | } |
43 | } | |
44 | ||
d6e32a2e | 45 | .video-miniature-information { |
00a44645 | 46 | width: 200px; |
501bc6c2 | 47 | |
383bfc83 C |
48 | .video-miniature-name { |
49 | height: 23px; | |
501bc6c2 | 50 | display: block; |
383bfc83 C |
51 | overflow: hidden; |
52 | text-overflow: ellipsis; | |
53 | white-space: nowrap; | |
54 | font-weight: bold; | |
55 | transition: color 0.2s; | |
56 | font-size: 15px; | |
501bc6c2 | 57 | |
383bfc83 C |
58 | &:hover { |
59 | text-decoration: none; | |
00a44645 C |
60 | } |
61 | ||
d6e32a2e C |
62 | &.blur-filter { |
63 | filter: blur(3px); | |
64 | padding-left: 4px; | |
65 | } | |
66 | ||
0629423c | 67 | .video-miniature-tags { |
1f0215a9 | 68 | // Fix for chrome when tags are long |
0629423c | 69 | width: 201px; |
00a44645 | 70 | |
0629423c C |
71 | .video-miniature-tag { |
72 | font-size: 13px; | |
73 | cursor: pointer; | |
74 | position: relative; | |
75 | top: -2px; | |
76 | ||
77 | .label { | |
0629423c C |
78 | transition: background-color 0.2s; |
79 | } | |
00a44645 | 80 | } |
501bc6c2 C |
81 | } |
82 | } | |
83 | ||
897ec54d | 84 | .video-miniature-author, .video-miniature-created-at { |
501bc6c2 C |
85 | display: block; |
86 | margin-left: 1px; | |
383bfc83 C |
87 | font-size: 11px; |
88 | color: $video-miniature-other-infos; | |
0629423c | 89 | opacity: 0.9; |
00a44645 C |
90 | } |
91 | ||
92 | .video-miniature-author { | |
0629423c | 93 | transition: color 0.2s; |
00a44645 C |
94 | |
95 | &:hover { | |
0629423c | 96 | color: #23527c; |
00a44645 | 97 | text-decoration: none; |
00a44645 | 98 | } |
501bc6c2 C |
99 | } |
100 | } | |
101 | } |