]>
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; | |
94148c90 | 28 | justify-content: center; |
441e453a C |
29 | } |
30 | ||
31 | .message-block { | |
94148c90 | 32 | margin: 0 5px 10px 0; |
441e453a C |
33 | max-width: 60%; |
34 | ||
35 | .author { | |
36 | color: var(--greyForegroundColor); | |
37 | font-size: 14px; | |
94148c90 | 38 | padding: 0 0 3px 10px; |
441e453a C |
39 | } |
40 | ||
41 | .bubble { | |
441e453a C |
42 | border-radius: 10px; |
43 | padding: 5px 10px; | |
94148c90 C |
44 | color: var(--mainForegroundColor); |
45 | background-color: var(--greyBackgroundColor); | |
441e453a | 46 | |
441e453a C |
47 | .date { |
48 | font-size: 13px; | |
49 | color: var(--greyForegroundColor); | |
50 | } | |
51 | } | |
94148c90 C |
52 | |
53 | &.by-me { | |
54 | ||
55 | .bubble { | |
56 | color: var(--mainBackgroundColor); | |
57 | background-color: var(--mainColorLighter); | |
58 | ||
59 | .date { | |
60 | color: var(--mainBackgroundColor); | |
61 | } | |
62 | } | |
63 | } | |
64 | ||
65 | &.by-moderator { | |
66 | align-self: flex-end; | |
67 | } | |
441e453a | 68 | } |