Skip to content

Commit 649aada

Browse files
silverwindsilverwind
authored
Remove fomantic list module (#30281)
Likely still some unnecessary CSS but any combinations with the `ui list` classes are covered. There was only on instance of `horizontal list` which I removed. It was this part of the commit page: <img width="396" alt="image" src="https://github.com/go-gitea/gitea/assets/115237/c49ec4f5-93c3-41d6-a907-cdbedf8abc44">
1 parent 662eb4b commit 649aada

File tree

7 files changed

+192
-1009
lines changed

7 files changed

+192
-1009
lines changed

‎templates/repo/commit_page.tmpl

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -164,9 +164,9 @@
164164
{{end}}
165165
{{end}}
166166
</div>
167-
<div class="ui horizontal list tw-flex tw-items-center">
167+
<div class="tw-flex tw-items-center">
168168
{{if .Parents}}
169-
<div class="item">
169+
<div>
170170
<span>{{ctx.Locale.Tr "repo.diff.parent"}}</span>
171171
{{range .Parents}}
172172
{{if $.PageIsWiki}}

‎templates/user/settings/repos.tmpl

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@
66
<div class="ui attached segment">
77
{{if or .allowAdopt .allowDelete}}
88
{{if .Dirs}}
9-
<div class="ui middle aligned divided list">
9+
<div class="ui list">
1010
{{range $dirI, $dir := .Dirs}}
1111
{{$repo := index $.ReposMap $dir}}
1212
<div class="item {{if not $repo}}tw-py-1{{end}}">{{/* if not repo, then there are "adapt" buttons, so the padding shouldn't be that default large*/}}

‎web_src/css/base.css

Lines changed: 1 addition & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -44,7 +44,7 @@ html, body {
4444
}
4545

4646
body {
47-
line-height: 1.4285rem;
47+
line-height: 20px;
4848
font-family: var(--fonts-regular);
4949
color: var(--color-text);
5050
background-color: var(--color-body);
@@ -305,14 +305,6 @@ a.label,
305305
background-color: var(--color-label-bg);
306306
}
307307

308-
/* fix Fomantic's line-height causing vertical scrollbars to appear */
309-
ul.ui.list li,
310-
ol.ui.list li,
311-
.ui.list > .item,
312-
.ui.list .list > .item {
313-
line-height: var(--line-height-default);
314-
}
315-
316308
.ui.menu {
317309
display: flex;
318310
}
@@ -456,21 +448,6 @@ ol.ui.list li,
456448
color: var(--color-text-light-2);
457449
}
458450

459-
.ui.list .list > .item .header,
460-
.ui.list > .item .header {
461-
color: var(--color-text-dark);
462-
}
463-
464-
.ui.list .list > .item > .content,
465-
.ui.list > .item > .content {
466-
color: var(--color-text);
467-
}
468-
469-
.ui.list .list > .item .description,
470-
.ui.list > .item .description {
471-
color: var(--color-text);
472-
}
473-
474451
/* replace item margin on secondary menu items with gap and remove both the
475452
negative margins on the menu as well as margin on the items */
476453
.ui.secondary.menu {
@@ -589,10 +566,6 @@ img.ui.avatar,
589566
aspect-ratio: 1;
590567
}
591568

592-
.ui.divided.list > .item {
593-
border-color: var(--color-secondary);
594-
}
595-
596569
.ui.error.message .header,
597570
.ui.warning.message .header {
598571
color: inherit;

‎web_src/css/index.css

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,7 @@
88
@import "./modules/header.css";
99
@import "./modules/input.css";
1010
@import "./modules/label.css";
11+
@import "./modules/list.css";
1112
@import "./modules/segment.css";
1213
@import "./modules/grid.css";
1314
@import "./modules/message.css";

‎web_src/css/modules/list.css

Lines changed: 187 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,187 @@
1+
/* based on Fomantic UI list module, with just the parts extracted that we use. If you find any
2+
unused rules here after refactoring, please remove them. */
3+
4+
.ui.list {
5+
list-style-type: none;
6+
margin: 1em 0;
7+
padding: 0;
8+
font-size: 1em;
9+
}
10+
11+
.ui.list:first-child {
12+
margin-top: 0;
13+
padding-top: 0;
14+
}
15+
16+
.ui.list:last-child {
17+
margin-bottom: 0;
18+
padding-bottom: 0;
19+
}
20+
21+
.ui.list > .item,
22+
.ui.list .list > .item {
23+
display: list-item;
24+
table-layout: fixed;
25+
list-style-type: none;
26+
list-style-position: outside;
27+
}
28+
29+
.ui.list > .list > .item::after,
30+
.ui.list > .item::after {
31+
content: "";
32+
display: block;
33+
height: 0;
34+
clear: both;
35+
visibility: hidden;
36+
}
37+
38+
.ui.list .list:not(.icon) {
39+
clear: both;
40+
margin: 0;
41+
padding: 0.75em 0 0.25em 0.5em;
42+
}
43+
44+
.ui.list .list > .item {
45+
padding: 0.14285714em 0;
46+
}
47+
48+
.ui.list .list > .item > i.icon,
49+
.ui.list > .item > i.icon {
50+
display: table-cell;
51+
min-width: 1.55em;
52+
padding-top: 0;
53+
transition: color 0.1s ease;
54+
padding-right: 0.28571429em;
55+
vertical-align: top;
56+
}
57+
.ui.list .list > .item > i.icon:only-child,
58+
.ui.list > .item > i.icon:only-child {
59+
display: inline-block;
60+
min-width: auto;
61+
vertical-align: top;
62+
}
63+
64+
.ui.list .list > .item > .image,
65+
.ui.list > .item > .image {
66+
display: table-cell;
67+
background-color: transparent;
68+
vertical-align: top;
69+
}
70+
.ui.list .list > .item > .image:not(:only-child):not(img),
71+
.ui.list > .item > .image:not(:only-child):not(img) {
72+
padding-right: 0.5em;
73+
}
74+
.ui.list .list > .item > .image img,
75+
.ui.list > .item > .image img {
76+
vertical-align: top;
77+
}
78+
.ui.list .list > .item > img.image,
79+
.ui.list .list > .item > .image:only-child,
80+
.ui.list > .item > img.image,
81+
.ui.list > .item > .image:only-child {
82+
display: inline-block;
83+
}
84+
85+
.ui.list .list > .item > .content,
86+
.ui.list > .item > .content {
87+
color: var(--color-text);
88+
}
89+
.ui.list .list > .item > .image + .content,
90+
.ui.list .list > .item > i.icon + .content,
91+
.ui.list > .item > .image + .content,
92+
.ui.list > .item > i.icon + .content {
93+
display: table-cell;
94+
width: 100%;
95+
padding: 0 0 0 0.5em;
96+
vertical-align: top;
97+
}
98+
.ui.list .list > .item > img.image + .content,
99+
.ui.list > .item > img.image + .content {
100+
display: inline-block;
101+
width: auto;
102+
}
103+
.ui.list .list > .item > .content > .list,
104+
.ui.list > .item > .content > .list {
105+
margin-left: 0;
106+
padding-left: 0;
107+
}
108+
109+
.ui.list .list > .item .header,
110+
.ui.list > .item .header {
111+
display: block;
112+
margin: 0;
113+
font-family: var(--fonts-regular);
114+
font-weight: var(--font-weight-medium);
115+
color: var(--color-text-dark);
116+
}
117+
118+
.ui.list .list > .item .description,
119+
.ui.list > .item .description {
120+
display: block;
121+
color: var(--color-text);
122+
}
123+
124+
.ui.list > .item a,
125+
.ui.list .list > .item a {
126+
cursor: pointer;
127+
}
128+
129+
.ui.menu .ui.list > .item,
130+
.ui.menu .ui.list .list > .item {
131+
display: list-item;
132+
table-layout: fixed;
133+
background-color: transparent;
134+
list-style-type: none;
135+
list-style-position: outside;
136+
padding: 0.21428571em 0;
137+
}
138+
.ui.menu .ui.list .list > .item::before,
139+
.ui.menu .ui.list > .item::before {
140+
border: none;
141+
background: none;
142+
}
143+
.ui.menu .ui.list .list > .item:first-child,
144+
.ui.menu .ui.list > .item:first-child {
145+
padding-top: 0;
146+
}
147+
.ui.menu .ui.list .list > .item:last-child,
148+
.ui.menu .ui.list > .item:last-child {
149+
padding-bottom: 0;
150+
}
151+
152+
.ui.list .list > .disabled.item,
153+
.ui.list > .disabled.item {
154+
pointer-events: none;
155+
opacity: var(--opacity-disabled);
156+
}
157+
158+
.ui.list .list > a.item:hover > .icons,
159+
.ui.list > a.item:hover > .icons,
160+
.ui.list .list > a.item:hover > i.icon,
161+
.ui.list > a.item:hover > i.icon {
162+
color: var(--color-text-dark);
163+
}
164+
165+
.ui.divided.list > .item {
166+
border-top: 1px solid var(--color-secondary);
167+
}
168+
.ui.divided.list .list > .item {
169+
border-top: none;
170+
}
171+
.ui.divided.list .item .list > .item {
172+
border-top: none;
173+
}
174+
.ui.divided.list .list > .item:first-child,
175+
.ui.divided.list > .item:first-child {
176+
border-top: none;
177+
}
178+
.ui.divided.list .list > .item:first-child {
179+
border-top-width: 1px;
180+
}
181+
182+
.ui.relaxed.list > .item:not(:first-child) {
183+
padding-top: 0.42857143em;
184+
}
185+
.ui.relaxed.list > .item:not(:last-child) {
186+
padding-bottom: 0.42857143em;
187+
}

0 commit comments

Comments
 (0)