Set default captcha type to none
[GitHub/WoltLab/WCF.git] / wcfsetup / install / files / style / ui / messageGroup.scss
CommitLineData
3321b9c6
MW
1.messageGroupList {
2 .tabularList {
e5359fe5
AE
3 .columnSubject {
4 flex: 1 1 auto;
5 }
8a52619a 6
e5359fe5 7 .columnStats {
e5359fe5 8 text-align: center;
66ba3e76 9
b844e0c0
MW
10 @include screen-lg {
11 flex: 0 0 150px;
12 }
13
14 @include screen-md-down {
15 flex: 0 0 100px;
16 }
e5359fe5 17 }
8a52619a 18
e5359fe5
AE
19 .columnLastPost {
20 flex: 0 0 200px;
3321b9c6 21 }
8a52619a 22
3321b9c6
MW
23 .tabularListRow:not(.tabularListRowHead) {
24 .columnStats {
25 position: relative;
8a52619a 26
3321b9c6
MW
27 > dl {
28 visibility: hidden;
29 }
30 }
8a52619a 31
d0f167f3
MW
32 @include screen-lg {
33 &:hover .columnStats {
34 > dl {
35 visibility: visible;
36 }
8a52619a 37
d0f167f3
MW
38 .messageGroupListStatsSimple {
39 display: none;
40 }
3321b9c6
MW
41 }
42 }
43 }
44 }
8a52619a 45
3321b9c6 46 .columnMark > label {
3321b9c6
MW
47 display: block;
48 height: 24px;
49 width: 24px;
8a52619a 50
2db06214
MW
51 input[type="checkbox"] {
52 height: 18px;
53 width: 18px;
3321b9c6
MW
54 }
55 }
8a52619a 56
3321b9c6
MW
57 .columnAvatar {
58 div {
59 position: relative;
60 width: 48px;
61 height: 48px;
3321b9c6 62 }
8a52619a 63
3321b9c6
MW
64 .myAvatar {
65 position: absolute;
66 width: 24px;
67 height: 24px;
68 bottom: -2px;
69 right: -6px;
8a52619a 70
3321b9c6 71 > img {
1a75e228 72 border: 1px solid var(--wcfContentBackground);
3321b9c6
MW
73 box-sizing: content-box;
74 }
75 }
76 }
8a52619a 77
3321b9c6
MW
78 .columnSubject {
79 overflow: hidden;
8a52619a 80
3321b9c6 81 > h3 {
3321b9c6 82 > .messageGroupLink {
5908f54f 83 @include wcfFontHeadline;
3321b9c6 84 }
8a52619a 85
3321b9c6
MW
86 > .badge.label {
87 top: -2px;
88 }
89 }
8a52619a 90
3321b9c6
MW
91 > small {
92 display: block;
93 }
8a52619a 94
3321b9c6
MW
95 > .statusDisplay {
96 display: flex;
97 float: right;
8a52619a
TD
98 opacity: 0.75;
99 transition: opacity 0.12s;
100
3321b9c6
MW
101 > .statusIcons {
102 align-items: center;
103 flex: 0 0 auto;
8a52619a 104
3321b9c6
MW
105 > li {
106 align-items: center;
107 display: flex;
108 }
d5a9f466
MW
109
110 a {
111 color: inherit;
112 }
50cbdea1
AE
113
114 .iconFlag {
115 vertical-align: -3px;
116 }
3321b9c6
MW
117 }
118 }
8a52619a 119
3321b9c6
MW
120 > .labelList {
121 float: right;
122 padding-left: 7px;
123 }
124 }
8a52619a 125
3321b9c6
MW
126 .columnLastPost {
127 > .box32 {
128 align-items: center;
129 }
8a52619a 130
3321b9c6 131 time {
1a75e228 132 color: var(--wcfContentDimmedText);
3321b9c6 133 }
8a52619a 134
3321b9c6
MW
135 a {
136 display: block;
137 overflow: hidden;
138 text-overflow: ellipsis;
139 white-space: nowrap;
140 }
141 }
8a52619a 142
3321b9c6
MW
143 // hover
144 .tabularListRow:hover,
8a52619a
TD
145 tr:hover {
146 // deprecated
3321b9c6
MW
147 .columnSubject > .statusDisplay {
148 opacity: 1;
8a52619a 149
3321b9c6
MW
150 > .pagination {
151 opacity: 1;
152 }
153 }
3321b9c6 154 }
8a52619a 155
3321b9c6 156 // new status
1b87c0bd 157 .tabularListColumns.new,
8a52619a
TD
158 tr.new {
159 // deprecated
3321b9c6 160 .columnSubject > h3 > .messageGroupLink {
c5222ca4 161 font-weight: 600;
3321b9c6 162 }
3321b9c6 163 }
8a52619a 164
3321b9c6
MW
165 .pagination {
166 flex: 0 0 auto;
167 opacity: 0;
8a52619a
TD
168 transition: opacity 0.12s;
169
5908f54f 170 @include wcfFontSmall;
8a52619a 171
3321b9c6
MW
172 &:not(:last-child) {
173 margin-right: 5px;
174 }
175 }
8a52619a 176
06cf7304
MW
177 @include screen-md-up {
178 .messageGroupCounterMobile,
179 .messageGroupInfoMobile {
180 display: none;
181 }
182 }
8a52619a 183
b844e0c0 184 @include screen-md-down {
06cf7304
MW
185 .tabularListColumns > .columnMark {
186 display: none;
187 }
8a52619a 188
06cf7304 189 .tabularListRowHead {
b844e0c0
MW
190 .columnMark {
191 display: none;
192 }
193
194 .columnSubject {
195 padding: 0;
196 }
197
198 .columnLastPost {
199 flex-basis: auto;
200 padding: 0;
201 }
202 }
203 }
204
205 @include screen-sm-down {
206 .tabularListRowHead {
06cf7304
MW
207 .columnStats {
208 display: none;
209 }
8a52619a 210
06cf7304
MW
211 .columnSubject {
212 padding: 0;
213 }
8a52619a 214
06cf7304
MW
215 .columnLastPost {
216 flex-basis: auto;
217 padding: 0;
218 }
219 }
8a52619a 220
06cf7304
MW
221 .tabularListRow:not(.tabularListRowHead) > .tabularListColumns {
222 flex-wrap: wrap;
223 justify-content: flex-end;
224 padding: 5px 0;
8a52619a 225
06cf7304
MW
226 > li {
227 padding: 0;
228 }
8a52619a 229
06cf7304
MW
230 .columnAvatar {
231 margin-right: 10px;
232 padding: 0;
8a52619a 233
06cf7304
MW
234 div {
235 height: 32px;
236 width: 32px;
237 }
8a52619a 238
06cf7304
MW
239 img {
240 max-height: 32px;
241 max-width: 32px;
242 }
8a52619a 243
06cf7304
MW
244 .myAvatar {
245 display: none;
246 }
247 }
8a52619a 248
06cf7304
MW
249 .columnSubject {
250 /* 37px = avatar width + margin-right */
251 flex-basis: calc(100% - 42px);
252 max-width: calc(100% - 42px);
8a52619a 253
06cf7304
MW
254 > h3 {
255 align-items: flex-start;
256 display: flex;
8a52619a 257
ab460889 258 > .messageGroupLink {
06cf7304 259 flex: 1 1 auto;
5b2a97e1 260 line-height: 1.48;
06cf7304
MW
261 overflow: hidden;
262 text-overflow: ellipsis;
8a52619a 263
06cf7304
MW
264 @include wcfFontDefault;
265 }
8a52619a 266
06cf7304
MW
267 > .messageGroupCounterMobile {
268 flex: 0 0 auto;
269 margin-left: 10px;
270 }
271 }
8a52619a 272
06cf7304 273 .messageGroupInfoMobile {
1a75e228 274 color: var(--wcfContentDimmedText);
06cf7304 275 display: flex;
8a52619a 276
06cf7304 277 @include wcfFontSmall;
8a52619a 278
06cf7304
MW
279 > .messageGroupAuthorMobile {
280 flex: 1 1 auto;
281 }
8a52619a 282
06cf7304
MW
283 > .messageGroupLastPostTimeMobile {
284 flex: 0 0 auto;
285 margin-left: 10px;
286 }
287 }
8a52619a 288
06cf7304
MW
289 .statusDisplay,
290 .messageGroupInfo,
291 .messageGroupTime,
292 .messageGroupEditLink {
293 display: none;
294 }
8a52619a 295
06cf7304
MW
296 .labelList {
297 float: none;
298 padding-bottom: 2px;
299 padding-left: 0;
300 }
301 }
8a52619a 302
06cf7304
MW
303 .columnStats,
304 .columnLastPost {
305 display: none;
306 }
307 }
308 }
8a52619a 309
15f0fffa
AE
310 .tabularListRowHead {
311 .columnSort {
312 flex: 1;
8a52619a 313
15f0fffa 314 @include wcfFontDefault;
f4625fe0
AE
315
316 fa-icon {
1a75e228 317 color: var(--wcfTabularBoxHeadline);
f4625fe0 318 }
15f0fffa 319 }
8a52619a 320
15f0fffa
AE
321 .columnFilter {
322 flex: 0 1 auto;
323 padding-left: 40px;
8a52619a 324
15f0fffa 325 @include wcfFontDefault;
8a52619a 326
15f0fffa
AE
327 @include screen-xs {
328 display: none;
329 }
330 }
8a52619a 331
15f0fffa
AE
332 .columnSort,
333 .columnFilter {
334 .inlineList > li:not(:last-child) {
335 margin-right: 10px;
336 }
337 }
8a52619a 338
15f0fffa
AE
339 .columnApplyFilter {
340 flex: 0 1 auto;
341 padding-right: 0;
342 }
343 }
3321b9c6
MW
344}
345
346.messageGroupListStatsSimple {
1a75e228 347 color: var(--wcfContentDimmedText);
3321b9c6
MW
348 font-size: 1rem;
349 left: 50%;
350 position: absolute;
351 top: 50%;
352 transform: translateX(-50%) translateY(-50%);
8a52619a 353
15f0fffa
AE
354 > .icon {
355 color: inherit;
356 }
3321b9c6 357}
06cf7304 358
1dd78392
AE
359@include screen-md-up {
360 .contentHeader.messageGroupContentHeader .contentHeaderIcon {
361 position: relative;
362 }
363}
364
06cf7304
MW
365@include screen-md-down {
366 .mobileLinkShadowContainer {
367 position: relative;
8a52619a 368
06cf7304
MW
369 > .mobileLinkShadow {
370 bottom: 0;
371 left: 0;
372 position: absolute;
373 right: 0;
374 top: 0;
375 }
376 }
30f4c4d3 377}