client/src/app/videos/+video-watch/comment/video-comment.component.scss

   1 @import '_variables';
   2 @import '_mixins';
   3
   4 .root-comment {
   5   font-size: 15px;
   6   display: flex;
   7
   8   img {
   9     @include avatar(36px);
  10
  11     margin-top: 5px;
  12     margin-right: 20px;
  13   }
  14
  15   .comment {
  16     flex-grow: 1;
  17
  18     .highlighted-comment {
  19       display: inline-block;
  20       background-color: #F5F5F5;
  21       color: #3d3d3d;
  22       padding: 0 5px;
  23       font-size: 13px;
  24       margin-bottom: 5px;
  25       font-weight: $font-semibold;
  26       border-radius: 3px;
  27     }
  28
  29     .comment-account-date {
  30       display: flex;
  31       margin-bottom: 4px;
  32
  33       .comment-account {
  34         @include disable-default-a-behaviour;
  35
  36         color: #000;
  37         font-weight: $font-bold;
  38       }
  39
  40       .comment-date {
  41         color: #585858;
  42         margin-left: 10px;
  43       }
  44     }
  45
  46     .comment-html {
  47       word-wrap: initial;
  48       word-break: normal;
  49           text-align: justify;
  50
  51       /deep/ a {
  52         @include disable-default-a-behaviour;
  53
  54         color: #000;
  55
  56         // Semi bold mentions
  57         &:not(.linkified-url) {
  58           font-weight: $font-semibold;
  59         }
  60       }
  61     }
  62
  63     .comment-actions {
  64       margin: 10px 0;
  65       display: flex;
  66
  67       .comment-action-reply, .comment-action-delete {
  68         color: #585858;
  69         cursor: pointer;
  70         margin-right: 10px;
  71
  72         &:hover {
  73           color: #000;
  74         }
  75       }
  76     }
  77   }
  78 }