From 80109b2ddb14ec4a54cede7885611cb9244da3cb Mon Sep 17 00:00:00 2001 From: Chocobozzz Date: Wed, 18 Apr 2018 10:20:13 +0200 Subject: Handle when autoplay fails --- client/src/app/videos/+video-watch/video-watch.component.scss | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'client/src/app/videos') 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 3ebeccd4b..8bc9f8d9a 100644 --- a/client/src/app/videos/+video-watch/video-watch.component.scss +++ b/client/src/app/videos/+video-watch/video-watch.component.scss @@ -332,7 +332,7 @@ .video-actions-rates { margin-top: 20px; - align-items: left; + align-items: start; .video-info-likes-dislikes-bar { margin-top: 10px; -- cgit v1.2.3 From c9ffd53217e69395c303ba36532a6eef39645e4e Mon Sep 17 00:00:00 2001 From: Chocobozzz Date: Wed, 18 Apr 2018 15:00:42 +0200 Subject: Better responsive design on many comment children --- .../comment/video-comment.component.scss | 27 +++++++++++++++++++++- .../comment/video-comments.component.scss | 10 ++++---- .../videos/+video-watch/video-watch.component.scss | 3 ++- 3 files changed, 33 insertions(+), 7 deletions(-) (limited to 'client/src/app/videos') diff --git a/client/src/app/videos/+video-watch/comment/video-comment.component.scss b/client/src/app/videos/+video-watch/comment/video-comment.component.scss index 3b0b7eafd..3a3f32b83 100644 --- a/client/src/app/videos/+video-watch/comment/video-comment.component.scss +++ b/client/src/app/videos/+video-watch/comment/video-comment.component.scss @@ -14,6 +14,8 @@ .comment { flex-grow: 1; + // Fix word-wrap with flex + min-width: 1px; .highlighted-comment { display: inline-block; @@ -44,8 +46,8 @@ } .comment-html { - word-wrap: initial; word-break: normal; + word-wrap: break-word; text-align: justify; /deep/ a { @@ -76,3 +78,26 @@ } } } + +// Decrease the space of child comments on small screens +@media screen and (max-width: 1600px) { + .children { + margin-left: -20px; + } +} + +@media screen and (max-width: 1200px) { + .children { + margin-left: -30px; + } +} + +@media screen and (max-width: 600px) { + .children { + margin-left: -40px; + } + + .root-comment { + img { margin-right: 10px; } + } +} \ No newline at end of file diff --git a/client/src/app/videos/+video-watch/comment/video-comments.component.scss b/client/src/app/videos/+video-watch/comment/video-comments.component.scss index 7aadc2866..0b8aa1854 100644 --- a/client/src/app/videos/+video-watch/comment/video-comments.component.scss +++ b/client/src/app/videos/+video-watch/comment/video-comments.component.scss @@ -19,8 +19,8 @@ font-size: 13px; } -.comment-html { - word-wrap: normal; - word-break: normal; - text-align: justify; -} +@media screen and (max-width: 600px) { + .view-replies { + margin-left: 46px; + } +} \ No newline at end of file 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 8bc9f8d9a..fe3cc4ded 100644 --- a/client/src/app/videos/+video-watch/video-watch.component.scss +++ b/client/src/app/videos/+video-watch/video-watch.component.scss @@ -215,7 +215,8 @@ font-size: 15px; .video-info-description-html { - word-wrap: break-word; + word-break: normal; + word-wrap: normal; text-align: justify; } -- cgit v1.2.3