From 4c1baa2b6d0bce70d6bb769e81b321ea36d7a869 Mon Sep 17 00:00:00 2001 From: Eryn Wells Date: Thu, 18 Aug 2022 20:15:33 -0700 Subject: [PATCH] Add syntax highlight config to site config file Generate a Monokai and MonokaiLight CSS file for highlighting Include the CSS file in --- config.toml | 6 ++ layouts/partials/head.html | 6 +- static/styles/monokai.css | 174 +++++++++++++++++++++++++++++++++++++ 3 files changed, 182 insertions(+), 4 deletions(-) create mode 100644 static/styles/monokai.css diff --git a/config.toml b/config.toml index 4fcc243..8a8c098 100644 --- a/config.toml +++ b/config.toml @@ -12,6 +12,12 @@ name = 'Eryn Wells' [languages.es] weight = 2 +[markup] + [markup.highlight] + anchorLineNos = true + lineNos = true + noClasses = false + [mediaTypes] [mediaTypes.'application/rss+xml'] delimiter = '.' diff --git a/layouts/partials/head.html b/layouts/partials/head.html index b66055b..51b8a16 100644 --- a/layouts/partials/head.html +++ b/layouts/partials/head.html @@ -25,10 +25,8 @@ {{ if in (.Site.BaseURL | string) "localhost" }} {{ end }} - - {{ if and .IsPage (not site.Params.disableHLJS) }} - - + {{ if .IsPage }} + {{ end }} {{ range $.Scratch.Get "social-list" }} diff --git a/static/styles/monokai.css b/static/styles/monokai.css new file mode 100644 index 0000000..d320354 --- /dev/null +++ b/static/styles/monokai.css @@ -0,0 +1,174 @@ +.chroma { line-height: 1.4; } +/* Line */ .chroma .line { display: flex; } + +/* Background */ .bg { color: #272822; background-color: #fafafa } +/* PreWrapper */ .chroma { color: #272822; background-color: #fafafa; } +/* Other */ .chroma .x { } +/* Error */ .chroma .err { color: #960050; background-color: #1e0010 } +/* CodeLine */ .chroma .cl { } +/* LineTableTD */ .chroma .lntd { vertical-align: top; padding: 0; margin: 0; border: 0; } +/* LineTable */ .chroma .lntable { border-spacing: 0; padding: 0; margin: 0; border: 0; } +/* LineHighlight */ .chroma .hl { background-color: #ffffcc } +/* LineNumbersTable */ .chroma .lnt { white-space: pre; user-select: none; margin-right: 0.4em; padding: 0 0.4em 0 0.4em;color: #7f7f7f } +/* LineNumbers */ .chroma .ln { white-space: pre; user-select: none; margin-right: 0.4em; padding: 0 0.4em 0 0.4em;color: #7f7f7f } +/* Keyword */ .chroma .k { color: #00a8c8 } +/* KeywordConstant */ .chroma .kc { color: #00a8c8 } +/* KeywordDeclaration */ .chroma .kd { color: #00a8c8 } +/* KeywordNamespace */ .chroma .kn { color: #f92672 } +/* KeywordPseudo */ .chroma .kp { color: #00a8c8 } +/* KeywordReserved */ .chroma .kr { color: #00a8c8 } +/* KeywordType */ .chroma .kt { color: #00a8c8 } +/* Name */ .chroma .n { color: #111111 } +/* NameAttribute */ .chroma .na { color: #75af00 } +/* NameBuiltin */ .chroma .nb { color: #111111 } +/* NameBuiltinPseudo */ .chroma .bp { color: #111111 } +/* NameClass */ .chroma .nc { color: #75af00 } +/* NameConstant */ .chroma .no { color: #00a8c8 } +/* NameDecorator */ .chroma .nd { color: #75af00 } +/* NameEntity */ .chroma .ni { color: #111111 } +/* NameException */ .chroma .ne { color: #75af00 } +/* NameFunction */ .chroma .nf { color: #75af00 } +/* NameFunctionMagic */ .chroma .fm { color: #111111 } +/* NameLabel */ .chroma .nl { color: #111111 } +/* NameNamespace */ .chroma .nn { color: #111111 } +/* NameOther */ .chroma .nx { color: #75af00 } +/* NameProperty */ .chroma .py { color: #111111 } +/* NameTag */ .chroma .nt { color: #f92672 } +/* NameVariable */ .chroma .nv { color: #111111 } +/* NameVariableClass */ .chroma .vc { color: #111111 } +/* NameVariableGlobal */ .chroma .vg { color: #111111 } +/* NameVariableInstance */ .chroma .vi { color: #111111 } +/* NameVariableMagic */ .chroma .vm { color: #111111 } +/* Literal */ .chroma .l { color: #ae81ff } +/* LiteralDate */ .chroma .ld { color: #d88200 } +/* LiteralString */ .chroma .s { color: #d88200 } +/* LiteralStringAffix */ .chroma .sa { color: #d88200 } +/* LiteralStringBacktick */ .chroma .sb { color: #d88200 } +/* LiteralStringChar */ .chroma .sc { color: #d88200 } +/* LiteralStringDelimiter */ .chroma .dl { color: #d88200 } +/* LiteralStringDoc */ .chroma .sd { color: #d88200 } +/* LiteralStringDouble */ .chroma .s2 { color: #d88200 } +/* LiteralStringEscape */ .chroma .se { color: #8045ff } +/* LiteralStringHeredoc */ .chroma .sh { color: #d88200 } +/* LiteralStringInterpol */ .chroma .si { color: #d88200 } +/* LiteralStringOther */ .chroma .sx { color: #d88200 } +/* LiteralStringRegex */ .chroma .sr { color: #d88200 } +/* LiteralStringSingle */ .chroma .s1 { color: #d88200 } +/* LiteralStringSymbol */ .chroma .ss { color: #d88200 } +/* LiteralNumber */ .chroma .m { color: #ae81ff } +/* LiteralNumberBin */ .chroma .mb { color: #ae81ff } +/* LiteralNumberFloat */ .chroma .mf { color: #ae81ff } +/* LiteralNumberHex */ .chroma .mh { color: #ae81ff } +/* LiteralNumberInteger */ .chroma .mi { color: #ae81ff } +/* LiteralNumberIntegerLong */ .chroma .il { color: #ae81ff } +/* LiteralNumberOct */ .chroma .mo { color: #ae81ff } +/* Operator */ .chroma .o { color: #f92672 } +/* OperatorWord */ .chroma .ow { color: #f92672 } +/* Punctuation */ .chroma .p { color: #111111 } +/* Comment */ .chroma .c { color: #75715e } +/* CommentHashbang */ .chroma .ch { color: #75715e } +/* CommentMultiline */ .chroma .cm { color: #75715e } +/* CommentSingle */ .chroma .c1 { color: #75715e } +/* CommentSpecial */ .chroma .cs { color: #75715e } +/* CommentPreproc */ .chroma .cp { color: #75715e } +/* CommentPreprocFile */ .chroma .cpf { color: #75715e } +/* Generic */ .chroma .g { } +/* GenericDeleted */ .chroma .gd { } +/* GenericEmph */ .chroma .ge { font-style: italic } +/* GenericError */ .chroma .gr { } +/* GenericHeading */ .chroma .gh { } +/* GenericInserted */ .chroma .gi { } +/* GenericOutput */ .chroma .go { } +/* GenericPrompt */ .chroma .gp { } +/* GenericStrong */ .chroma .gs { font-weight: bold } +/* GenericSubheading */ .chroma .gu { } +/* GenericTraceback */ .chroma .gt { } +/* GenericUnderline */ .chroma .gl { } +/* TextWhitespace */ .chroma .w { } + +@media (prefers-color-scheme: dark) { + /* Background */ .bg { color: #f8f8f2; background-color: #272822 } + /* PreWrapper */ .chroma { color: #f8f8f2; background-color: #272822; } + /* Other */ .chroma .x { } + /* Error */ .chroma .err { color: #960050; background-color: #1e0010 } + /* CodeLine */ .chroma .cl { } + /* LineTableTD */ .chroma .lntd { vertical-align: top; padding: 0; margin: 0; border: 0; } + /* LineTable */ .chroma .lntable { border-spacing: 0; padding: 0; margin: 0; border: 0; } + /* LineHighlight */ .chroma .hl { background-color: #ffffcc } + /* LineNumbersTable */ .chroma .lnt { white-space: pre; user-select: none; margin-right: 0.4em; padding: 0 0.4em 0 0.4em;color: #7f7f7f } + /* LineNumbers */ .chroma .ln { white-space: pre; user-select: none; margin-right: 0.4em; padding: 0 0.4em 0 0.4em;color: #7f7f7f } + /* Keyword */ .chroma .k { color: #66d9ef } + /* KeywordConstant */ .chroma .kc { color: #66d9ef } + /* KeywordDeclaration */ .chroma .kd { color: #66d9ef } + /* KeywordNamespace */ .chroma .kn { color: #f92672 } + /* KeywordPseudo */ .chroma .kp { color: #66d9ef } + /* KeywordReserved */ .chroma .kr { color: #66d9ef } + /* KeywordType */ .chroma .kt { color: #66d9ef } + /* Name */ .chroma .n { } + /* NameAttribute */ .chroma .na { color: #a6e22e } + /* NameBuiltin */ .chroma .nb { color: inherit; } + /* NameBuiltinPseudo */ .chroma .bp { } + /* NameClass */ .chroma .nc { color: #a6e22e } + /* NameConstant */ .chroma .no { color: #66d9ef } + /* NameDecorator */ .chroma .nd { color: #a6e22e } + /* NameEntity */ .chroma .ni { } + /* NameException */ .chroma .ne { color: #a6e22e } + /* NameFunction */ .chroma .nf { color: #a6e22e } + /* NameFunctionMagic */ .chroma .fm { } + /* NameLabel */ .chroma .nl { } + /* NameNamespace */ .chroma .nn { } + /* NameOther */ .chroma .nx { color: #a6e22e } + /* NameProperty */ .chroma .py { } + /* NameTag */ .chroma .nt { color: #f92672 } + /* NameVariable */ .chroma .nv { color: inherit; } + /* NameVariableClass */ .chroma .vc { } + /* NameVariableGlobal */ .chroma .vg { } + /* NameVariableInstance */ .chroma .vi { } + /* NameVariableMagic */ .chroma .vm { } + /* Literal */ .chroma .l { color: #ae81ff } + /* LiteralDate */ .chroma .ld { color: #e6db74 } + /* LiteralString */ .chroma .s { color: #e6db74 } + /* LiteralStringAffix */ .chroma .sa { color: #e6db74 } + /* LiteralStringBacktick */ .chroma .sb { color: #e6db74 } + /* LiteralStringChar */ .chroma .sc { color: #e6db74 } + /* LiteralStringDelimiter */ .chroma .dl { color: #e6db74 } + /* LiteralStringDoc */ .chroma .sd { color: #e6db74 } + /* LiteralStringDouble */ .chroma .s2 { color: #e6db74 } + /* LiteralStringEscape */ .chroma .se { color: #ae81ff } + /* LiteralStringHeredoc */ .chroma .sh { color: #e6db74 } + /* LiteralStringInterpol */ .chroma .si { color: #e6db74 } + /* LiteralStringOther */ .chroma .sx { color: #e6db74 } + /* LiteralStringRegex */ .chroma .sr { color: #e6db74 } + /* LiteralStringSingle */ .chroma .s1 { color: #e6db74 } + /* LiteralStringSymbol */ .chroma .ss { color: #e6db74 } + /* LiteralNumber */ .chroma .m { color: #ae81ff } + /* LiteralNumberBin */ .chroma .mb { color: #ae81ff } + /* LiteralNumberFloat */ .chroma .mf { color: #ae81ff } + /* LiteralNumberHex */ .chroma .mh { color: #ae81ff } + /* LiteralNumberInteger */ .chroma .mi { color: #ae81ff } + /* LiteralNumberIntegerLong */ .chroma .il { color: #ae81ff } + /* LiteralNumberOct */ .chroma .mo { color: #ae81ff } + /* Operator */ .chroma .o { color: #f92672 } + /* OperatorWord */ .chroma .ow { color: #f92672 } + /* Punctuation */ .chroma .p { color: inherit; } + /* Comment */ .chroma .c { color: #75715e } + /* CommentHashbang */ .chroma .ch { color: #75715e } + /* CommentMultiline */ .chroma .cm { color: #75715e } + /* CommentSingle */ .chroma .c1 { color: #75715e } + /* CommentSpecial */ .chroma .cs { color: #75715e } + /* CommentPreproc */ .chroma .cp { color: #75715e } + /* CommentPreprocFile */ .chroma .cpf { color: #75715e } + /* Generic */ .chroma .g { } + /* GenericDeleted */ .chroma .gd { color: #f92672 } + /* GenericEmph */ .chroma .ge { font-style: italic } + /* GenericError */ .chroma .gr { } + /* GenericHeading */ .chroma .gh { } + /* GenericInserted */ .chroma .gi { color: #a6e22e } + /* GenericOutput */ .chroma .go { } + /* GenericPrompt */ .chroma .gp { } + /* GenericStrong */ .chroma .gs { font-weight: bold } + /* GenericSubheading */ .chroma .gu { color: #75715e } + /* GenericTraceback */ .chroma .gt { } + /* GenericUnderline */ .chroma .gl { } + /* TextWhitespace */ .chroma .w { } +}