comparison mercurial/templates/static/style-paper.css @ 31758:04ec317b8128

hgweb: expose a followlines UI in filerevision view

In filerevision view (/file/<rev>/<fname>) we add some event listeners on
mouse clicks of <span> elements in the <pre class="sourcelines"> block.
Those listeners will capture a range of lines selected between two mouse
clicks and a box inviting to follow the history of selected lines will then
show up. Selected lines (i.e. the block of lines) get a CSS class which make
them highlighted. Selection can be cancelled (and restarted) by either
clicking on the cancel ("x") button in the invite box or clicking on any other
source line. Also clicking twice on the same line will abort the selection and
reset event listeners to restart the process.

As a first step, this action is only advertised by the "cursor: cell" CSS rule
on source lines elements as any other mechanisms would make the code
significantly more complicated. This might be improved later.

All JavaScript code lives in a new "linerangelog.js" file, sourced in
filerevision template (only in "paper" style for now).

31757:473f2fcc7629

.sourcelines > span:target, tr:target td {
  background-color: #bfdfff;
}

.sourcelines > a {
    display: inline-block;
    position: absolute;
    left: 0px;
    width: 4em;

31758:04ec317b8128

.sourcelines > span:target, tr:target td {
  background-color: #bfdfff;
}

div.overflow pre.sourcelines > span:hover {
  cursor: cell;
}

pre.sourcelines > span.followlines-selected {
  background-color: #99C7E9;
}

div#followlines {
  background-color: #B7B7B7;
  border: 1px solid #CCC;
  border-radius: 5px;
  padding: 4px;
  position: absolute;
}

div.followlines-cancel {
  text-align: right;
}

div.followlines-cancel > button {
  line-height: 80%;
  padding: 0;
  border: 0;
  border-radius: 2px;
  background-color: inherit;
  font-weight: bold;
}

div.followlines-cancel > button:hover {
  color: #FFFFFF;
  background-color: #CF1F1F;
}

div.followlines-link {
  margin: 2px;
  margin-top: 4px;
  font-family: sans-serif;
}

.sourcelines > a {
    display: inline-block;
    position: absolute;
    left: 0px;
    width: 4em;