From 7afdd57c8a84d3d7ee1cf673c4eaf7b37af7e77b Mon Sep 17 00:00:00 2001 From: Michael Rose Date: Fri, 20 Oct 2017 15:54:43 -0400 Subject: [PATCH] Adjust syntax highlighted code blocks padding Rouge 2 adds `
` to markup which can introducing styling defects like extra padding. --- CHANGELOG.md | 1 + _sass/minimal-mistakes/_syntax.scss | 280 +++++++++++++++++------ docs/_docs/18-history.md | 3 +- docs/_sass/minimal-mistakes/_syntax.scss | 280 +++++++++++++++++------ 4 files changed, 423 insertions(+), 141 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 2263f141..7cc6da64 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -15,6 +15,7 @@ ### Bug Fixes - Fix system font rendering in Chrome on macOS/OS X. [#1290](https://github.com/mmistakes/minimal-mistakes/pull/1290) +- Fix extra padding in syntax highlighted code blocks due to Rouge 2 adding `
` to markup. ## [4.6.0](https://github.com/mmistakes/minimal-mistakes/releases/tag/4.6.0) diff --git a/_sass/minimal-mistakes/_syntax.scss b/_sass/minimal-mistakes/_syntax.scss index e7a75540..cb4a9710 100644 --- a/_sass/minimal-mistakes/_syntax.scss +++ b/_sass/minimal-mistakes/_syntax.scss @@ -27,7 +27,7 @@ figure.highlight { speak: none; } - .highlight { + pre.highlight { margin: 0; padding: 1em; } @@ -58,7 +58,9 @@ figure.highlight { } } -.highlight pre { width: 100%; } +.highlight pre { + width: 100%; +} /* Solarized Light @@ -76,71 +78,209 @@ figure.highlight { green #859900 operators, other keywords ========================================================================== */ -.highlight .c { color: #93a1a1 } /* Comment */ -.highlight .err { color: #586e75 } /* Error */ -.highlight .g { color: #586e75 } /* Generic */ -.highlight .k { color: #859900 } /* Keyword */ -.highlight .l { color: #586e75 } /* Literal */ -.highlight .n { color: #586e75 } /* Name */ -.highlight .o { color: #859900 } /* Operator */ -.highlight .x { color: #cb4b16 } /* Other */ -.highlight .p { color: #586e75 } /* Punctuation */ -.highlight .cm { color: #93a1a1 } /* Comment.Multiline */ -.highlight .cp { color: #859900 } /* Comment.Preproc */ -.highlight .c1 { color: #93a1a1 } /* Comment.Single */ -.highlight .cs { color: #859900 } /* Comment.Special */ -.highlight .gd { color: #2aa198 } /* Generic.Deleted */ -.highlight .ge { color: #586e75; font-style: italic } /* Generic.Emph */ -.highlight .gr { color: #dc322f } /* Generic.Error */ -.highlight .gh { color: #cb4b16 } /* Generic.Heading */ -.highlight .gi { color: #859900 } /* Generic.Inserted */ -.highlight .go { color: #586e75 } /* Generic.Output */ -.highlight .gp { color: #586e75 } /* Generic.Prompt */ -.highlight .gs { color: #586e75; font-weight: bold } /* Generic.Strong */ -.highlight .gu { color: #cb4b16 } /* Generic.Subheading */ -.highlight .gt { color: #586e75 } /* Generic.Traceback */ -.highlight .kc { color: #cb4b16 } /* Keyword.Constant */ -.highlight .kd { color: #22b3eb } /* Keyword.Declaration */ -.highlight .kn { color: #859900 } /* Keyword.Namespace */ -.highlight .kp { color: #859900 } /* Keyword.Pseudo */ -.highlight .kr { color: #22b3eb } /* Keyword.Reserved */ -.highlight .kt { color: #dc322f } /* Keyword.Type */ -.highlight .ld { color: #586e75 } /* Literal.Date */ -.highlight .m { color: #2aa198 } /* Literal.Number */ -.highlight .s { color: #2aa198 } /* Literal.String */ -.highlight .na { color: #586e75 } /* Name.Attribute */ -.highlight .nb { color: #B58900 } /* Name.Builtin */ -.highlight .nc { color: #22b3eb } /* Name.Class */ -.highlight .no { color: #cb4b16 } /* Name.Constant */ -.highlight .nd { color: #22b3eb } /* Name.Decorator */ -.highlight .ni { color: #cb4b16 } /* Name.Entity */ -.highlight .ne { color: #cb4b16 } /* Name.Exception */ -.highlight .nf { color: #22b3eb } /* Name.Function */ -.highlight .nl { color: #586e75 } /* Name.Label */ -.highlight .nn { color: #586e75 } /* Name.Namespace */ -.highlight .nx { color: #586e75 } /* Name.Other */ -.highlight .py { color: #586e75 } /* Name.Property */ -.highlight .nt { color: #22b3eb } /* Name.Tag */ -.highlight .nv { color: #22b3eb } /* Name.Variable */ -.highlight .ow { color: #859900 } /* Operator.Word */ -.highlight .w { color: #586e75 } /* Text.Whitespace */ -.highlight .mf { color: #2aa198 } /* Literal.Number.Float */ -.highlight .mh { color: #2aa198 } /* Literal.Number.Hex */ -.highlight .mi { color: #2aa198 } /* Literal.Number.Integer */ -.highlight .mo { color: #2aa198 } /* Literal.Number.Oct */ -.highlight .sb { color: #93a1a1 } /* Literal.String.Backtick */ -.highlight .sc { color: #2aa198 } /* Literal.String.Char */ -.highlight .sd { color: #586e75 } /* Literal.String.Doc */ -.highlight .s2 { color: #2aa198 } /* Literal.String.Double */ -.highlight .se { color: #cb4b16 } /* Literal.String.Escape */ -.highlight .sh { color: #586e75 } /* Literal.String.Heredoc */ -.highlight .si { color: #2aa198 } /* Literal.String.Interpol */ -.highlight .sx { color: #2aa198 } /* Literal.String.Other */ -.highlight .sr { color: #dc322f } /* Literal.String.Regex */ -.highlight .s1 { color: #2aa198 } /* Literal.String.Single */ -.highlight .ss { color: #2aa198 } /* Literal.String.Symbol */ -.highlight .bp { color: #22b3eb } /* Name.Builtin.Pseudo */ -.highlight .vc { color: #22b3eb } /* Name.Variable.Class */ -.highlight .vg { color: #22b3eb } /* Name.Variable.Global */ -.highlight .vi { color: #22b3eb } /* Name.Variable.Instance */ -.highlight .il { color: #2aa198 } /* Literal.Number.Integer.Long */ \ No newline at end of file +.highlight .c { + color: #93a1a1; +} /* Comment */ +.highlight .err { + color: #586e75; +} /* Error */ +.highlight .g { + color: #586e75; +} /* Generic */ +.highlight .k { + color: #859900; +} /* Keyword */ +.highlight .l { + color: #586e75; +} /* Literal */ +.highlight .n { + color: #586e75; +} /* Name */ +.highlight .o { + color: #859900; +} /* Operator */ +.highlight .x { + color: #cb4b16; +} /* Other */ +.highlight .p { + color: #586e75; +} /* Punctuation */ +.highlight .cm { + color: #93a1a1; +} /* Comment.Multiline */ +.highlight .cp { + color: #859900; +} /* Comment.Preproc */ +.highlight .c1 { + color: #93a1a1; +} /* Comment.Single */ +.highlight .cs { + color: #859900; +} /* Comment.Special */ +.highlight .gd { + color: #2aa198; +} /* Generic.Deleted */ +.highlight .ge { + color: #586e75; + font-style: italic; +} /* Generic.Emph */ +.highlight .gr { + color: #dc322f; +} /* Generic.Error */ +.highlight .gh { + color: #cb4b16; +} /* Generic.Heading */ +.highlight .gi { + color: #859900; +} /* Generic.Inserted */ +.highlight .go { + color: #586e75; +} /* Generic.Output */ +.highlight .gp { + color: #586e75; +} /* Generic.Prompt */ +.highlight .gs { + color: #586e75; + font-weight: bold; +} /* Generic.Strong */ +.highlight .gu { + color: #cb4b16; +} /* Generic.Subheading */ +.highlight .gt { + color: #586e75; +} /* Generic.Traceback */ +.highlight .kc { + color: #cb4b16; +} /* Keyword.Constant */ +.highlight .kd { + color: #22b3eb; +} /* Keyword.Declaration */ +.highlight .kn { + color: #859900; +} /* Keyword.Namespace */ +.highlight .kp { + color: #859900; +} /* Keyword.Pseudo */ +.highlight .kr { + color: #22b3eb; +} /* Keyword.Reserved */ +.highlight .kt { + color: #dc322f; +} /* Keyword.Type */ +.highlight .ld { + color: #586e75; +} /* Literal.Date */ +.highlight .m { + color: #2aa198; +} /* Literal.Number */ +.highlight .s { + color: #2aa198; +} /* Literal.String */ +.highlight .na { + color: #586e75; +} /* Name.Attribute */ +.highlight .nb { + color: #b58900; +} /* Name.Builtin */ +.highlight .nc { + color: #22b3eb; +} /* Name.Class */ +.highlight .no { + color: #cb4b16; +} /* Name.Constant */ +.highlight .nd { + color: #22b3eb; +} /* Name.Decorator */ +.highlight .ni { + color: #cb4b16; +} /* Name.Entity */ +.highlight .ne { + color: #cb4b16; +} /* Name.Exception */ +.highlight .nf { + color: #22b3eb; +} /* Name.Function */ +.highlight .nl { + color: #586e75; +} /* Name.Label */ +.highlight .nn { + color: #586e75; +} /* Name.Namespace */ +.highlight .nx { + color: #586e75; +} /* Name.Other */ +.highlight .py { + color: #586e75; +} /* Name.Property */ +.highlight .nt { + color: #22b3eb; +} /* Name.Tag */ +.highlight .nv { + color: #22b3eb; +} /* Name.Variable */ +.highlight .ow { + color: #859900; +} /* Operator.Word */ +.highlight .w { + color: #586e75; +} /* Text.Whitespace */ +.highlight .mf { + color: #2aa198; +} /* Literal.Number.Float */ +.highlight .mh { + color: #2aa198; +} /* Literal.Number.Hex */ +.highlight .mi { + color: #2aa198; +} /* Literal.Number.Integer */ +.highlight .mo { + color: #2aa198; +} /* Literal.Number.Oct */ +.highlight .sb { + color: #93a1a1; +} /* Literal.String.Backtick */ +.highlight .sc { + color: #2aa198; +} /* Literal.String.Char */ +.highlight .sd { + color: #586e75; +} /* Literal.String.Doc */ +.highlight .s2 { + color: #2aa198; +} /* Literal.String.Double */ +.highlight .se { + color: #cb4b16; +} /* Literal.String.Escape */ +.highlight .sh { + color: #586e75; +} /* Literal.String.Heredoc */ +.highlight .si { + color: #2aa198; +} /* Literal.String.Interpol */ +.highlight .sx { + color: #2aa198; +} /* Literal.String.Other */ +.highlight .sr { + color: #dc322f; +} /* Literal.String.Regex */ +.highlight .s1 { + color: #2aa198; +} /* Literal.String.Single */ +.highlight .ss { + color: #2aa198; +} /* Literal.String.Symbol */ +.highlight .bp { + color: #22b3eb; +} /* Name.Builtin.Pseudo */ +.highlight .vc { + color: #22b3eb; +} /* Name.Variable.Class */ +.highlight .vg { + color: #22b3eb; +} /* Name.Variable.Global */ +.highlight .vi { + color: #22b3eb; +} /* Name.Variable.Instance */ +.highlight .il { + color: #2aa198; +} /* Literal.Number.Integer.Long */ diff --git a/docs/_docs/18-history.md b/docs/_docs/18-history.md index 6f5d2463..ade4f2fa 100644 --- a/docs/_docs/18-history.md +++ b/docs/_docs/18-history.md @@ -4,7 +4,7 @@ permalink: /docs/history/ excerpt: "Change log of enhancements and bug fixes made to the theme." sidebar: nav: docs -last_modified_at: 2017-10-16T12:40:54-04:00 +last_modified_at: 2017-10-20T15:54:30-04:00 --- ## Unreleased @@ -24,6 +24,7 @@ last_modified_at: 2017-10-16T12:40:54-04:00 ### Bug Fixes - Fix system font rendering in Chrome on macOS/OS X. [#1290](https://github.com/mmistakes/minimal-mistakes/pull/1290) +- Fix extra padding in syntax highlighted code blocks due to Rouge 2 adding `
` to markup. ## [4.6.0](https://github.com/mmistakes/minimal-mistakes/releases/tag/4.6.0) diff --git a/docs/_sass/minimal-mistakes/_syntax.scss b/docs/_sass/minimal-mistakes/_syntax.scss index e7a75540..cb4a9710 100644 --- a/docs/_sass/minimal-mistakes/_syntax.scss +++ b/docs/_sass/minimal-mistakes/_syntax.scss @@ -27,7 +27,7 @@ figure.highlight { speak: none; } - .highlight { + pre.highlight { margin: 0; padding: 1em; } @@ -58,7 +58,9 @@ figure.highlight { } } -.highlight pre { width: 100%; } +.highlight pre { + width: 100%; +} /* Solarized Light @@ -76,71 +78,209 @@ figure.highlight { green #859900 operators, other keywords ========================================================================== */ -.highlight .c { color: #93a1a1 } /* Comment */ -.highlight .err { color: #586e75 } /* Error */ -.highlight .g { color: #586e75 } /* Generic */ -.highlight .k { color: #859900 } /* Keyword */ -.highlight .l { color: #586e75 } /* Literal */ -.highlight .n { color: #586e75 } /* Name */ -.highlight .o { color: #859900 } /* Operator */ -.highlight .x { color: #cb4b16 } /* Other */ -.highlight .p { color: #586e75 } /* Punctuation */ -.highlight .cm { color: #93a1a1 } /* Comment.Multiline */ -.highlight .cp { color: #859900 } /* Comment.Preproc */ -.highlight .c1 { color: #93a1a1 } /* Comment.Single */ -.highlight .cs { color: #859900 } /* Comment.Special */ -.highlight .gd { color: #2aa198 } /* Generic.Deleted */ -.highlight .ge { color: #586e75; font-style: italic } /* Generic.Emph */ -.highlight .gr { color: #dc322f } /* Generic.Error */ -.highlight .gh { color: #cb4b16 } /* Generic.Heading */ -.highlight .gi { color: #859900 } /* Generic.Inserted */ -.highlight .go { color: #586e75 } /* Generic.Output */ -.highlight .gp { color: #586e75 } /* Generic.Prompt */ -.highlight .gs { color: #586e75; font-weight: bold } /* Generic.Strong */ -.highlight .gu { color: #cb4b16 } /* Generic.Subheading */ -.highlight .gt { color: #586e75 } /* Generic.Traceback */ -.highlight .kc { color: #cb4b16 } /* Keyword.Constant */ -.highlight .kd { color: #22b3eb } /* Keyword.Declaration */ -.highlight .kn { color: #859900 } /* Keyword.Namespace */ -.highlight .kp { color: #859900 } /* Keyword.Pseudo */ -.highlight .kr { color: #22b3eb } /* Keyword.Reserved */ -.highlight .kt { color: #dc322f } /* Keyword.Type */ -.highlight .ld { color: #586e75 } /* Literal.Date */ -.highlight .m { color: #2aa198 } /* Literal.Number */ -.highlight .s { color: #2aa198 } /* Literal.String */ -.highlight .na { color: #586e75 } /* Name.Attribute */ -.highlight .nb { color: #B58900 } /* Name.Builtin */ -.highlight .nc { color: #22b3eb } /* Name.Class */ -.highlight .no { color: #cb4b16 } /* Name.Constant */ -.highlight .nd { color: #22b3eb } /* Name.Decorator */ -.highlight .ni { color: #cb4b16 } /* Name.Entity */ -.highlight .ne { color: #cb4b16 } /* Name.Exception */ -.highlight .nf { color: #22b3eb } /* Name.Function */ -.highlight .nl { color: #586e75 } /* Name.Label */ -.highlight .nn { color: #586e75 } /* Name.Namespace */ -.highlight .nx { color: #586e75 } /* Name.Other */ -.highlight .py { color: #586e75 } /* Name.Property */ -.highlight .nt { color: #22b3eb } /* Name.Tag */ -.highlight .nv { color: #22b3eb } /* Name.Variable */ -.highlight .ow { color: #859900 } /* Operator.Word */ -.highlight .w { color: #586e75 } /* Text.Whitespace */ -.highlight .mf { color: #2aa198 } /* Literal.Number.Float */ -.highlight .mh { color: #2aa198 } /* Literal.Number.Hex */ -.highlight .mi { color: #2aa198 } /* Literal.Number.Integer */ -.highlight .mo { color: #2aa198 } /* Literal.Number.Oct */ -.highlight .sb { color: #93a1a1 } /* Literal.String.Backtick */ -.highlight .sc { color: #2aa198 } /* Literal.String.Char */ -.highlight .sd { color: #586e75 } /* Literal.String.Doc */ -.highlight .s2 { color: #2aa198 } /* Literal.String.Double */ -.highlight .se { color: #cb4b16 } /* Literal.String.Escape */ -.highlight .sh { color: #586e75 } /* Literal.String.Heredoc */ -.highlight .si { color: #2aa198 } /* Literal.String.Interpol */ -.highlight .sx { color: #2aa198 } /* Literal.String.Other */ -.highlight .sr { color: #dc322f } /* Literal.String.Regex */ -.highlight .s1 { color: #2aa198 } /* Literal.String.Single */ -.highlight .ss { color: #2aa198 } /* Literal.String.Symbol */ -.highlight .bp { color: #22b3eb } /* Name.Builtin.Pseudo */ -.highlight .vc { color: #22b3eb } /* Name.Variable.Class */ -.highlight .vg { color: #22b3eb } /* Name.Variable.Global */ -.highlight .vi { color: #22b3eb } /* Name.Variable.Instance */ -.highlight .il { color: #2aa198 } /* Literal.Number.Integer.Long */ \ No newline at end of file +.highlight .c { + color: #93a1a1; +} /* Comment */ +.highlight .err { + color: #586e75; +} /* Error */ +.highlight .g { + color: #586e75; +} /* Generic */ +.highlight .k { + color: #859900; +} /* Keyword */ +.highlight .l { + color: #586e75; +} /* Literal */ +.highlight .n { + color: #586e75; +} /* Name */ +.highlight .o { + color: #859900; +} /* Operator */ +.highlight .x { + color: #cb4b16; +} /* Other */ +.highlight .p { + color: #586e75; +} /* Punctuation */ +.highlight .cm { + color: #93a1a1; +} /* Comment.Multiline */ +.highlight .cp { + color: #859900; +} /* Comment.Preproc */ +.highlight .c1 { + color: #93a1a1; +} /* Comment.Single */ +.highlight .cs { + color: #859900; +} /* Comment.Special */ +.highlight .gd { + color: #2aa198; +} /* Generic.Deleted */ +.highlight .ge { + color: #586e75; + font-style: italic; +} /* Generic.Emph */ +.highlight .gr { + color: #dc322f; +} /* Generic.Error */ +.highlight .gh { + color: #cb4b16; +} /* Generic.Heading */ +.highlight .gi { + color: #859900; +} /* Generic.Inserted */ +.highlight .go { + color: #586e75; +} /* Generic.Output */ +.highlight .gp { + color: #586e75; +} /* Generic.Prompt */ +.highlight .gs { + color: #586e75; + font-weight: bold; +} /* Generic.Strong */ +.highlight .gu { + color: #cb4b16; +} /* Generic.Subheading */ +.highlight .gt { + color: #586e75; +} /* Generic.Traceback */ +.highlight .kc { + color: #cb4b16; +} /* Keyword.Constant */ +.highlight .kd { + color: #22b3eb; +} /* Keyword.Declaration */ +.highlight .kn { + color: #859900; +} /* Keyword.Namespace */ +.highlight .kp { + color: #859900; +} /* Keyword.Pseudo */ +.highlight .kr { + color: #22b3eb; +} /* Keyword.Reserved */ +.highlight .kt { + color: #dc322f; +} /* Keyword.Type */ +.highlight .ld { + color: #586e75; +} /* Literal.Date */ +.highlight .m { + color: #2aa198; +} /* Literal.Number */ +.highlight .s { + color: #2aa198; +} /* Literal.String */ +.highlight .na { + color: #586e75; +} /* Name.Attribute */ +.highlight .nb { + color: #b58900; +} /* Name.Builtin */ +.highlight .nc { + color: #22b3eb; +} /* Name.Class */ +.highlight .no { + color: #cb4b16; +} /* Name.Constant */ +.highlight .nd { + color: #22b3eb; +} /* Name.Decorator */ +.highlight .ni { + color: #cb4b16; +} /* Name.Entity */ +.highlight .ne { + color: #cb4b16; +} /* Name.Exception */ +.highlight .nf { + color: #22b3eb; +} /* Name.Function */ +.highlight .nl { + color: #586e75; +} /* Name.Label */ +.highlight .nn { + color: #586e75; +} /* Name.Namespace */ +.highlight .nx { + color: #586e75; +} /* Name.Other */ +.highlight .py { + color: #586e75; +} /* Name.Property */ +.highlight .nt { + color: #22b3eb; +} /* Name.Tag */ +.highlight .nv { + color: #22b3eb; +} /* Name.Variable */ +.highlight .ow { + color: #859900; +} /* Operator.Word */ +.highlight .w { + color: #586e75; +} /* Text.Whitespace */ +.highlight .mf { + color: #2aa198; +} /* Literal.Number.Float */ +.highlight .mh { + color: #2aa198; +} /* Literal.Number.Hex */ +.highlight .mi { + color: #2aa198; +} /* Literal.Number.Integer */ +.highlight .mo { + color: #2aa198; +} /* Literal.Number.Oct */ +.highlight .sb { + color: #93a1a1; +} /* Literal.String.Backtick */ +.highlight .sc { + color: #2aa198; +} /* Literal.String.Char */ +.highlight .sd { + color: #586e75; +} /* Literal.String.Doc */ +.highlight .s2 { + color: #2aa198; +} /* Literal.String.Double */ +.highlight .se { + color: #cb4b16; +} /* Literal.String.Escape */ +.highlight .sh { + color: #586e75; +} /* Literal.String.Heredoc */ +.highlight .si { + color: #2aa198; +} /* Literal.String.Interpol */ +.highlight .sx { + color: #2aa198; +} /* Literal.String.Other */ +.highlight .sr { + color: #dc322f; +} /* Literal.String.Regex */ +.highlight .s1 { + color: #2aa198; +} /* Literal.String.Single */ +.highlight .ss { + color: #2aa198; +} /* Literal.String.Symbol */ +.highlight .bp { + color: #22b3eb; +} /* Name.Builtin.Pseudo */ +.highlight .vc { + color: #22b3eb; +} /* Name.Variable.Class */ +.highlight .vg { + color: #22b3eb; +} /* Name.Variable.Global */ +.highlight .vi { + color: #22b3eb; +} /* Name.Variable.Instance */ +.highlight .il { + color: #2aa198; +} /* Literal.Number.Integer.Long */