Skip to content

Commit

Permalink
Source code without tables
Browse files Browse the repository at this point in the history
  • Loading branch information
nedbat committed Oct 13, 2019
1 parent f1505af commit bcbdf41
Show file tree
Hide file tree
Showing 3 changed files with 154 additions and 142 deletions.
6 changes: 3 additions & 3 deletions coverage/htmlfiles/coverage_html.js
Original file line number Diff line number Diff line change
Expand Up @@ -231,7 +231,7 @@ coverage.index_ready = function ($) {
coverage.pyfile_ready = function ($) {
// If we're directed to a particular line number, highlight the line.
var frag = location.hash;
if (frag.length > 2 && frag[1] === 'n') {
if (frag.length > 2 && frag[1] === 't') {
$(frag).addClass('highlight');
coverage.set_sel(parseInt(frag.substr(2), 10));
}
Expand Down Expand Up @@ -512,7 +512,7 @@ coverage.finish_scrolling = function () {
coverage.init_scroll_markers = function () {
var c = coverage;
// Init some variables
c.lines_len = $('td.text p').length;
c.lines_len = $('#source p').length;
c.body_h = $('body').height();
c.header_h = $('div#header').height();

Expand All @@ -526,7 +526,7 @@ coverage.build_scroll_markers = function () {
max_line_height = 10,
visible_window_h = $(window).height();

c.lines_to_mark = $('td.text').find('p.show_run, p.show_mis, p.show_exc, p.show_par');
c.lines_to_mark = $('#source').find('p.show_run, p.show_mis, p.show_exc, p.show_exc, p.show_par');
$('#scroll_marker').remove();
// Don't build markers if the window has no scroll bar.
if (c.body_h <= visible_window_h) {
Expand Down
59 changes: 20 additions & 39 deletions coverage/htmlfiles/pyfile.html
Original file line number Diff line number Diff line change
Expand Up @@ -68,45 +68,26 @@ <h2 class="stats">
</div>

<div id="source">
<table>
<tr>
<td class="linenos">
{% for line in lines -%}
<p id="n{{line.number}}" class="{{line.css_class}}"><a href="#n{{line.number}}">{{line.number}}</a></p>
{% endfor %}
</td>
<td class="text">
{# These are the source lines, which are very sensitive to whitespace. -#}
{# The `{ # - # }` below are comments which slurp up the following space. -#}
{% for line in lines -%}
<p id="t{{line.number}}" class="{{line.css_class}}">{#-#}
{% if line.annotate -%}
<span class="annotate short">{{line.annotate}}</span>{#-#}
<span class="annotate long">{{line.annotate_long}}</span>{#-#}
{% endif -%}
{{line.html}}<span class="strut">&nbsp;</span>{#-#}
</p>
{% endfor %}
</td>
{% if show_contexts -%}
<td class="contexts">
{% for line in lines -%}
<p>{#-#}
{% if line.contexts -%}
<span class="context-button">{{ line.contexts|len }} ctx</span>{#-#}
<span class="context-list">
{% for context in line.contexts -%}
<span class="context-line">{{context}}</span>{#-#}
{% endfor -%}
</span>{#-#}
{% endif -%}
&nbsp;
</p>{#-#}
{% endfor %}
</td>
{% endif %}
</tr>
</table>
{# These are the source lines, which are very sensitive to whitespace. -#}
{# The `{ # - # }` below are comments which slurp up the following space. -#}
{% for line in lines -%}
<p id="t{{line.number}}" class="{{line.css_class}}">{#-#}
<span class="n"><a href="#t{{line.number}}">{{line.number}}</a></span>{#-#}
<span class="t">{{line.html}}&nbsp;</span>{#-#}
{% if line.annotate -%}
<span class="annotate short">{{line.annotate}}</span>{#-#}
<span class="annotate long">{{line.annotate_long}}</span>{#-#}
{% endif -%}
{% if line.contexts -%}
<span class="context-button">{{ line.contexts|len }} ctx</span>{#-#}
<span class="context-list">
{% for context in line.contexts -%}
<span class="context-line">{{context}}</span>{#-#}
{% endfor -%}
</span>{#-#}
{% endif -%}
</p>
{% endfor %}
</div>

<div id="footer">
Expand Down
231 changes: 131 additions & 100 deletions coverage/htmlfiles/style.scss
Original file line number Diff line number Diff line change
Expand Up @@ -6,15 +6,20 @@
// When you edit this file, you need to run "make css" to get the CSS file
// generated, and then check in both the .scss and the .css files.

// When working on the file, this command is useful:
// sass --watch --style=compact --sourcemap=none --no-cache coverage/htmlfiles/style.scss:htmlcov/style.css

// Ignore this comment, it's for the CSS output file:
/* Don't edit this .css file. Edit the .scss file instead! */

// Dimensions
$left-gutter: 3rem;

// Page-wide styles
html, body, h1, h2, h3, p, table, td, th {
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-weight: inherit;
font-style: inherit;
font-size: 100%;
Expand Down Expand Up @@ -70,11 +75,6 @@ a.nav {
border-bottom: 1px solid #eee;
}

#source {
padding: 1em;
font-family: Consolas, "Liberation Mono", Menlo, Courier, monospace;
}

.indexfile #footer {
margin: 1em 3em;
}
Expand All @@ -97,7 +97,7 @@ a.nav {

/* Header styles */
#header .content {
padding: 1em 3em;
padding: 1em $left-gutter;
}

h1 {
Expand Down Expand Up @@ -235,131 +235,162 @@ h2.stats {
}

// Source file styles
.linenos p {
text-align: right;
margin: 0;
padding: 0 .5em;
color: #999999;
font-family: verdana, sans-serif;

&.highlight {
background: #ffdd00;
}
a {
text-decoration: none;
color: #999999;
font-size: .8333em; // 10/12
line-height: 1em;
&:hover {
text-decoration: underline;
color: #999999;
}
}
}

td.text {
width: 100%;
}

$hover-dark-amt: 95%;
$pln-hover-color: mix($pln-color, #000, $hover-dark-amt);
$mis-hover-color: mix($mis-color, #000, $hover-dark-amt);
$run-hover-color: mix($run-color, #000, $hover-dark-amt);
$exc-hover-color: mix($exc-color, #000, $hover-dark-amt);
$par-hover-color: mix($par-color, #000, $hover-dark-amt);
$border-indicator-width: .2em;

.text p {
margin: 0;
padding: 0 0 0 .5em;
border-left: 2px solid #ffffff;
white-space: pre;
position: relative;
#source {
padding: 1em 0 1em $left-gutter;
font-family: Consolas, "Liberation Mono", Menlo, Courier, monospace;

&:hover {
background: $pln-hover-color;
}
p {
/* position relative makes position:absolute pop-ups appear in the right place. */
position: relative;
white-space: pre;

.n {
float: left;
text-align: right;
width: $left-gutter;
box-sizing: border-box;
margin-left: -$left-gutter;
padding-right: 1em;
color: #999999;
font-family: verdana, sans-serif;

a {
text-decoration: none;
color: #999999;
font-size: .8333em; // 10/12
line-height: 1em;
&:hover {
text-decoration: underline;
color: #999999;
}
}
}

&.run {
border-left: 2px solid #00ff00;
&.show_run {
background: $run-color;
&.highlight .n {
background: #ffdd00;
}

.t {
display: inline-block;
width: 100%;
box-sizing: border-box;
margin-left: -.5em;
padding-left: .5em - $border-indicator-width;
border-left: $border-indicator-width solid white;

&:hover {
background: $run-hover-color;
background: $pln-hover-color;
}
// Syntax coloring
.com {
color: green;
font-style: italic;
line-height: 1px;
}
.key {
font-weight: bold;
line-height: 1px;
}
.str {
color: #000080;
}
}
}

&.mis {
border-left: 2px solid #ff0000;
&.show_mis {
background: $mis-color;
&.mis {
.t {
border-left: $border-indicator-width solid #ff0000;
}

&:hover {
background: $mis-hover-color;
&.show_mis .t {
background: $mis-color;

&:hover {
background: $mis-hover-color;
}
}
}
}

&.exc {
border-left: 2px solid #808080;
&.show_exc {
background: $exc-color;
&.run {
.t {
border-left: $border-indicator-width solid #00ff00;
}

&:hover {
background: $exc-hover-color;
&.show_run .t {
background: $run-color;

&:hover {
background: $run-hover-color;
}
}
}
}

&.par {
border-left: 2px solid #eeee99;
&.show_par {
background: $par-color;
&.exc {
.t {
border-left: $border-indicator-width solid #808080;
}

&:hover {
background: $par-hover-color;
&.show_exc .t {
background: $exc-color;

&:hover {
background: $exc-hover-color;
}
}
}
}
}

&.par {
.t {
border-left: $border-indicator-width solid #eeee99;
}

.text {
span.annotate {
font-family: georgia;
color: #666;
float: right;
padding-right: .5em;
display: none;
}
p.show_par span.annotate {
display: inline;
}
p.show_par span.annotate.long {
@extend %in-text-popup;
max-width: 50%;
width: 30em;
}
p.show_par:hover span.annotate.long {
display: block;
}
&.show_par .t {
background: $par-color;

// Syntax coloring
.com {
color: green;
font-style: italic;
line-height: 1px;
}
.key {
font-weight: bold;
line-height: 1px;
}
.str {
color: #000080;
&:hover {
background: $par-hover-color;
}
}

span.annotate {
&.short {
display: inline;
position: absolute;
right: 1.5em;
}

&.long {
@extend %in-text-popup;
max-width: 50%;
width: 30em;
right: 2.5em;
}
}

&:hover span.annotate.long {
display: block;
}
}


span.annotate {
font-family: georgia;
color: #666;
float: right;
padding-right: .5em;
}
}
}


// Line contexts
td.contexts {
p {
Expand Down

0 comments on commit bcbdf41

Please sign in to comment.