less: make pull request 'next iteration' changeset table smaller and scrollable

This property was lost in 88ce09daea37.

When the whole list is made scrollable, the graph can no longer be positioned
absolute. Instead, make it relative so it scrolls with the content ... and 0
height (with the graph overflowing) so the table content will be shown next to
the overflowing graph.

less: disable blue outline in navbar when tabbing through the entries in the top navbar in Chrome

Bootstrap has

a:focus { outline: 5px auto -webkit-focus-ring-color; }

which (inconsistently) puts a blue outline that doesn't match the color scheme.

For now, just disable it in the navbar.

less: remove horizontal separator lines between settings groups

The separator lines are not necessary - the hanging indentation label should be
enough.

less: only override Bootstrap default styling of pre where it really is needed

Bootstrap changes the styling of pre, even without special classes.

Thus, override the bootstrap default styling in a less broad manner.

The only thing that really needs to be changed is the border, margin, padding
and the background for the code diffs.

less: change markup and styling for the logo shown in the top left corner

Based on work by Dominik Ruf, but in this changeset, the goal is just to
improve markup and styling while keeping exactly the same look and feel. In
that process, it also fixes some browser specific issues that gave odd
spacing/positioning.

All styling (especially the logo image URL) is moved to CSS/LESS, using
background-image styling instead of an img tag.

The logo image is made a :before on the site branding text and will usually
have to align with this text, so we use inline-block to align to the baseline.

We set the right amount of negative margin-bottom so the image can go below the
baseline.

We use a "big enough" negative margin-top to allow the image to bleed outside
the line height and into the 12px top padding.

We assume the background image doesn't need cropping or panning and do thus not
set background-size, background-position, or background-repeat.

less: move non-generated parts of pygments.css to less file

The remaining parts of pygments.css can be generated with:

pygmentize -S default -f html | sed 's/^\(.*\) { /.code-highlight \1, .codehilite \1 { /g' > kallithea/public/css/pygments.css

less: move non contextbar specific style to kallithea.less

Also this is only relevant for icon-empty and icon-gravatar.

less: use bootstrap default font

I think it looks much better.

less: use same color for spaces characters

The light ones were barely visible and the others looked almost like normal
characters.
Also be more explicit and use border-color instead of color.

less: simplify positioning of the +/- symbols on diff lines

As before, we place the +/- symbols in the pre:before so they default to the
same font and styling as the line content.

Instead of giving the pre a wide left margin and put the :before out there
using negative positing and visible overflow, just give the :before a fixed
width on all lines.

This change has been modified by Mads Kiilerich.

less: clean up pull request style

- remove unnecessary float: left for .reviewer_status
- remove unnecessary height and padding for .reviewers_member
- there is no .email_entry, .ip_entry, .pullrequests_section_head, .pr-desc
- remove unnecessary margin for .msg-div

less: remove dead styling of #content content

- there is no table .selected
- there is no .ui-selectmenu or .ui-selectmenu-focus

less: add comment for statistics charts and simplify selector

In case we decide to change the element type, make the selector more generic.

less: clean up statistics style

- #legend_data default padding is fine
- #legend_container border: none is unnecessary
- #legend_choices is invisible
- #legend_container width: auto is unnecessary
- with many commiters less padding and height is actually better
- there is no .legend ul

less: clean up .code-browser style

- remove unnecessary style
- use default table heading style
- move icon spacing style to separate block

less: textareas should be at least 100px high and 400px wide

Smaller textareas look odd.

less: drop special summary style

- remove special margin
- use the same style for all descriptions (same as .formatted-fixed)
- there is no #content div.panel #summary p

less: remove .readme style

I think the new bootstrap default actually looks better.

less: remove unnecessary repo size styling

- empty badges are already hidden
- the badge style overrides the padding anyway

less: simplify .expand_commit selector

also
- remove unnecessary width style
- move to separate block and add comment

less: clean up lang_stats style

- remove background-color bootstrap already uses @brand-primary
- text-decoration: none is unnecessary
- move to separate block and add comment

less: use default datatable header (without) background color

This has a better, cleaner look.

less: remove .reviewer_ac

It has nothing to do with reviewers or autocomplete and the 'padding: 10px'
does not improve the style.

less: remove unnecessary table pre style

difftable code stuff is already set in kallithea-diff.less

less: remove unused table column styling

I could not find a place where these are used.

less: change diff-actions coloring

<a> already use @brand-primary color and I think it is actually beneficial if
the two other non-link elements look a bit different. (blackish default
.panel-heading color)

The two non-link elements thus already have a different non-link look and don't
need the opacity.

less: don't override default label font-weight

Bootstrap makes it bold by default. Use that so we don't have to specify bold when we need it.

The places where we don't want bold, the styling must be overridden.

less: remove dead traffic styling

There is no .traffic class. It was apparently once a name for the repo
statistics.

less: remove vertical-align: inherit for .radio-inline and .checkbox-inline

The effect is minimal and I'd argue it looks even a little bit better without it.

less: stick with the default of no shadow in navbar

And .icon is a span now, so display: inline has no effect

less: use more generic selector for formatted-fixed

Why should this only be usable on <div>!

Also add comment.

less: remove weird .anchor style

I see no point in this.

less: simplify permalink style

- 'position: absolute' and 'margin: 3px 4px;' make it actually look worse
- 'text-decoration: none' is already set on all <a>
- we only use it in one place so the selector can be simplified

Also add comment.

less: remove line-through for <del>

- line-through makes it hard to read
- since the text is already red it is kinda redundant
- it gets overriden by kallithea-diff.less line 87 anyway

less: remove unnecessary diff table style in kallithea-diff.less

I see no place where these are necessary - probably because Bootstrap styling.

less: remove unnecessary width 100% for diff code

table.code-difftable already has width: 100%

diff: use fontello icon-diff-* names in generated html

This way we need less style code ... but generate slightly bigger html.

Also move the style code to kallithea-diff.less and remove the now obsolete
comment.

templates: change .node elements to <span>

This way we don't need to make them 'float: left'

less: remove unused .code-difftable .code td styling

Every place I found .code was set to th <td> so this is dead code.

less: clean up unnecessary diff line-no styling

- less spacing still leave room to show the comment bubble with hiding the line number
- looks good w/o letter-spacing
- bootstrap already sets box-sizing: border-box;
- it is a <a> no need for cursor: pointer
- width: 100% makes no difference

less: remove unnecessary .cur_cs

The class is only used once on a h6, which already is bold and has top and
bottom 10px margin. The 2px margin left and right are not really helpful.

less: tag style should always apply not only if placed inside .right element

Besides, .right is no longer used.

less: add hint about how to generate css from less files

In case somebody opens the css file to make some changes, he will see this
message on how to use less instead of editing the css files.

less: fix displaying +/- signs in code-difftable

35d3a85fc650 introduced the Bootstrap default overflow:auto styling of pre.
That made overflow hidden instead of visible, and thus broke our display of +/-
as a :before with relative positioning outside the pre.

To undo that, add overflow to the list of Bootstrap pre styling we override.

Based on another fix by Dominik Ruf.

style: move perm_tag to kallithea-tags.less

Also move these styles in the original style.css to make the delta again
zero.

style: less'en select2 styles

Some steps towards the version of kallithea-select2.less prepared by Dominik
Ruf.

style: change indentation of stylesheet to match future less output

Align the indentation of the stylesheet with the indentation that a
less-compiled version of this stylesheet would use. This will allow easy
comparison of the original and less-generated stylesheet in future commits.

style: remove empty lines in stylesheet to match future less output

Align the formatting of the stylesheet with the formatting that a less-compiled
version of this stylesheet would use. This will allow easy comparison of the
original and less-generated stylesheet in future commits.

style: fix formatting oddities and bugs

This will also align the formatting of the stylesheet with the indentation that
a less-compiled version of this stylesheet would use. This will allow easier
comparison of the original and less-generated stylesheet in future commits.

style: be consistent and don't use col-*-* classes

In order to not show overlap the lock icon also change its positioning style.

navbar: use Bootstrap 'caret' class instead of our own 'navbar-caret'

This mostly reverses e075f2cc4f8c - now we use so much Bootstrap that it no
longer is an issue.

Note: This icon is smaller than the old one.

style: consistently use 'changeset_hash' class for monospace hashes

Get rid of 'revision-link' and some use of 'hash'.

There is still some use of 'hash' for columns, but the content there already
has 'changeset_hash'.

changelog: update styling - don't restrict styling to graph when it is all for all changelog views

Be more specific when styling applies to all table#changesets or to columns in it.

changelog: avoid cutting off commit messages

Split commit message into 2 <div> elements: one with just the first line, and
one with the full message. This makes it easier to handle the toggling of
showing the whole commit message. This way, we no longer have to mess with the
line height, and we avoid problems with cutting off parts of the text below the
text baseline.

Also stop cutting off the first line if it is too long for the table column.

It adds a bit of overhead to store the first line twice, but having them
separate make things simpler and is worth it.

Patch modified by Mads Kiilerich.

changelog: fix column sizing - don't expand the date column but give everything to the description column

The date column inherited 33% width - for now, just work around that.

changelog: dim the whole row for changesets that are merges or out of range

Backout b99cd2bc7540 - we can do that after 2f35bd7b97aa moved the tooltips so
they don't inherit opacity any more.

templates: don't abuse elements as links or buttons

Bootstrap recommends using <button>, so most of the time we should use that.

Except if we don't want the additional padding of a button (like for the expand
'button' on the changelog page).

style: rely on css to truncate author name in tables instead of truncating to fixed length

Dynamic truncation allows us in the future to use different length on different
screen sizes.

statistics: make statistics view work again

88ce09daea37 removed sizing of the graph, causing Flot javascript to fail
without showing anything.

comments: display comment previews while submitting

Instead of just saying 'Submitting' and not showing any progress to
the user until the comment has been accepted by the server, show a
preview of the comment above the comment box in a way which is makes
it obvious to the user the comment is being submitted. Apart from
that, also clear the comment box so that a repeated clicking the
submit button doesn't result in a duplicate comment.

The preview doesn't highlight URLs or support @mentions or *bold*,
which is a good enough approximation in this case. When/if we (re-)add
the rST/Markdown support, we will need a client-side parser for the
syntax we choose.

When the submission fails, display a message and offer the user to
retry or cancel the submission.

templates: drop odd grid_edit and grid_delete classes

We really should have both buttons inside the same float-left so they get
proper spacing ... but that doesn't work when one is wrapped in a form ...

autocompletion: drop explicit container elements - just create them when necessary

The previous wide styling of the @mention selection list didn't look pretty -
just use the default width.

Inspired by select2 port by Dominik Ruf.

changeset: use bootstrap label instead of custom css

Also replace old .right with .pull-right for correct floating.

templates: make gist edit and new page look more similar

- remove gravatar from edit page
- add no-padding to edit page
- use the same order and alignment of the mimetype and filename elements on both pages

template: simplify journal styling

This requires less css code.

style: fix display of the PR graph of changesets available for update

88ce09daea37 dropped explicit html styling - fix it by adding css styling.