]>
Commit | Line | Data |
---|---|---|
1 | @use '_variables' as *; | |
2 | @use '_mixins' as *; | |
3 | ||
4 | form { | |
5 | margin: 20px 20px 0 0; | |
6 | ||
7 | .form-group:first-child { | |
8 | // Keep place to display error message without modifying the height | |
9 | min-height: 125px; | |
10 | } | |
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; | |
23 | max-height: 50vh; | |
24 | } | |
25 | ||
26 | .no-messages { | |
27 | display: flex; | |
28 | justify-content: center; | |
29 | } | |
30 | ||
31 | .message-block { | |
32 | margin: 0 5px 10px 0; | |
33 | max-width: 60%; | |
34 | ||
35 | .author { | |
36 | color: var(--greyForegroundColor); | |
37 | font-size: 14px; | |
38 | padding: 0 0 3px 10px; | |
39 | } | |
40 | ||
41 | .bubble { | |
42 | border-radius: 10px; | |
43 | padding: 5px 10px; | |
44 | color: var(--mainForegroundColor); | |
45 | background-color: var(--greyBackgroundColor); | |
46 | ||
47 | .date { | |
48 | font-size: 13px; | |
49 | color: var(--greyForegroundColor); | |
50 | } | |
51 | } | |
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 | } | |
68 | } |