Mercurial > hg
changeset 26670:ab2cd800f1b0
gitweb: visually highlight source lines when hovering over line numbers
Due to how the line links now reside outside of the source lines, hovering over
line numbers doesn't count as hovering over the appropriate source line. It can
be worked around by using a "+" css selector. However, it's necessary to
reorder the elements and put <a> before <span> (which is actually quite
logical). It works without further css tweaks because <a> is already
absolute-positioned and so the order doesn't matter visually.
author | Anton Shestakov <av6@dwimlabs.net> |
---|---|
date | Thu, 15 Oct 2015 00:04:58 +0800 |
parents | 07db7e95c464 |
children | 66dc39cd7d06 |
files | mercurial/templates/gitweb/map mercurial/templates/static/style-gitweb.css tests/test-hgweb.t |
diffstat | 3 files changed, 18 insertions(+), 12 deletions(-) [+] |
line wrap: on
line diff
--- a/mercurial/templates/gitweb/map Tue Oct 13 14:17:15 2015 -0700 +++ b/mercurial/templates/gitweb/map Thu Oct 15 00:04:58 2015 +0800 @@ -93,7 +93,7 @@ filecomparison = filecomparison.tmpl filelog = filelog.tmpl fileline = ' - <span id="{lineid}">{strip(line|escape, '\r\n')}</span><a href="#{lineid}"></a>' + <a href="#{lineid}"></a><span id="{lineid}">{strip(line|escape, '\r\n')}</span>' annotateline = ' <tr id="{lineid}" style="font-family:monospace" class="parity{parity}"> <td class="linenr" style="text-align: right;"> @@ -104,13 +104,13 @@ <td><pre>{line|escape}</pre></td> </tr>' difflineplus = ' - <span id="{lineid}" class="difflineplus">{strip(line|escape, '\r\n')}</span><a href="#{lineid}"></a>' + <a href="#{lineid}"></a><span id="{lineid}" class="difflineplus">{strip(line|escape, '\r\n')}</span>' difflineminus = ' - <span id="{lineid}" class="difflineminus">{strip(line|escape, '\r\n')}</span><a href="#{lineid}"></a>' + <a href="#{lineid}"></a><span id="{lineid}" class="difflineminus">{strip(line|escape, '\r\n')}</span>' difflineat = ' - <span id="{lineid}" class="difflineat">{strip(line|escape, '\r\n')}</span><a href="#{lineid}"></a>' + <a href="#{lineid}"></a><span id="{lineid}" class="difflineat">{strip(line|escape, '\r\n')}</span>' diffline = ' - <span id="{lineid}">{strip(line|escape, '\r\n')}</span><a href="#{lineid}"></a>' + <a href="#{lineid}"></a><span id="{lineid}">{strip(line|escape, '\r\n')}</span>' comparisonblock =' <tbody class="block">
--- a/mercurial/templates/static/style-gitweb.css Tue Oct 13 14:17:15 2015 -0700 +++ b/mercurial/templates/static/style-gitweb.css Thu Oct 15 00:04:58 2015 +0800 @@ -29,9 +29,12 @@ a.list:hover { text-decoration:underline; color:#880000; } table { padding:8px 4px; } th { padding:2px 5px; font-size:12px; text-align:left; } -tr.light:hover, .parity0:hover, pre.sourcelines.stripes > :nth-child(4n+1):hover { background-color:#edece6; } -tr.dark, .parity1, pre.sourcelines.stripes > :nth-child(4n+3) { background-color:#f6f6f0; } -tr.dark:hover, .parity1:hover, pre.sourcelines.stripes > :nth-child(4n+3):hover { background-color:#edece6; } +tr.dark, .parity1, pre.sourcelines.stripes > :nth-child(4n+4) { background-color:#f6f6f0; } +tr.light:hover, .parity0:hover, tr.dark:hover, .parity1:hover, +pre.sourcelines.stripes > :nth-child(4n+2):hover, +pre.sourcelines.stripes > :nth-child(4n+4):hover, +pre.sourcelines.stripes > :nth-child(4n+1):hover + :nth-child(4n+2), +pre.sourcelines.stripes > :nth-child(4n+3):hover + :nth-child(4n+4) { background-color:#edece6; } td { padding:2px 5px; font-size:12px; vertical-align:top; } td.closed { background-color: #99f; } td.link { padding:2px 5px; font-family:sans-serif; font-size:10px; }
--- a/tests/test-hgweb.t Tue Oct 13 14:17:15 2015 -0700 +++ b/tests/test-hgweb.t Thu Oct 15 00:04:58 2015 +0800 @@ -340,7 +340,7 @@ $ get-with-headers.py --twice localhost:$HGPORT 'static/style-gitweb.css' - date etag server 200 Script output follows - content-length: 6412 + content-length: 6521 content-type: text/css body { font-family: sans-serif; font-size: 12px; border:solid #d9d8d1; border-width:1px; margin:10px; background: white; color: black; } @@ -374,9 +374,12 @@ a.list:hover { text-decoration:underline; color:#880000; } table { padding:8px 4px; } th { padding:2px 5px; font-size:12px; text-align:left; } - tr.light:hover, .parity0:hover, pre.sourcelines.stripes > :nth-child(4n+1):hover { background-color:#edece6; } - tr.dark, .parity1, pre.sourcelines.stripes > :nth-child(4n+3) { background-color:#f6f6f0; } - tr.dark:hover, .parity1:hover, pre.sourcelines.stripes > :nth-child(4n+3):hover { background-color:#edece6; } + tr.dark, .parity1, pre.sourcelines.stripes > :nth-child(4n+4) { background-color:#f6f6f0; } + tr.light:hover, .parity0:hover, tr.dark:hover, .parity1:hover, + pre.sourcelines.stripes > :nth-child(4n+2):hover, + pre.sourcelines.stripes > :nth-child(4n+4):hover, + pre.sourcelines.stripes > :nth-child(4n+1):hover + :nth-child(4n+2), + pre.sourcelines.stripes > :nth-child(4n+3):hover + :nth-child(4n+4) { background-color:#edece6; } td { padding:2px 5px; font-size:12px; vertical-align:top; } td.closed { background-color: #99f; } td.link { padding:2px 5px; font-family:sans-serif; font-size:10px; }