From c8ce49fdfdbf91bfea5dd173cd62a6edf63b7755 Mon Sep 17 00:00:00 2001 From: Ashwin Maroli Date: Wed, 15 Apr 2020 18:42:06 +0530 Subject: [PATCH] Improve syntax-highlighting in documentation site (#8079) Merge pull request 8079 --- docs/_sass/_pygments.scss | 142 +++++++++++++++++++++----------------- docs/_sass/_style.scss | 11 ++- 2 files changed, 86 insertions(+), 67 deletions(-) diff --git a/docs/_sass/_pygments.scss b/docs/_sass/_pygments.scss index d5759a0f..ca333ead 100644 --- a/docs/_sass/_pygments.scss +++ b/docs/_sass/_pygments.scss @@ -1,74 +1,86 @@ .highlight { .hll { background-color: #ffffcc } - .c { color: #999; font-style: italic } /* Comment */ - .err { color: #ffffff} /* Error */ - .g { color: #ffffff} /* Generic */ - .k { color: #f0e68c} /* Keyword */ - .l { color: #ffffff} /* Literal */ - .n { color: #ffffff} /* Name */ - .o { color: #ffffff} /* Operator */ - .x { color: #ffffff} /* Other */ - .p { color: #98b9ef} /* Punctuation */ - .cm { color: #87ceeb} /* Comment.Multiline */ - .cp { color: #cd5c5c} /* Comment.Preproc */ - .c1 { color: #87ceeb} /* Comment.Single */ - .cs { color: #87ceeb} /* Comment.Special */ - .gd { color: #ce342c} /* Generic.Deleted */ - .ge { color: #c000c0; text-decoration: underline} /* Generic.Emph */ + .err { color: #ce342c } /* Error */ + .c { color: #818181 } /* Comment */ + .g { color: #ffffff } /* Generic */ + .k { color: #ff4287 } /* Keyword */ + .l { color: #ffffff } /* Literal */ + .n { color: #ffffff } /* Name */ + .o { color: #ffffff } /* Operator */ + .x { color: #ffffff } /* Other */ + .p { color: #ffffff } /* Punctuation */ + .cm { color: #818181 } /* Comment.Multiline */ + .cp { color: #d1c2f4 } /* Comment.Preproc */ + .c1 { color: #818181 } /* Comment.Single */ + .cs { color: #818181 } /* Comment.Special */ + .gd { color: #ce342c } /* Generic.Deleted */ + .ge { color: #c000c0; text-decoration: underline } /* Generic.Emph */ .gr { color: #c0c0c0; font-weight: bold; background-color: #c00000 } /* Generic.Error */ - .gh { color: #cd5c5c} /* Generic.Heading */ - .gi { color: #27b42c} /* Generic.Inserted */ + .gh { color: #ffffff } /* Generic.Heading */ + .gi { color: #27b42c } /* Generic.Inserted */ span.go { color: #add8e6; font-weight: bold; background-color: #4d4d4d } /* Generic.Output, qualified with span to prevent applying this style to the Go language, see #1153. */ - .gp { color: #ffffff} /* Generic.Prompt */ - .gs { color: #ffffff} /* Generic.Strong */ - .gu { color: #cd5c5c} /* Generic.Subheading */ + .gp { color: #ffffff } /* Generic.Prompt */ + .gs { color: #ffffff } /* Generic.Strong */ + .gu { color: #ffffff } /* Generic.Subheading */ .gt { color: #c0c0c0; font-weight: bold; background-color: #c00000 } /* Generic.Traceback */ - .kc { color: #f0e68c} /* Keyword.Constant */ - .kd { color: #f0e68c} /* Keyword.Declaration */ - .kn { color: #f0e68c} /* Keyword.Namespace */ - .kp { color: #f0e68c} /* Keyword.Pseudo */ - .kr { color: #f0e68c} /* Keyword.Reserved */ - .kt { color: #bdb76b} /* Keyword.Type */ - .ld { color: #ffffff} /* Literal.Date */ - .m { color: #ffffff} /* Literal.Number */ - .s { color: #ffffff} /* Literal.String */ - .na { color: #ffffff} /* Name.Attribute */ - .nb { color: #ffffff} /* Name.Builtin */ - .nc { color: #ffffff} /* Name.Class */ - .no { color: #ffa0a0} /* Name.Constant */ - .nd { color: #ffffff} /* Name.Decorator */ - .ni { color: #ffdead} /* Name.Entity */ - .ne { color: #ffffff} /* Name.Exception */ - .nf { color: #ffffff} /* Name.Function */ - .nl { color: #ffffff} /* Name.Label */ - .nn { color: #ffffff} /* Name.Namespace */ - .nx { color: #ffffff} /* Name.Other */ - .py { color: #ffffff} /* Name.Property */ - .nt { color: #f0e68c} /* Name.Tag */ - .nv { color: #88d472} /* Name.Variable */ - .ow { color: #ffffff} /* Operator.Word */ - .w { color: #ffffff} /* Text.Whitespace */ - .mf { color: #ffffff} /* Literal.Number.Float */ - .mh { color: #ffffff} /* Literal.Number.Hex */ - .mi { color: #ffffff} /* Literal.Number.Integer */ - .mo { color: #ffffff} /* Literal.Number.Oct */ - .sb { color: #ffffff} /* Literal.String.Backtick */ - .sc { color: #ffffff} /* Literal.String.Char */ - .sd { color: #ffffff} /* Literal.String.Doc */ - .s2 { color: #ffffff} /* Literal.String.Double */ - .se { color: #ffffff} /* Literal.String.Escape */ - .sh { color: #ffffff} /* Literal.String.Heredoc */ - .si { color: #ffffff} /* Literal.String.Interpol */ - .sx { color: #ffffff} /* Literal.String.Other */ - .sr { color: #ffffff} /* Literal.String.Regex */ - .s1 { color: #ffffff} /* Literal.String.Single */ - .ss { color: #ffffff} /* Literal.String.Symbol */ - .bp { color: #ffffff} /* Name.Builtin.Pseudo */ - .vc { color: #98fb98} /* Name.Variable.Class */ - .vg { color: #98fb98} /* Name.Variable.Global */ - .vi { color: #98fb98} /* Name.Variable.Instance */ - .il { color: #ffffff} /* Literal.Number.Integer.Long */ + .kc { color: #ff4287 } /* Keyword.Constant */ + .kd { color: #ff4287 } /* Keyword.Declaration */ + .kn { color: #ff4287 } /* Keyword.Namespace */ + .kp { color: #ff4287 } /* Keyword.Pseudo */ + .kr { color: #ff4287 } /* Keyword.Reserved */ + .kt { color: #bdb76b } /* Keyword.Type */ + .ld { color: #ffffff } /* Literal.Date */ + .m { color: #ffffff } /* Literal.Number */ + .s { color: #ffe580 } /* Literal.String */ + .na { color: #b6e382 } /* Name.Attribute */ + .nb { color: #ffffff } /* Name.Builtin */ + .nc { color: #b6e382 } /* Name.Class */ + .no { color: #87ceeb } /* Name.Constant */ + .nd { color: #ffffff } /* Name.Decorator */ + .ni { color: #ffdead } /* Name.Entity */ + .ne { color: #ffffff } /* Name.Exception */ + .nf { color: #ffffff } /* Name.Function */ + .nl { color: #ffffff } /* Name.Label */ + .nn { color: #ffffff } /* Name.Namespace */ + .nx { color: #ffffff } /* Name.Other */ + .py { color: #ffffff } /* Name.Property */ + .nt { color: #ff4287 } /* Name.Tag */ + .nv { color: #ffffff } /* Name.Variable */ + .ow { color: #ffffff } /* Operator.Word */ + .w { color: #ffffff } /* Text.Whitespace */ + .mf { color: #ffffff } /* Literal.Number.Float */ + .mh { color: #ffffff } /* Literal.Number.Hex */ + .mi { color: #ffffff } /* Literal.Number.Integer */ + .mo { color: #ffffff } /* Literal.Number.Oct */ + .sb { color: #ffffff } /* Literal.String.Backtick */ + .sc { color: #ffffff } /* Literal.String.Char */ + .sd { color: #ffffff } /* Literal.String.Doc */ + .s2 { color: #ffe580 } /* Literal.String.Double */ + .se { color: #ffffff } /* Literal.String.Escape */ + .sh { color: #ffffff } /* Literal.String.Heredoc */ + .si { color: #ffffff } /* Literal.String.Interpol */ + .sx { color: #ffffff } /* Literal.String.Other */ + .sr { color: #ffffff } /* Literal.String.Regex */ + .s1 { color: #ffe580 } /* Literal.String.Single */ + .ss { color: #a47bea } /* Literal.String.Symbol */ + .bp { color: #ffffff } /* Name.Builtin.Pseudo */ + .vc { color: #98fb98 } /* Name.Variable.Class */ + .vg { color: #98fb98 } /* Name.Variable.Global */ + .vi { color: #ffffff } /* Name.Variable.Instance */ + .il { color: #ffffff } /* Literal.Number.Integer.Long */ .bash .nv { user-select: none; } } + +.language-liquid { + .highlight { + .p { color: #87ceeb } + .kr { color: #87ceeb } + .nf { color: #b899ff } + .nt { color: #87ceeb } + .nv { color: #b6e382 } + } +} + +.language-sh .highlight * { color: #ffffff } diff --git a/docs/_sass/_style.scss b/docs/_sass/_style.scss index 8377525d..9e3ca1c8 100644 --- a/docs/_sass/_style.scss +++ b/docs/_sass/_style.scss @@ -741,7 +741,7 @@ code { white-space: pre; display: inline-block; margin: 0; - font: 14px/1.8em Menlo, Consolas, "Courier New", Courier, "Liberation Mono", monospace; + font: 14px/1.625em Menlo, Consolas, "Courier New", Courier, "Liberation Mono", monospace; padding: 0 0.5em; } @@ -750,6 +750,7 @@ code { } .highlight, +a > code, p > pre, p > code, p > nobr > code, @@ -757,7 +758,7 @@ li > code, li> pre, h5 > code, .note > code { - background-color: #2b2b2b; + background-color: #272727; color: #fff; max-width: 100%; overflow-x: auto; @@ -768,6 +769,8 @@ h5 > code, 0 -1px 0 rgba(0,0,0,.5)); } +a > code { color: inherit } + .note .highlight { width: 94%; pre code { @@ -806,6 +809,10 @@ pre.highlight, margin: 0; } +div.highlighter-rouge + div.highlighter-rouge { + margin: 30px 0 0; +} + /* HTML Elements */ h1, h2, h3, h4, h5, h6 { margin: 0; }