Skip to content

Commit 6ef7807

Browse files
committed
style(html): clean up the html tags and styles
1 parent abe6f5c commit 6ef7807

File tree

5 files changed

+68
-63
lines changed

5 files changed

+68
-63
lines changed

coverage/htmlfiles/index.html

Lines changed: 16 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -21,15 +21,15 @@ <h1>{{ title|escape }}:
2121
<span class="pc_cov">{{totals.pc_covered_str}}%</span>
2222
</h1>
2323

24-
<div id="help_panel_wrapper">
24+
<aside id="help_panel_wrapper">
2525
<input id="help_panel_state" type="checkbox">
2626
<label for="help_panel_state">
2727
<img id="keyboard_icon" src="keybd_closed.png" alt="Show/hide keyboard shortcuts" />
2828
</label>
2929
<div id="help_panel">
3030
<p class="legend">Shortcuts on this page</p>
31-
<div>
32-
<p class="keyhelp">
31+
<div class="keyhelp">
32+
<p>
3333
<kbd>n</kbd>
3434
<kbd>s</kbd>
3535
<kbd>m</kbd>
@@ -38,25 +38,26 @@ <h1>{{ title|escape }}:
3838
<kbd>b</kbd>
3939
<kbd>p</kbd>
4040
{% endif %}
41-
<kbd>c</kbd> &nbsp; change column sorting
41+
<kbd>c</kbd>
42+
&nbsp; change column sorting
4243
</p>
43-
<p class="keyhelp">
44+
<p>
4445
<kbd>[</kbd>
4546
<kbd>]</kbd>
4647
&nbsp; prev/next file
4748
</p>
48-
<p class="keyhelp">
49+
<p>
4950
<kbd>?</kbd> &nbsp; show/hide this help
5051
</p>
5152
</div>
5253
</div>
53-
</div>
54+
</aside>
5455

5556
<form id="filter_container">
5657
<input id="filter" type="text" value="" placeholder="filter..." />
5758
</form>
5859

59-
<p>
60+
<p class="text">
6061
<a class="nav" href="{{__url__}}">coverage.py v{{__version__}}</a>,
6162
created at {{ time_stamp }}
6263
</p>
@@ -128,15 +129,13 @@ <h1>{{ title|escape }}:
128129
created at {{ time_stamp }}
129130
</p>
130131
</div>
131-
<div style="display: none;">
132-
<p>
133-
<a id="prevFileLink" class="nav" href="{{ final_html }}">first file</a>
134-
<a id="nextFileLink" class="nav" href="{{ first_html }}">final file</a>
135-
</p>
136-
<button type="button" class="button_prev_file" data-shortcut="[">Previous file</button>
137-
<button type="button" class="button_next_file" data-shortcut="]">Next file</button>
138-
<button type="button" class="button_show_hide_help" data-shortcut="?">Show/hide keyboard shortcuts</button>
139-
</div>
132+
<aside class="hidden">
133+
<a id="prevFileLink" class="nav" href="{{ final_html }}"/>
134+
<a id="nextFileLink" class="nav" href="{{ first_html }}"/>
135+
<button type="button" class="button_prev_file" data-shortcut="["/>
136+
<button type="button" class="button_next_file" data-shortcut="]"/>
137+
<button type="button" class="button_show_hide_help" data-shortcut="?"/>
138+
</aside>
140139
</footer>
141140

142141
</body>

coverage/htmlfiles/pyfile.html

Lines changed: 24 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -5,9 +5,6 @@
55
<html>
66
<head>
77
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
8-
{# IE8 rounds line-height incorrectly, and adding this emulateIE7 line makes it right! #}
9-
{# http://social.msdn.microsoft.com/Forums/en-US/iewebdevelopment/thread/7684445e-f080-4d8f-8529-132763348e21 #}
10-
<meta http-equiv="X-UA-Compatible" content="IE=emulateIE7" />
118
<title>Coverage for {{relative_filename|escape}}: {{nums.pc_covered_str}}%</title>
129
<link rel="icon" sizes="32x32" href="favicon_32.png">
1310
<link rel="stylesheet" href="style.css" type="text/css">
@@ -25,15 +22,15 @@ <h1>
2522
<span class="pc_cov">{{nums.pc_covered_str}}%</span>
2623
</h1>
2724

28-
<div id="help_panel_wrapper">
25+
<aside id="help_panel_wrapper">
2926
<input id="help_panel_state" type="checkbox">
3027
<label for="help_panel_state">
3128
<img id="keyboard_icon" src="keybd_closed.png" alt="Show/hide keyboard shortcuts" />
3229
</label>
3330
<div id="help_panel">
3431
<p class="legend">Shortcuts on this page</p>
35-
<div>
36-
<p class="keyhelp">
32+
<div class="keyhelp">
33+
<p>
3734
<kbd>r</kbd>
3835
<kbd>m</kbd>
3936
<kbd>x</kbd>
@@ -42,30 +39,31 @@ <h1>
4239
{% endif %}
4340
&nbsp; toggle line displays
4441
</p>
45-
<p class="keyhelp">
42+
<p>
4643
<kbd>j</kbd>
47-
<kbd>k</kbd> &nbsp; next/prev highlighted chunk
44+
<kbd>k</kbd>
45+
&nbsp; next/prev highlighted chunk
4846
</p>
49-
<p class="keyhelp">
47+
<p>
5048
<kbd>0</kbd> &nbsp; (zero) top of page
5149
</p>
52-
<p class="keyhelp">
50+
<p>
5351
<kbd>1</kbd> &nbsp; (one) first highlighted chunk
5452
</p>
55-
<p class="keyhelp">
53+
<p>
5654
<kbd>[</kbd>
5755
<kbd>]</kbd>
5856
&nbsp; prev/next file
5957
</p>
60-
<p class="keyhelp">
61-
<kbd>u</kbd> &nbsp; back to the index
58+
<p>
59+
<kbd>u</kbd> &nbsp; up to the index
6260
</p>
63-
<p class="keyhelp">
61+
<p>
6462
<kbd>?</kbd> &nbsp; show/hide this help
6563
</p>
6664
</div>
6765
</div>
68-
</div>
66+
</aside>
6967

7068
<h2>
7169
<span class="text">{{nums.n_statements}} statements &nbsp;</span>
@@ -77,7 +75,7 @@ <h2>
7775
{% endif %}
7876
</h2>
7977

80-
<p>
78+
<p class="text">
8179
<a id="prevFileLink" class="nav" href="{{ prev_html }}">&#xab; prev</a> &nbsp; &nbsp;
8280
<a id="indexLink" class="nav" href="index.html">&Hat; index</a> &nbsp; &nbsp;
8381
<a id="nextFileLink" class="nav" href="{{ next_html }}">&#xbb; next</a>
@@ -86,16 +84,16 @@ <h2>
8684
created at {{ time_stamp }}
8785
</p>
8886

89-
<div style="display: none;">
90-
<button type="button" class="button_next_chunk" data-shortcut="j">Next highlighted chunk</button>
91-
<button type="button" class="button_prev_chunk" data-shortcut="k">Previous highlighted chunk</button>
92-
<button type="button" class="button_top_of_page" data-shortcut="0">Goto top of page</button>
93-
<button type="button" class="button_first_chunk" data-shortcut="1">Goto first highlighted chunk</button>
94-
<button type="button" class="button_prev_file" data-shortcut="[">Previous file</button>
95-
<button type="button" class="button_next_file" data-shortcut="]">Next file</button>
96-
<button type="button" class="button_to_index" data-shortcut="u">Back to the index</button>
97-
<button type="button" class="button_show_hide_help" data-shortcut="?">Show/hide keyboard shortcuts</button>
98-
</div>
87+
<aside class="hidden">
88+
<button type="button" class="button_next_chunk" data-shortcut="j"/>
89+
<button type="button" class="button_prev_chunk" data-shortcut="k"/>
90+
<button type="button" class="button_top_of_page" data-shortcut="0"/>
91+
<button type="button" class="button_first_chunk" data-shortcut="1"/>
92+
<button type="button" class="button_prev_file" data-shortcut="["/>
93+
<button type="button" class="button_next_file" data-shortcut="]"/>
94+
<button type="button" class="button_to_index" data-shortcut="u"/>
95+
<button type="button" class="button_show_hide_help" data-shortcut="?"/>
96+
</aside>
9997
</div>
10098
</header>
10199

coverage/htmlfiles/style.css

Lines changed: 8 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -28,6 +28,8 @@ a.nav { text-decoration: none; color: inherit; }
2828

2929
a.nav:hover { text-decoration: underline; color: inherit; }
3030

31+
.hidden { display: none; }
32+
3133
header { background: #f8f8f8; width: 100%; z-index: 2; border-bottom: 1px solid #ccc; }
3234

3335
@media (prefers-color-scheme: dark) { header { background: black; } }
@@ -38,13 +40,13 @@ header .content { padding: 1rem 3.5rem; }
3840

3941
header h2 { margin-top: .5em; font-size: 1em; }
4042

41-
header p { margin: .5em 0 -.5em; color: #666; font-style: italic; }
43+
header p.text { margin: .5em 0 -.5em; color: #666; font-style: italic; }
4244

43-
@media (prefers-color-scheme: dark) { header p { color: #aaa; } }
45+
@media (prefers-color-scheme: dark) { header p.text { color: #aaa; } }
4446

4547
header.sticky { position: fixed; left: 0; right: 0; height: 2.5em; }
4648

47-
header.sticky p, header.sticky .text { display: none; }
49+
header.sticky .text { display: none; }
4850

4951
header.sticky h1, header.sticky h2 { font-size: 1em; margin-top: 0; display: inline-block; }
5052

@@ -126,7 +128,9 @@ header button.par.show_par { background: #ffa; border: 2px solid #bbbb00; margin
126128

127129
#help_panel_state { display: none; }
128130

129-
#help_panel { top: 25px; right: 0; padding: .75em; border: 1px solid #883; }
131+
#help_panel { top: 25px; right: 0; padding: .75em; border: 1px solid #883; color: #333; }
132+
133+
#help_panel .keyhelp p { margin-top: .75em; }
130134

131135
#help_panel .legend { font-style: italic; margin-bottom: 1em; }
132136

@@ -136,8 +140,6 @@ header button.par.show_par { background: #ffa; border: 2px solid #bbbb00; margin
136140

137141
#help_panel_state:checked ~ #help_panel { display: block; }
138142

139-
.keyhelp { margin-top: .75em; }
140-
141143
kbd { border: 1px solid black; border-color: #888 #333 #333 #888; padding: .1em .35em; font-family: SFMono-Regular, Menlo, Monaco, Consolas, monospace; font-weight: bold; background: #eee; border-radius: 3px; }
142144

143145
#source { padding: 1em 0 1em 3.5rem; font-family: SFMono-Regular, Menlo, Monaco, Consolas, monospace; }

coverage/htmlfiles/style.scss

Lines changed: 12 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -156,6 +156,10 @@ a.nav {
156156
}
157157
}
158158

159+
.hidden {
160+
display: none;
161+
}
162+
159163
// Page structure
160164
header {
161165
background: $light-gray1;
@@ -174,7 +178,7 @@ header {
174178
font-size: 1em;
175179
}
176180

177-
p {
181+
p.text {
178182
margin: .5em 0 -.5em;
179183
color: $light-gray5;
180184
@include color-dark($dark-gray5);
@@ -187,7 +191,7 @@ header {
187191
right: 0;
188192
height: 2.5em;
189193

190-
p, .text {
194+
.text {
191195
display: none;
192196
}
193197

@@ -354,30 +358,30 @@ header button {
354358
padding: .75em;
355359
border: 1px solid #883;
356360

361+
color: #333;
362+
363+
.keyhelp p {
364+
margin-top: .75em;
365+
}
366+
357367
.legend {
358368
font-style: italic;
359369
margin-bottom: 1em;
360370
}
361371

362372
.indexfile & {
363373
width: 25em;
364-
//min-height: 4em;
365374
}
366375

367376
.pyfile & {
368377
width: 18em;
369-
//min-height: 8em;
370378
}
371379

372380
#help_panel_state:checked ~ & {
373381
display: block;
374382
}
375383
}
376384

377-
.keyhelp {
378-
margin-top: .75em;
379-
}
380-
381385
kbd {
382386
border: 1px solid black;
383387
border-color: #888 #333 #333 #888;

tests/gold/html/styled/style.css

Lines changed: 8 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -28,6 +28,8 @@ a.nav { text-decoration: none; color: inherit; }
2828

2929
a.nav:hover { text-decoration: underline; color: inherit; }
3030

31+
.hidden { display: none; }
32+
3133
header { background: #f8f8f8; width: 100%; z-index: 2; border-bottom: 1px solid #ccc; }
3234

3335
@media (prefers-color-scheme: dark) { header { background: black; } }
@@ -38,13 +40,13 @@ header .content { padding: 1rem 3.5rem; }
3840

3941
header h2 { margin-top: .5em; font-size: 1em; }
4042

41-
header p { margin: .5em 0 -.5em; color: #666; font-style: italic; }
43+
header p.text { margin: .5em 0 -.5em; color: #666; font-style: italic; }
4244

43-
@media (prefers-color-scheme: dark) { header p { color: #aaa; } }
45+
@media (prefers-color-scheme: dark) { header p.text { color: #aaa; } }
4446

4547
header.sticky { position: fixed; left: 0; right: 0; height: 2.5em; }
4648

47-
header.sticky p, header.sticky .text { display: none; }
49+
header.sticky .text { display: none; }
4850

4951
header.sticky h1, header.sticky h2 { font-size: 1em; margin-top: 0; display: inline-block; }
5052

@@ -126,7 +128,9 @@ header button.par.show_par { background: #ffa; border: 2px solid #bbbb00; margin
126128

127129
#help_panel_state { display: none; }
128130

129-
#help_panel { top: 25px; right: 0; padding: .75em; border: 1px solid #883; }
131+
#help_panel { top: 25px; right: 0; padding: .75em; border: 1px solid #883; color: #333; }
132+
133+
#help_panel .keyhelp p { margin-top: .75em; }
130134

131135
#help_panel .legend { font-style: italic; margin-bottom: 1em; }
132136

@@ -136,8 +140,6 @@ header button.par.show_par { background: #ffa; border: 2px solid #bbbb00; margin
136140

137141
#help_panel_state:checked ~ #help_panel { display: block; }
138142

139-
.keyhelp { margin-top: .75em; }
140-
141143
kbd { border: 1px solid black; border-color: #888 #333 #333 #888; padding: .1em .35em; font-family: SFMono-Regular, Menlo, Monaco, Consolas, monospace; font-weight: bold; background: #eee; border-radius: 3px; }
142144

143145
#source { padding: 1em 0 1em 3.5rem; font-family: SFMono-Regular, Menlo, Monaco, Consolas, monospace; }

0 commit comments

Comments
 (0)