]>
Commit | Line | Data |
---|---|---|
441e453a C |
1 | @import 'variables'; |
2 | @import 'mixins'; | |
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; | |
94148c90 C |
23 | } |
24 | ||
25 | .no-messages { | |
26 | display: flex; | |
27 | font-size: 15px; | |
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 C |
46 | |
47 | .content { | |
48 | font-size: 15px; | |
49 | } | |
50 | ||
51 | .date { | |
52 | font-size: 13px; | |
53 | color: var(--greyForegroundColor); | |
54 | } | |
55 | } | |
94148c90 C |
56 | |
57 | &.by-me { | |
58 | ||
59 | .bubble { | |
60 | color: var(--mainBackgroundColor); | |
61 | background-color: var(--mainColorLighter); | |
62 | ||
63 | .date { | |
64 | color: var(--mainBackgroundColor); | |
65 | } | |
66 | } | |
67 | } | |
68 | ||
69 | &.by-moderator { | |
70 | align-self: flex-end; | |
71 | } | |
441e453a | 72 | } |