Skip to content

Commit 4e54782

Browse files
authored
Remove fomantic message module (#29856)
Remove this CSS-only module, which gives a nice reduction in CSS size. Should look exactly like before.
1 parent 43aa914 commit 4e54782

File tree

4 files changed

+100
-751
lines changed

4 files changed

+100
-751
lines changed

web_src/css/base.css

-67
Original file line numberDiff line numberDiff line change
@@ -510,73 +510,6 @@ ol.ui.list li,
510510
visibility: visible !important;
511511
}
512512

513-
.ui.message {
514-
background: var(--color-box-body);
515-
color: var(--color-text);
516-
box-shadow: none !important;
517-
border: 1px solid var(--color-secondary);
518-
}
519-
520-
.ui.info.message .header,
521-
.ui.blue.message .header {
522-
color: var(--color-blue);
523-
}
524-
525-
.ui.info.message,
526-
.ui.attached.info.message,
527-
.ui.blue.message,
528-
.ui.attached.blue.message {
529-
background: var(--color-info-bg);
530-
color: var(--color-info-text);
531-
border-color: var(--color-info-border);
532-
}
533-
534-
.ui.success.message .header,
535-
.ui.positive.message .header,
536-
.ui.green.message .header {
537-
color: var(--color-green);
538-
}
539-
540-
.ui.success.message,
541-
.ui.attached.success.message,
542-
.ui.positive.message,
543-
.ui.attached.positive.message {
544-
background: var(--color-success-bg);
545-
color: var(--color-success-text);
546-
border-color: var(--color-success-border);
547-
}
548-
549-
.ui.error.message .header,
550-
.ui.negative.message .header,
551-
.ui.red.message .header {
552-
color: var(--color-red);
553-
}
554-
555-
.ui.error.message,
556-
.ui.attached.error.message,
557-
.ui.red.message,
558-
.ui.attached.red.message,
559-
.ui.negative.message,
560-
.ui.attached.negative.message {
561-
background: var(--color-error-bg);
562-
color: var(--color-error-text);
563-
border-color: var(--color-error-border);
564-
}
565-
566-
.ui.warning.message .header,
567-
.ui.yellow.message .header {
568-
color: var(--color-yellow);
569-
}
570-
571-
.ui.warning.message,
572-
.ui.attached.warning.message,
573-
.ui.yellow.message,
574-
.ui.attached.yellow.message {
575-
background: var(--color-warning-bg);
576-
color: var(--color-warning-text);
577-
border-color: var(--color-warning-border);
578-
}
579-
580513
.ui.error.header {
581514
background: var(--color-error-bg) !important;
582515
color: var(--color-error-text) !important;

web_src/css/index.css

+1
Original file line numberDiff line numberDiff line change
@@ -12,6 +12,7 @@
1212
@import "./modules/divider.css";
1313
@import "./modules/svg.css";
1414
@import "./modules/flexcontainer.css";
15+
@import "./modules/message.css";
1516

1617
@import "./shared/flex-list.css";
1718
@import "./shared/milestone.css";

web_src/css/modules/message.css

+99
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,99 @@
1+
.ui.message {
2+
background: var(--color-box-body);
3+
color: var(--color-text);
4+
border: 1px solid var(--color-secondary);
5+
position: relative;
6+
min-height: 1em;
7+
margin: 1em 0;
8+
padding: 1em 1.5em;
9+
border-radius: var(--border-radius);
10+
}
11+
12+
.ui.message:first-child {
13+
margin-top: 0;
14+
}
15+
16+
.ui.message:last-child {
17+
margin-bottom: 0;
18+
}
19+
20+
.ui.attached.message {
21+
margin-bottom: -1px;
22+
border-radius: var(--border-radius) var(--border-radius) 0 0;
23+
margin-left: -1px;
24+
margin-right: -1px;
25+
}
26+
27+
.ui.attached + .ui.attached.message:not(.top):not(.bottom) {
28+
margin-top: -1px;
29+
border-radius: 0;
30+
}
31+
32+
.ui.bottom.attached.message {
33+
margin-top: -1px;
34+
border-radius: 0 0 var(--border-radius) var(--border-radius);
35+
}
36+
37+
.ui.bottom.attached.message:not(:last-child) {
38+
margin-bottom: 1em;
39+
}
40+
41+
.ui.info.message .header,
42+
.ui.blue.message .header {
43+
color: var(--color-blue);
44+
}
45+
46+
.ui.info.message,
47+
.ui.attached.info.message,
48+
.ui.blue.message,
49+
.ui.attached.blue.message {
50+
background: var(--color-info-bg);
51+
color: var(--color-info-text);
52+
border-color: var(--color-info-border);
53+
}
54+
55+
.ui.success.message .header,
56+
.ui.positive.message .header,
57+
.ui.green.message .header {
58+
color: var(--color-green);
59+
}
60+
61+
.ui.success.message,
62+
.ui.attached.success.message,
63+
.ui.positive.message,
64+
.ui.attached.positive.message {
65+
background: var(--color-success-bg);
66+
color: var(--color-success-text);
67+
border-color: var(--color-success-border);
68+
}
69+
70+
.ui.error.message .header,
71+
.ui.negative.message .header,
72+
.ui.red.message .header {
73+
color: var(--color-red);
74+
}
75+
76+
.ui.error.message,
77+
.ui.attached.error.message,
78+
.ui.red.message,
79+
.ui.attached.red.message,
80+
.ui.negative.message,
81+
.ui.attached.negative.message {
82+
background: var(--color-error-bg);
83+
color: var(--color-error-text);
84+
border-color: var(--color-error-border);
85+
}
86+
87+
.ui.warning.message .header,
88+
.ui.yellow.message .header {
89+
color: var(--color-yellow);
90+
}
91+
92+
.ui.warning.message,
93+
.ui.attached.warning.message,
94+
.ui.yellow.message,
95+
.ui.attached.yellow.message {
96+
background: var(--color-warning-bg);
97+
color: var(--color-warning-text);
98+
border-color: var(--color-warning-border);
99+
}

0 commit comments

Comments
 (0)