Improve styling of {% highlight %} tag code blocks

- Fix alignment in issues in Firefox
- Remove table borders from `linenos`
- Harmonize padding and font-sizes
- Close #513 and close #512
This commit is contained in:
Michael Rose 2016-09-09 09:58:27 -04:00
parent 0c2d3bbb9f
commit 3c034e59f4

View file

@ -2,9 +2,13 @@
Syntax highlighting
========================================================================== */
div.highlighter-rouge, figure.highlight {
div.highlighter-rouge,
figure.highlight {
position: relative;
margin-bottom: 1em;
font-family: $monospace;
font-size: $type-size-7;
line-height: 1.8;
border: 1px solid $border-color;
border-radius: $border-radius;
background-color: $code-background-color;
@ -18,7 +22,6 @@ div.highlighter-rouge, figure.highlight {
background-color: $lighter-gray;
content: "\f121";
font-family: "fontawesome" !important;
font-size: $type-size-6;
line-height: 1;
text-transform: none;
speak: none;
@ -27,15 +30,35 @@ div.highlighter-rouge, figure.highlight {
.highlight {
margin: 0;
padding: 1em;
font-family: $monospace;
font-size: $type-size-7;
line-height: 1.8;
}
}
.highlight table td { padding: 5px; }
.highlight table pre { margin: 0; }
figure.highlight {
padding-left: 1em;
padding-right: 1em;
}
.highlight table {
font-size: 1em;
border: 0;
td {
padding: 5px;
border: 0;
// line numbers
&.gutter {
padding-right: 1em;
color: $light-gray;
}
}
pre {
margin: 0;
}
}
.highlight pre { width: 100%; }
/*
Solarized Light