]>
Commit | Line | Data |
---|---|---|
8cbc40b2 C |
1 | @use '_variables' as *; |
2 | @use '_mixins' as *; | |
441e453a C |
3 | |
4 | form { | |
5 | margin: 20px 20px 0 0; | |
94148c90 C |
6 | |
7 | .form-group:first-child { | |
8 | // Keep place to display error message without modifying the height | |
9 | min-height: 125px; | |
10 | } | |
441e453a C |
11 | } |
12 | ||
13 | textarea { | |
14 | @include peertube-textarea(100%, 70px); | |
15 | ||
16 | margin-top: 20px; | |
17 | } | |
18 | ||
19 | .messages { | |
20 | display: flex; | |
21 | flex-direction: column; | |
22 | overflow-y: scroll; | |
d573926e | 23 | max-height: 50vh; |
94148c90 C |
24 | } |
25 | ||
26 | .no-messages { | |
27 | display: flex; | |
28 | font-size: 15px; | |
29 | justify-content: center; | |
441e453a C |
30 | } |
31 | ||
32 | .message-block { | |
94148c90 | 33 | margin: 0 5px 10px 0; |
441e453a C |
34 | max-width: 60%; |
35 | ||
36 | .author { | |
37 | color: var(--greyForegroundColor); | |
38 | font-size: 14px; | |
94148c90 | 39 | padding: 0 0 3px 10px; |
441e453a C |
40 | } |
41 | ||
42 | .bubble { | |
441e453a C |
43 | border-radius: 10px; |
44 | padding: 5px 10px; | |
94148c90 C |
45 | color: var(--mainForegroundColor); |
46 | background-color: var(--greyBackgroundColor); | |
441e453a C |
47 | |
48 | .content { | |
49 | font-size: 15px; | |
50 | } | |
51 | ||
52 | .date { | |
53 | font-size: 13px; | |
54 | color: var(--greyForegroundColor); | |
55 | } | |
56 | } | |
94148c90 C |
57 | |
58 | &.by-me { | |
59 | ||
60 | .bubble { | |
61 | color: var(--mainBackgroundColor); | |
62 | background-color: var(--mainColorLighter); | |
63 | ||
64 | .date { | |
65 | color: var(--mainBackgroundColor); | |
66 | } | |
67 | } | |
68 | } | |
69 | ||
70 | &.by-moderator { | |
71 | align-self: flex-end; | |
72 | } | |
441e453a | 73 | } |