m/blog
1
0
Fork 0
mirror of https://github.com/kremalicious/blog.git synced 2024-12-23 01:30:01 +01:00
Code

nicer syntax highlighting

Browse Source
This commit is contained in:
Matthias Kretschmann 2015-07-26 21:41:59 +02:00 committed by $GIT_AUTHOR_NAME
parent a0ec225431
commit 35d9de9e69
4 changed files with 33 additions and 74 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
Gemfile
View File

@ -13,5 +13,5 @@ group :development do
gem 'rouge' gem 'rouge'
gem 'mini_magick' gem 'mini_magick'
gem 'fileutils' gem 'fileutils'
gem 'rb-gsl' gem 'gsl'
end end

14
_src/_assets/styl/code.styl
View File

@ -19,10 +19,11 @@ kbd
padding: 2px 4px padding: 2px 4px
code code
color: $code-color color: darken($code-color, 40%)
background-color: $code-bg background-color: rgba($code-bg, 10%)
border-radius: $border-radius-base border-radius: $border-radius-base
white-space: nowrap white-space: nowrap
word-wrap: normal
kbd kbd
color: $kbd-color color: $kbd-color
@ -32,11 +33,9 @@ kbd
pre pre
display: block display: block
padding: (($line-height-computed - 1) / 2) padding: 8px 12px
margin: 0 0 $line-height-computed margin: 0 0 $line-height-computed
line-height: $line-height-base line-height: $line-height-base
word-break: break-all
word-wrap: break-word
color: $code-color color: $code-color
background-color: $code-bg background-color: $code-bg
border-radius: $border-radius-base border-radius: $border-radius-base
@ -46,12 +45,15 @@ pre
-webkit-overflow-scrolling: touch -webkit-overflow-scrolling: touch
max-height: 300px max-height: 300px
@media $breakpoint2
max-height: 500px
// Account for some code outputs that place code tags in pre tags // Account for some code outputs that place code tags in pre tags
code code
padding: 0 padding: 0
font-size: inherit font-size: inherit
color: inherit color: inherit
white-space: pre-wrap white-space: pre
background-color: transparent background-color: transparent
border-radius: 0 border-radius: 0

87
_src/_assets/styl/syntax.styl
View File

@ -1,66 +1,23 @@
//
// Colorful
// https://github.com/richleland/pygments-css
//
.highlight .hll { background-color: #ffffcc } .highlight code, .highlight pre{color:$code-color;background-color:$code-bg}
.highlight .c { color: #808080 } /* Comment */
.highlight .err { color: #F00000; background-color: #F0A0A0 } /* Error */ .highlight .hll { background-color: #ffc; }
.highlight .k { color: #008000; font-weight: bold } /* Keyword */ .highlight .gd { color: #2e3436; background-color: #0e1416; }
.highlight .o { color: #303030 } /* Operator */ .highlight .gr { color: #eeeeec; background-color: #c00; }
.highlight .cm { color: #808080 } /* Comment.Multiline */ .highlight .gi { color: #babdb6; background-color: #1f2b2d; }
.highlight .cp { color: #507090 } /* Comment.Preproc */ .highlight .go { color: #2c3032; background-color: #2c3032; }
.highlight .c1 { color: #808080 } /* Comment.Single */ .highlight .kt { color: #e3e7df; }
.highlight .cs { color: #cc0000; font-weight: bold } /* Comment.Special */ .highlight .ni { color: #888a85; }
.highlight .gd { color: #A00000 } /* Generic.Deleted */ .highlight .c,.highlight .cm,.highlight .c1,.highlight .cs { color: #8D9684; }
.highlight .ge { font-style: italic } /* Generic.Emph */ .highlight .err,.highlight .g,.highlight .l,.highlight .n,.highlight .x,.highlight .p,.highlight .ge,
.highlight .gr { color: #FF0000 } /* Generic.Error */ .highlight .gp,.highlight .gs,.highlight .gt,.highlight .ld,.highlight .s,.highlight .nc,.highlight .nd,
.highlight .gh { color: #000080; font-weight: bold } /* Generic.Heading */ .highlight .ne,.highlight .nl,.highlight .nn,.highlight .nx,.highlight .py,.highlight .ow,.highlight .w,.highlight .sb,
.highlight .gi { color: #00A000 } /* Generic.Inserted */ .highlight .sc,.highlight .sd,.highlight .s2,.highlight .se,.highlight .sh,.highlight .si,.highlight .sx,.highlight .sr,
.highlight .go { color: #808080 } /* Generic.Output */ .highlight .s1,.highlight .ss,.highlight .bp { color: #C1C2C3; }
.highlight .gp { color: #c65d09; font-weight: bold } /* Generic.Prompt */ .highlight .k,.highlight .kc,.highlight .kd,.highlight .kn,.highlight .kp,.highlight .kr,
.highlight .gs { font-weight: bold } /* Generic.Strong */ .highlight .nt { color: #729fcf; }
.highlight .gu { color: #800080; font-weight: bold } /* Generic.Subheading */ .highlight .cp,.highlight .gh,.highlight .gu,.highlight .na,.highlight .nf { color: #E9A94B ; }
.highlight .gt { color: #0040D0 } /* Generic.Traceback */ .highlight .m,.highlight .nb,.highlight .no,.highlight .mf,.highlight .mh,.highlight .mi,.highlight .mo,
.highlight .kc { color: #008000; font-weight: bold } /* Keyword.Constant */ .highlight .il { color: #8ae234; }
.highlight .kd { color: #008000; font-weight: bold } /* Keyword.Declaration */ .highlight .o { color: #989DAA; }
.highlight .kn { color: #008000; font-weight: bold } /* Keyword.Namespace */ .highlight .nv,.highlight .vc,.highlight .vg,.highlight .vi { color: #fff; }
.highlight .kp { color: #003080; font-weight: bold } /* Keyword.Pseudo */
.highlight .kr { color: #008000; font-weight: bold } /* Keyword.Reserved */
.highlight .kt { color: #303090; font-weight: bold } /* Keyword.Type */
.highlight .m { color: #6000E0; font-weight: bold } /* Literal.Number */
.highlight .s { background-color: #fff0f0 } /* Literal.String */
.highlight .na { color: #0000C0 } /* Name.Attribute */
.highlight .nb { color: #007020 } /* Name.Builtin */
.highlight .nc { color: #B00060; font-weight: bold } /* Name.Class */
.highlight .no { color: #003060; font-weight: bold } /* Name.Constant */
.highlight .nd { color: #505050; font-weight: bold } /* Name.Decorator */
.highlight .ni { color: #800000; font-weight: bold } /* Name.Entity */
.highlight .ne { color: #F00000; font-weight: bold } /* Name.Exception */
.highlight .nf { color: #0060B0; font-weight: bold } /* Name.Function */
.highlight .nl { color: #907000; font-weight: bold } /* Name.Label */
.highlight .nn { color: #0e84b5; font-weight: bold } /* Name.Namespace */
.highlight .nt { color: #007000 } /* Name.Tag */
.highlight .nv { color: #906030 } /* Name.Variable */
.highlight .ow { color: #000000; font-weight: bold } /* Operator.Word */
.highlight .w { color: #bbbbbb } /* Text.Whitespace */
.highlight .mf { color: #6000E0; font-weight: bold } /* Literal.Number.Float */
.highlight .mh { color: #005080; font-weight: bold } /* Literal.Number.Hex */
.highlight .mi { color: #0000D0; font-weight: bold } /* Literal.Number.Integer */
.highlight .mo { color: #4000E0; font-weight: bold } /* Literal.Number.Oct */
.highlight .sb { background-color: #fff0f0 } /* Literal.String.Backtick */
.highlight .sc { color: #0040D0 } /* Literal.String.Char */
.highlight .sd { color: #D04020 } /* Literal.String.Doc */
.highlight .s2 { background-color: #fff0f0 } /* Literal.String.Double */
.highlight .se { color: #606060; font-weight: bold; background-color: #fff0f0 } /* Literal.String.Escape */
.highlight .sh { background-color: #fff0f0 } /* Literal.String.Heredoc */
.highlight .si { background-color: #e0e0e0 } /* Literal.String.Interpol */
.highlight .sx { color: #D02000; background-color: #fff0f0 } /* Literal.String.Other */
.highlight .sr { color: #000000; background-color: #fff0ff } /* Literal.String.Regex */
.highlight .s1 { background-color: #fff0f0 } /* Literal.String.Single */
.highlight .ss { color: #A06000 } /* Literal.String.Symbol */
.highlight .bp { color: #007020 } /* Name.Builtin.Pseudo */
.highlight .vc { color: #306090 } /* Name.Variable.Class */
.highlight .vg { color: #d07000; font-weight: bold } /* Name.Variable.Global */
.highlight .vi { color: #3030B0 } /* Name.Variable.Instance */
.highlight .il { color: #0000D0; font-weight: bold } /* Literal.Number.Integer.Long */

4
_src/_assets/styl/variables.styl
View File

@ -138,8 +138,8 @@ $input-height-small = (floor($font-size-small * $line-height-small) + ($
// Code // Code
///////////////////////////////////// /////////////////////////////////////
$code-bg = rgba(255,255,255,.8) $code-bg = #343642
$code-color = $text-color $code-color = #C1C2C3
$kbd-bg = $code-bg $kbd-bg = $code-bg
$kbd-color = $code-color $kbd-color = $code-color