diff options
Diffstat (limited to 'client/src/app/videos/+video-watch/video-watch.component.scss')
-rw-r--r-- | client/src/app/videos/+video-watch/video-watch.component.scss | 23 |
1 files changed, 18 insertions, 5 deletions
diff --git a/client/src/app/videos/+video-watch/video-watch.component.scss b/client/src/app/videos/+video-watch/video-watch.component.scss index bc737ccd5..eb701e0ab 100644 --- a/client/src/app/videos/+video-watch/video-watch.component.scss +++ b/client/src/app/videos/+video-watch/video-watch.component.scss | |||
@@ -99,6 +99,7 @@ | |||
99 | font-weight: $font-semibold; | 99 | font-weight: $font-semibold; |
100 | display: inline-block; | 100 | display: inline-block; |
101 | padding: 0 10px 0 10px; | 101 | padding: 0 10px 0 10px; |
102 | white-space: nowrap; | ||
102 | 103 | ||
103 | .icon { | 104 | .icon { |
104 | @include icon(21px); | 105 | @include icon(21px); |
@@ -114,6 +115,10 @@ | |||
114 | background-image: url('../../../assets/images/video/dislike-grey.svg'); | 115 | background-image: url('../../../assets/images/video/dislike-grey.svg'); |
115 | } | 116 | } |
116 | 117 | ||
118 | &.icon-support { | ||
119 | background-image: url('../../../assets/images/video/heart.svg'); | ||
120 | } | ||
121 | |||
117 | &.icon-share { | 122 | &.icon-share { |
118 | background-image: url('../../../assets/images/video/share.svg'); | 123 | background-image: url('../../../assets/images/video/share.svg'); |
119 | } | 124 | } |
@@ -249,11 +254,7 @@ | |||
249 | } | 254 | } |
250 | 255 | ||
251 | 256 | ||
252 | @media screen and (max-width: 1300px) { | 257 | @media screen and (max-width: 1600px) { |
253 | .other-videos { | ||
254 | display: none; | ||
255 | } | ||
256 | |||
257 | .video-bottom { | 258 | .video-bottom { |
258 | .video-info { | 259 | .video-info { |
259 | margin-right: 0; | 260 | margin-right: 0; |
@@ -288,6 +289,12 @@ | |||
288 | } | 289 | } |
289 | } | 290 | } |
290 | 291 | ||
292 | @media screen and (max-width: 1200px) { | ||
293 | .other-videos { | ||
294 | display: none; | ||
295 | } | ||
296 | } | ||
297 | |||
291 | @media screen and (max-width: 600px) { | 298 | @media screen and (max-width: 600px) { |
292 | .video-bottom { | 299 | .video-bottom { |
293 | margin: 20px 0 0 0; | 300 | margin: 20px 0 0 0; |
@@ -304,3 +311,9 @@ | |||
304 | } | 311 | } |
305 | } | 312 | } |
306 | } | 313 | } |
314 | |||
315 | @media screen and (max-width: 450px) { | ||
316 | .video-bottom .action-button .icon-text { | ||
317 | display: none !important; | ||
318 | } | ||
319 | } | ||