10 flex-direction: column;
17 background-color: rgba(0, 0, 0, 0.05);
18 margin: 10px calc(1rem + 1px);
27 @include avatar(36px);
32 // Fix word-wrap with flex
35 .highlighted-comment {
36 display: inline-block;
37 background-color: #F5F5F5;
42 font-weight: $font-semibold;
46 .comment-account-date {
52 background-color: #888888;
56 box-sizing: border-box;
62 color: white !important;
66 word-break: break-all;
71 @include disable-default-a-behaviour;
73 color: pvar(--mainForegroundColor);
76 text-decoration: underline;
80 .comment-account-fid {
87 color: pvar(--greyForegroundColor);
89 text-decoration: none;
92 text-decoration: underline;
98 @include peertube-word-wrap;
103 &:not(.linkified-url) {
104 @include disable-default-a-behaviour;
106 color: pvar(--mainForegroundColor);
108 font-weight: $font-semibold;
115 margin-bottom: .3rem;
118 &.comment-html-deleted {
119 color: pvar(--greyForegroundColor);
128 ::ng-deep .dropdown-toggle,
129 .comment-action-reply {
130 color: pvar(--greyForegroundColor);
134 &:hover, &:active, &:focus, &:focus-visible {
135 color: pvar(--mainForegroundColor);
139 ::ng-deep .action-button {
140 background-color: transparent;
146 my-video-comment-add {
155 // Reduce avatars size for replies
157 @include avatar(25px);
166 @media screen and (max-width: 1200px) {
172 @media screen and (max-width: 600px) {
178 align-items: flex-start;
187 .comment-account-date {
188 flex-direction: column;