Don't break design on long description/comment

[github/Chocobozzz/PeerTube.git] / client / src / app / videos / +video-watch / comment / video-comment.component.scss

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 aae03ab6de1538b68f9210011760efacc74ae7de..d948c967055eb566e9ae17f1c8f10dec699186b4 100644 (file)
--- a/client/src/app/videos/+video-watch/comment/video-comment.component.scss
+++ b/client/src/app/videos/+video-watch/comment/video-comment.component.scss
@@ -15,11 +15,25 @@
   .comment {
     flex-grow: 1;
 
+    .highlighted-comment {
+      display: inline-block;
+      background-color: #F5F5F5;
+      color: #3d3d3d;
+      padding: 0 5px;
+      font-size: 13px;
+      margin-bottom: 5px;
+      font-weight: $font-semibold;
+      border-radius: 3px;
+    }
+
     .comment-account-date {
       display: flex;
       margin-bottom: 4px;
 
       .comment-account {
+        @include disable-default-a-behaviour;
+
+        color: #000;
         font-weight: $font-bold;
       }
 
@@ -29,12 +43,28 @@
       }
     }
 
+    .comment-html {
+      word-break: break-all;
+
+      a {
+        @include disable-default-a-behaviour;
+
+        color: #000;
+      }
+    }
+
     .comment-actions {
       margin: 10px 0;
+      display: flex;
 
-      .comment-action-reply {
+      .comment-action-reply, .comment-action-delete {
         color: #585858;
         cursor: pointer;
+        margin-right: 10px;
+
+        &:hover {
+          color: #000;
+        }
       }
     }
   }