10 flex-direction: column;
17 background-color: rgba(0, 0, 0, 0.05);
18 margin: 10px calc(1rem + 1px);
29 // Fix word-wrap with flex
33 .highlighted-comment {
34 display: inline-block;
35 background-color: #F5F5F5;
40 font-weight: $font-semibold;
44 .comment-account-date {
51 background-color: #888888;
55 box-sizing: border-box;
61 color: white !important;
65 word-break: break-all;
70 @include disable-default-a-behaviour;
72 color: pvar(--mainForegroundColor);
75 text-decoration: underline;
79 .comment-account-fid {
86 color: pvar(--greyForegroundColor);
88 text-decoration: none;
91 text-decoration: underline;
96 @include peertube-word-wrap;
101 &:not(.linkified-url) {
102 @include disable-default-a-behaviour;
104 color: pvar(--mainForegroundColor);
106 font-weight: $font-semibold;
113 margin-bottom: .3rem;
116 &.comment-html-deleted {
117 color: pvar(--greyForegroundColor);
126 ::ng-deep .dropdown-toggle,
127 .comment-action-reply {
128 color: pvar(--greyForegroundColor);
132 &:hover, &:active, &:focus, &:focus-visible {
133 color: pvar(--mainForegroundColor);
137 ::ng-deep .action-button {
138 background-color: transparent;
144 my-video-comment-add {
152 // Reduce avatars size for replies
154 @include avatar(25px);
162 @media screen and (max-width: 1200px) {
168 @media screen and (max-width: 600px) {
173 align-items: flex-start;
181 .comment-account-date {
182 flex-direction: column;