Skip to content

Commit 6748911

Browse files
authored
Clippy lints page improvements and cleanups (#16112)
First commits fixes a display issue when JS is disabled. Before: <img width="962" height="144" alt="image" src="https://github.com/user-attachments/assets/d9ca8077-2486-49eb-9a99-bd396c0d67fa" /> After: <img width="962" height="144" alt="Screenshot From 2025-11-18 14-12-52" src="https://github.com/user-attachments/assets/a5f0c390-7e3c-4ad5-bb0d-95e0c1a1889b" /> The two other commits remove (each) one DOM level in the filters menu. changelog: none r? @Alexendoo
2 parents df627dd + f6cfdd9 commit 6748911

File tree

2 files changed

+134
-135
lines changed

2 files changed

+134
-135
lines changed

util/gh-pages/index_template.html

Lines changed: 99 additions & 103 deletions
Original file line numberDiff line numberDiff line change
@@ -57,119 +57,115 @@ <h1 class="page-header">Clippy Lints <span class="badge">Total number: {{+ count
5757
</noscript> {# #}
5858

5959
<div id="menu-filters"> {# #}
60-
<div class="panel-body row"> {# #}
61-
<div id="upper-filters"> {# #}
62-
<div class="dropdown" data-filter="levels" tabindex="-1"> {# #}
63-
<button type="button" class="btn-default dropdown-toggle"> {# #}
64-
Lint levels <span id="levels-count" class="badge">4</span> <span class="caret"></span> {# #}
65-
</button> {# #}
66-
<ul class="dropdown-menu"> {# #}
67-
<li class="checkbox"> {# #}
68-
<button class="reset-all">All</button> {# #}
69-
</li> {# #}
70-
<li class="checkbox"> {# #}
71-
<button class="reset-none">None</button> {# #}
72-
</li> {# #}
73-
<li role="separator" class="divider"></li> {# #}
74-
{% for level in ["allow", "warn", "deny", "none"] %}
75-
<li class="checkbox"> {# #}
76-
<label> {# #}
77-
<input type="checkbox" name="{{ level }}" checked />
78-
{{ level | capitalize }}
79-
</label> {# #}
80-
</li> {# #}
81-
{% endfor %}
82-
</ul> {# #}
83-
</div> {# #}
84-
<div class="dropdown" data-filter="groups" tabindex="-1"> {# #}
85-
<button type="button" class="btn-default dropdown-toggle"> {# #}
86-
Lint groups <span id="groups-count" class="badge">9</span> <span class="caret"></span> {# #}
87-
</button> {# #}
88-
<ul class="dropdown-menu"> {# #}
89-
<li class="checkbox"> {# #}
90-
<button class="reset-all">All</button> {# #}
91-
</li> {# #}
92-
<li class="checkbox"> {# #}
93-
<button class="reset-default">Default</button> {# #}
94-
</li> {# #}
95-
<li class="checkbox"> {# #}
96-
<button class="reset-none">None</button> {# #}
97-
</li> {# #}
98-
<li role="separator" class="divider"></li> {# #}
99-
{% for group in ["cargo", "complexity", "correctness", "nursery", "pedantic", "perf", "restriction", "style", "suspicious", "deprecated"] %}
100-
<li class="checkbox"> {# #}
101-
<label> {# #}
102-
<input type="checkbox" name="{{ group }}" {% if *group != "deprecated" +%} checked {% endif %} />
103-
{{ group | capitalize }}
104-
</label> {# #}
105-
</li> {# #}
106-
{% endfor %}
107-
</ul> {# #}
108-
</div> {# #}
109-
<div id="version-filter" class="dropdown" tabindex="-1"> {# #}
110-
<button type="button" class="btn-default dropdown-toggle"> {# #}
111-
Version {#+ #}
112-
<span id="versions-count" class="badge">0</span> {#+ #}
113-
<span class="caret"></span> {# #}
114-
</button> {# #}
115-
<ul class="dropdown-menu"> {# #}
60+
<div id="upper-filters"> {# #}
61+
<div class="dropdown" data-filter="levels" tabindex="-1"> {# #}
62+
<button type="button" class="btn-default dropdown-toggle"> {# #}
63+
Lint levels <span id="levels-count" class="badge">4</span> <span class="caret"></span> {# #}
64+
</button> {# #}
65+
<ul class="dropdown-menu"> {# #}
66+
<li class="checkbox"> {# #}
67+
<button class="reset-all">All</button> {# #}
68+
</li> {# #}
69+
<li class="checkbox"> {# #}
70+
<button class="reset-none">None</button> {# #}
71+
</li> {# #}
72+
<li role="separator" class="divider"></li> {# #}
73+
{% for level in ["allow", "warn", "deny", "none"] %}
11674
<li class="checkbox"> {# #}
117-
<button id="reset-versions">Clear filters</button> {# #}
75+
<label> {# #}
76+
<input type="checkbox" name="{{ level }}" checked />
77+
{{ level | capitalize }}
78+
</label> {# #}
11879
</li> {# #}
119-
<li role="separator" class="divider"></li> {# #}
120-
{% for (sym, name) in [("≥", "gte"), ("≤", "lte"), ("=", "eq")] %}
121-
<li class="checkbox"> {# #}
122-
<label>{{ sym }}</label> {#+ #}
123-
<span>1.</span> {# #}
124-
<input type="number" name="{{ name }}" min="29" maxlength="2" class="version-filter-input form-control filter-input" /> {# #}
125-
<span>.0</span> {# #}
126-
</li> {# #}
127-
{% endfor %}
128-
</ul> {# #}
129-
</div> {# #}
130-
<div class="dropdown" data-filter="applicabilities" tabindex="-1"> {# #}
131-
<button type="button" class="btn-default dropdown-toggle"> {# #}
132-
Applicability {#+ #}
133-
<span id="applicabilities-count" class="badge">4</span> {#+ #}
134-
<span class="caret"></span> {# #}
135-
</button> {# #}
136-
<ul class="dropdown-menu"> {# #}
80+
{% endfor %}
81+
</ul> {# #}
82+
</div> {# #}
83+
<div class="dropdown" data-filter="groups" tabindex="-1"> {# #}
84+
<button type="button" class="btn-default dropdown-toggle"> {# #}
85+
Lint groups <span id="groups-count" class="badge">9</span> <span class="caret"></span> {# #}
86+
</button> {# #}
87+
<ul class="dropdown-menu"> {# #}
88+
<li class="checkbox"> {# #}
89+
<button class="reset-all">All</button> {# #}
90+
</li> {# #}
91+
<li class="checkbox"> {# #}
92+
<button class="reset-default">Default</button> {# #}
93+
</li> {# #}
94+
<li class="checkbox"> {# #}
95+
<button class="reset-none">None</button> {# #}
96+
</li> {# #}
97+
<li role="separator" class="divider"></li> {# #}
98+
{% for group in ["cargo", "complexity", "correctness", "nursery", "pedantic", "perf", "restriction", "style", "suspicious", "deprecated"] %}
13799
<li class="checkbox"> {# #}
138-
<button class="reset-all">All</button> {# #}
100+
<label> {# #}
101+
<input type="checkbox" name="{{ group }}" {% if *group != "deprecated" +%} checked {% endif %} />
102+
{{ group | capitalize }}
103+
</label> {# #}
139104
</li> {# #}
105+
{% endfor %}
106+
</ul> {# #}
107+
</div> {# #}
108+
<div id="version-filter" class="dropdown" tabindex="-1"> {# #}
109+
<button type="button" class="btn-default dropdown-toggle"> {# #}
110+
Version {#+ #}
111+
<span id="versions-count" class="badge">0</span> {#+ #}
112+
<span class="caret"></span> {# #}
113+
</button> {# #}
114+
<ul class="dropdown-menu"> {# #}
115+
<li class="checkbox"> {# #}
116+
<button id="reset-versions">Clear filters</button> {# #}
117+
</li> {# #}
118+
<li role="separator" class="divider"></li> {# #}
119+
{% for (sym, name) in [("≥", "gte"), ("≤", "lte"), ("=", "eq")] %}
140120
<li class="checkbox"> {# #}
141-
<button class="reset-none">None</button> {# #}
121+
<label>{{ sym }}</label> {#+ #}
122+
<span>1.</span> {# #}
123+
<input type="number" name="{{ name }}" min="29" maxlength="2" class="version-filter-input form-control filter-input" /> {# #}
124+
<span>.0</span> {# #}
142125
</li> {# #}
143-
<li role="separator" class="divider"></li> {# #}
144-
{% for applicability in ["Unspecified", "MachineApplicable", "MaybeIncorrect", "HasPlaceholders"] %}
145-
<li class="checkbox"> {# #}
146-
<label> {# #}
147-
<input type="checkbox" name="{{ applicability }}" checked />
148-
{{ applicability }}
149-
</label> {# #}
150-
</li> {# #}
151-
{% endfor %}
152-
</ul> {# #}
153-
</div> {# #}
126+
{% endfor %}
127+
</ul> {# #}
154128
</div> {# #}
155-
<div class="search-control"> {# #}
156-
<div class="input-group"> {# #}
157-
<label class="input-group-addon" id="filter-label" for="search-input">Filter:</label> {# #}
158-
<input type="text" class="form-control filter-input" placeholder="Keywords or search string (`S` or `/` to focus)" id="search-input" /> {# #}
159-
<button id="filter-clear" type="button"> {# #}
160-
Clear {# #}
161-
</button> {# #}
162-
</div> {# #}
163-
</div> {# #}
164-
<div class="btn-group expansion-group"> {# #}
165-
<button title="Collapse All" class="btn-default expansion-control" type="button" id="collapse-all"> {# #}
166-
<span class="glyphicon glyphicon-collapse-up"></span> {# #}
167-
</button> {# #}
168-
<button title="Expand All" class="btn-default expansion-control" type="button" id="expand-all"> {# #}
169-
<span class="glyphicon glyphicon-collapse-down"></span> {# #}
129+
<div class="dropdown" data-filter="applicabilities" tabindex="-1"> {# #}
130+
<button type="button" class="btn-default dropdown-toggle"> {# #}
131+
Applicability {#+ #}
132+
<span id="applicabilities-count" class="badge">4</span> {#+ #}
133+
<span class="caret"></span> {# #}
170134
</button> {# #}
135+
<ul class="dropdown-menu"> {# #}
136+
<li class="checkbox"> {# #}
137+
<button class="reset-all">All</button> {# #}
138+
</li> {# #}
139+
<li class="checkbox"> {# #}
140+
<button class="reset-none">None</button> {# #}
141+
</li> {# #}
142+
<li role="separator" class="divider"></li> {# #}
143+
{% for applicability in ["Unspecified", "MachineApplicable", "MaybeIncorrect", "HasPlaceholders"] %}
144+
<li class="checkbox"> {# #}
145+
<label> {# #}
146+
<input type="checkbox" name="{{ applicability }}" checked />
147+
{{ applicability }}
148+
</label> {# #}
149+
</li> {# #}
150+
{% endfor %}
151+
</ul> {# #}
171152
</div> {# #}
172153
</div> {# #}
154+
<div class="search-control"> {# #}
155+
<label class="input-group-addon" id="filter-label" for="search-input">Filter:</label> {# #}
156+
<input type="text" class="form-control filter-input" placeholder="Keywords or search string (`S` or `/` to focus)" id="search-input" /> {# #}
157+
<button id="filter-clear" type="button"> {# #}
158+
Clear {# #}
159+
</button> {# #}
160+
</div> {# #}
161+
<div class="btn-group expansion-group"> {# #}
162+
<button title="Collapse All" class="btn-default expansion-control" type="button" id="collapse-all"> {# #}
163+
<span class="glyphicon glyphicon-collapse-up"></span> {# #}
164+
</button> {# #}
165+
<button title="Expand All" class="btn-default expansion-control" type="button" id="expand-all"> {# #}
166+
<span class="glyphicon glyphicon-collapse-down"></span> {# #}
167+
</button> {# #}
168+
</div> {# #}
173169
</div>
174170
{% for lint in lints %}
175171
<article id="{{lint.id}}"> {# #}

util/gh-pages/style.css

Lines changed: 35 additions & 32 deletions
Original file line numberDiff line numberDiff line change
@@ -113,29 +113,26 @@ label {
113113
background: var(--bg);
114114
border: 1px solid var(--theme-popup-border);
115115
box-shadow: 0 1px 1px rgba(0,0,0,.05);
116+
display: block;
116117
}
117118

118-
div.panel-body {
119-
padding: 15px;
120-
}
121-
div.panel-body::before, div.panel-body::after {
122-
display: table;
123-
content: " ";
124-
}
125-
div.panel-body::after {
126-
clear: both;
119+
#menu-filters {
120+
padding: 15px 0;
121+
display: flex;
122+
flex-direction: column;
127123
}
128-
div.panel-body button {
124+
125+
#menu-filters button {
129126
background: var(--searchbar-bg);
130127
border-color: var(--theme-popup-border);
131128
color: var(--searchbar-fg);
132129
}
133130

134-
div.panel-body button:hover {
131+
#menu-filters button:hover {
135132
box-shadow: 0 0 3px var(--searchbar-shadow-color);
136133
}
137134

138-
div.panel-body button.open {
135+
#menu-filters button.open {
139136
filter: brightness(90%);
140137
}
141138

@@ -242,45 +239,45 @@ article:hover .panel-title-name .anchor { display: inline;}
242239
min-height: 1px;
243240
padding-right: 15px;
244241
padding-left: 15px;
242+
display: flex;
245243
}
246244

247-
.input-group {
248-
position: relative;
245+
#filter-label {
246+
padding: 6px 12px;
247+
font-size: 14px;
248+
font-weight: 400;
249+
line-height: 1;
250+
text-align: center;
251+
border: 1px solid #ccc;
252+
border-radius: 4px;
253+
white-space: nowrap;
249254
display: flex;
255+
align-items: center;
256+
justify-content: center;
257+
border-right: 0;
258+
border-top-right-radius: 0;
259+
border-bottom-right-radius: 0;
250260
}
251-
.input-group > :last-child {
261+
.search-control > :last-child {
252262
border-left: 0;
253263
}
254-
.input-group > :first-child, .btn-group > :first-child {
264+
.btn-group > :first-child {
255265
border-right: 0;
256266
border-top-right-radius: 0;
257267
border-bottom-right-radius: 0;
258268
}
259-
.input-group > :last-child, .btn-group > :last-child {
269+
.search-control > :last-child, .btn-group > :last-child {
260270
border-top-left-radius: 0;
261271
border-bottom-left-radius: 0;
262272
}
263-
.input-group .form-control:not(:first-child):not(:last-child) {
273+
.search-control .form-control:not(:first-child):not(:last-child) {
264274
border-radius: 0;
265275
}
266276
.form-control:focus {
267277
border-color: #66afe9;
268278
outline: 0;
269279
box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,.6);
270280
}
271-
.input-group-addon {
272-
padding: 6px 12px;
273-
font-size: 14px;
274-
font-weight: 400;
275-
line-height: 1;
276-
text-align: center;
277-
border: 1px solid #ccc;
278-
border-radius: 4px;
279-
white-space: nowrap;
280-
display: flex;
281-
align-items: center;
282-
justify-content: center;
283-
}
284281

285282
.glyphicon.glyphicon-collapse-up::before, .glyphicon.glyphicon-collapse-down::before {
286283
--background-img-size: 14px;
@@ -343,6 +340,7 @@ article:hover .panel-title-name .anchor { display: inline;}
343340
@media (min-width: 992px) {
344341
.search-control {
345342
margin-top: 0;
343+
align-self: flex-start;
346344
}
347345
.container {
348346
width: 970px;
@@ -357,6 +355,10 @@ article:hover .panel-title-name .anchor { display: inline;}
357355
margin-top: 0;
358356
padding: 0px 15px;
359357
width: 16.66666667%;
358+
align-self: flex-start;
359+
}
360+
#menu-filters {
361+
flex-direction: row;
360362
}
361363
}
362364

@@ -376,7 +378,7 @@ article:hover .panel-title-name .anchor { display: inline;}
376378

377379
@media (max-width: 412px) {
378380
#upper-filters,
379-
.panel-body .search-control {
381+
#menu-filters .search-control {
380382
padding-right: 8px;
381383
padding-left: 8px;
382384
}
@@ -617,6 +619,7 @@ L4.75,12h2.5l0.5393066-2.1572876 c0.2276001-0.1062012,0.4459839-0.2269287,0.649
617619
color: var(--fg);
618620
background: var(--theme-hover);
619621
border: 1px solid var(--theme-popup-border);
622+
padding: 8px;
620623
}
621624
.page-header {
622625
border: 0;

0 commit comments

Comments
 (0)