steffen/website
1
0
Fork 0
Code Actions Packages Releases Activity

Improve syntax highlighting styles (#1450)

Browse Source 
* Cleanup syntax highlighting styles
* Replace hardcoded color values with [base16](http://chriskempson.com/projects/base16/) Sass variables
* Harmonize padding between GFM code blocks and `{% highlight %}` code blocks
*  Improve readability of line numbers
* Add longer code block example to test double digit line numbers
* Adjust code block colors for specific skins
This commit is contained in:
Michael Rose
2018-01-04 20:46:10 -05:00
committed by GitHub
parent 94d753378a
commit 3f469f268f
10 changed files with 535 additions and 340 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
_sass/minimal-mistakes/skins/_contrast.scss
View File

@@ -13,6 +13,24 @@ $masthead-link-color: $text-color !default;
$masthead-link-color-hover: $text-color !default;
$navicon-link-color-hover: mix(#fff, $text-color, 80%) !default;
/* contrast syntax highlighting (base16) */
$base00: #000000 !default;
$base01: #242422 !default;
$base02: #484844 !default;
$base03: #6c6c66 !default;
$base04: #918f88 !default;
$base05: #b5b3aa !default;
$base06: #d9d7cc !default;
$base07: #fdfbee !default;
$base08: #ff6c60 !default;
$base09: #e9c062 !default;
$base0a: #ffffb6 !default;
$base0b: #a8ff60 !default;
$base0c: #c6c5fe !default;
$base0d: #96cbfe !default;
$base0e: #ff73fd !default;
$base0f: #b18a3d !default;
.page__content {
.notice,
.notice--primary,

18
_sass/minimal-mistakes/skins/_dark.scss
View File

@@ -18,6 +18,24 @@ $masthead-link-color: $text-color !default;
$masthead-link-color-hover: mix(#000, $text-color, 20%) !default;
$navicon-link-color-hover: mix(#000, $background-color, 30%) !default;
/* dark syntax highlighting (base16) */
$base00: #ffffff !default;
$base01: #e0e0e0 !default;
$base02: #d0d0d0 !default;
$base03: #b0b0b0 !default;
$base04: #000000 !default;
$base05: #101010 !default;
$base06: #151515 !default;
$base07: #202020 !default;
$base08: #ff0086 !default;
$base09: #fd8900 !default;
$base0a: #aba800 !default;
$base0b: #00c918 !default;
$base0c: #1faaaa !default;
$base0d: #3777e6 !default;
$base0e: #ad00a1 !default;
$base0f: #cc6633 !default;
.page__footer-follow .social-icons .svg-inline--fa {
color: inherit;
}

20
_sass/minimal-mistakes/skins/_dirt.scss
View File

@@ -12,4 +12,22 @@ $footer-background-color: #e9dcbe !default;
$link-color: #343434 !default;
$masthead-link-color: $text-color !default;
$masthead-link-color-hover: $text-color !default;
$navicon-link-color-hover: mix(#fff, $text-color, 80%) !default;
$navicon-link-color-hover: mix(#fff, $text-color, 80%) !default;
/* dirt syntax highlighting (base16) */
$base00: #231e18 !default;
$base01: #302b25 !default;
$base02: #48413a !default;
$base03: #9d8b70 !default;
$base04: #b4a490 !default;
$base05: #cabcb1 !default;
$base06: #d7c8bc !default;
$base07: #e4d4c8 !default;
$base08: #d35c5c !default;
$base09: #ca7f32 !default;
$base0a: #e0ac16 !default;
$base0b: #b7ba53 !default;
$base0c: #6eb958 !default;
$base0d: #88a4d3 !default;
$base0e: #bb90e2 !default;
$base0f: #b49368 !default;

18
_sass/minimal-mistakes/skins/_neon.scss
View File

@@ -18,6 +18,24 @@ $masthead-link-color: $text-color !default;
$masthead-link-color-hover: mix(#000, $text-color, 20%) !default;
$navicon-link-color-hover: mix(#000, $background-color, 30%) !default;
/* neon syntax highlighting (base16) */
$base00: #ffffff !default;
$base01: #e0e0e0 !default;
$base02: #d0d0d0 !default;
$base03: #b0b0b0 !default;
$base04: #000000 !default;
$base05: #101010 !default;
$base06: #151515 !default;
$base07: #202020 !default;
$base08: #ff0086 !default;
$base09: #fd8900 !default;
$base0a: #aba800 !default;
$base0b: #00c918 !default;
$base0c: #1faaaa !default;
$base0d: #3777e6 !default;
$base0e: #ad00a1 !default;
$base0f: #cc6633 !default;
.author__urls.social-icons .fa,
.page__footer-follow .social-icons .svg-inline--fa {
color: inherit;

18
_sass/minimal-mistakes/skins/_plum.scss
View File

@@ -18,6 +18,24 @@ $masthead-link-color: $text-color !default;
$masthead-link-color-hover: mix(#000, $text-color, 20%) !default;
$navicon-link-color-hover: mix(#000, $background-color, 30%) !default;
/* plum syntax highlighting (base16) */
$base00: #ffffff !default;
$base01: #e0e0e0 !default;
$base02: #d0d0d0 !default;
$base03: #b0b0b0 !default;
$base04: #000000 !default;
$base05: #101010 !default;
$base06: #151515 !default;
$base07: #202020 !default;
$base08: #ff0086 !default;
$base09: #fd8900 !default;
$base0a: #aba800 !default;
$base0b: #00c918 !default;
$base0c: #1faaaa !default;
$base0d: #3777e6 !default;
$base0e: #ad00a1 !default;
$base0f: #cc6633 !default;
.author__urls.social-icons .fa,
.page__footer-follow .social-icons .svg-inline--fa {
color: inherit;

18
_sass/minimal-mistakes/skins/_sunrise.scss
View File

@@ -20,6 +20,24 @@ $masthead-link-color: $text-color !default;
$masthead-link-color-hover: mix(#000, $text-color, 20%) !default;
$navicon-link-color-hover: mix(#000, $background-color, 30%) !default;
/* sunrise syntax highlighting (base16) */
$base00: #1d1f21 !default;
$base01: #282a2e !default;
$base02: #373b41 !default;
$base03: #969896 !default;
$base04: #b4b7b4 !default;
$base05: #c5c8c6 !default;
$base06: #e0e0e0 !default;
$base07: #ffffff !default;
$base08: #cc6666 !default;
$base09: #de935f !default;
$base0a: #f0c674 !default;
$base0b: #b5bd68 !default;
$base0c: #8abeb7 !default;
$base0d: #81a2be !default;
$base0e: #b294bb !default;
$base0f: #a3685a !default;
.author__urls.social-icons .fa,
.page__footer-follow .social-icons .svg-inline--fa {
color: inherit;