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 4c481d486..c90f9849b 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 @@ -46,14 +46,7 @@ } .comment-html { - word-break: normal; - word-wrap: break-word; - overflow-wrap: break-word; - -webkit-hyphens: auto; - -ms-hyphens: auto; - -moz-hyphens: auto; - hyphens: auto; - text-align: justify; + @include peertube-word-wrap; /deep/ a { @include disable-default-a-behaviour; 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 b9596cbee..1b44f0d6a 100644 --- a/client/src/app/videos/+video-watch/video-watch.component.scss +++ b/client/src/app/videos/+video-watch/video-watch.component.scss @@ -215,14 +215,7 @@ font-size: 15px; .video-info-description-html { - word-break: normal; - word-wrap: break-word; - overflow-wrap: break-word; - -webkit-hyphens: auto; - -ms-hyphens: auto; - -moz-hyphens: auto; - hyphens: auto; - text-align: justify; + @include peertube-word-wrap; } .description-loading { diff --git a/client/src/sass/include/_mixins.scss b/client/src/sass/include/_mixins.scss index f905f9ae5..7e7a38bbd 100644 --- a/client/src/sass/include/_mixins.scss +++ b/client/src/sass/include/_mixins.scss @@ -16,6 +16,17 @@ } } +@mixin peertube-word-wrap { + word-break: normal; + word-wrap: break-word; + overflow-wrap: break-word; + -webkit-hyphens: auto; + -ms-hyphens: auto; + -moz-hyphens: auto; + hyphens: auto; + text-align: justify; +} + @mixin peertube-input-text($width) { display: inline-block; height: $button-height;