From 9c090cc7e299681c9aed6913e9cf0cadc148af7d Mon Sep 17 00:00:00 2001 From: wxiaoguang Date: Mon, 27 Feb 2023 19:03:55 +0800 Subject: [PATCH 1/5] fix --- .stylelintrc.yaml | 3 + web_src/less/chroma/chroma-style-diff.go | 79 +++++++++++++++++++ web_src/less/chroma/dark.less | 16 ++-- web_src/less/chroma/light.less | 15 +++- .../less/chroma/{base.less => overwrite.less} | 0 web_src/less/index.less | 2 +- web_src/less/themes/theme-arc-green.less | 1 + 7 files changed, 107 insertions(+), 9 deletions(-) create mode 100644 web_src/less/chroma/chroma-style-diff.go rename web_src/less/chroma/{base.less => overwrite.less} (100%) diff --git a/.stylelintrc.yaml b/.stylelintrc.yaml index ca0f16b07b6c0..6ddc28e7ac344 100644 --- a/.stylelintrc.yaml +++ b/.stylelintrc.yaml @@ -1,6 +1,9 @@ plugins: - stylelint-declaration-strict-value +ignoreFiles: + - "**/*.go" + overrides: - files: ["**/*.less"] customSyntax: postcss-less diff --git a/web_src/less/chroma/chroma-style-diff.go b/web_src/less/chroma/chroma-style-diff.go new file mode 100644 index 0000000000000..4243259689550 --- /dev/null +++ b/web_src/less/chroma/chroma-style-diff.go @@ -0,0 +1,79 @@ +// Copyright 2023 The Gitea Authors. All rights reserved. +// SPDX-License-Identifier: MIT + +//go:build ignore + +/* +This tool is used to compare the CSS names in a chroma builtin styles with the Gitea theme CSS names. + +It outputs the difference between the two sets of CSS names, eg: + +``` +CSS names not in builtin: +.chroma .ln +---- +Builtin CSS names not in file: +.chroma .vm +``` + +Developers could use this tool to re-sync the CSS names in the Gitea theme. +*/ + +package main + +import ( + "os" + "regexp" + "strings" + + "github.com/alecthomas/chroma/v2" +) + +func main() { + if len(os.Args) != 2 { + println("Usage: chroma-style-diff css-or-less-file") + os.Exit(1) + } + + data, err := os.ReadFile(os.Args[1]) + if err != nil { + println(err.Error()) + os.Exit(1) + } + + content := string(data) + + // a simple CSS parser to collect CSS names + content = regexp.MustCompile("//.*\r?\n").ReplaceAllString(content, "\n") + content = regexp.MustCompile("/\\*.*?\\*/").ReplaceAllString(content, "") + matches := regexp.MustCompile("\\s*([-.#:\\w\\s]+)\\s*\\{[^}]*}").FindAllStringSubmatch(content, -1) + + cssNames := map[string]bool{} + for _, matchGroup := range matches { + cssName := strings.TrimSpace(matchGroup[1]) + cssNames[cssName] = true + } + + // collect Chroma builtin CSS names + builtin := map[string]bool{} + for tokenType, cssName := range chroma.StandardTypes { + if tokenType > 0 && cssName != "" { + builtin[".chroma ."+cssName] = true + } + } + + // show the diff + println("CSS names not in builtin:") + for cssName := range cssNames { + if !builtin[cssName] { + println(cssName) + } + } + println("----") + println("Builtin CSS names not in file:") + for cssName := range builtin { + if !cssNames[cssName] { + println(cssName) + } + } +} diff --git a/web_src/less/chroma/dark.less b/web_src/less/chroma/dark.less index 4be9cf7912e0b..f7820a790ee3e 100644 --- a/web_src/less/chroma/dark.less +++ b/web_src/less/chroma/dark.less @@ -1,3 +1,5 @@ +/* stylelint-disable block-no-empty */ + .chroma .bp { color: #fabd2f; } /* NameBuiltinPseudo */ .chroma .c { color: #777e94; } /* Comment */ .chroma .c1 { color: #777e94; } /* CommentSingle */ @@ -7,17 +9,19 @@ .chroma .cpf { color: #649bc4; } /* CommentPreprocFile */ .chroma .cs { color: #9075cd; } /* CommentSpecial */ .chroma .dl { color: #649bc4; } /* LiteralStringDelimiter */ +.chroma .fm {} /* NameFunctionMagic */ +.chroma .g {} /* Generic */ .chroma .gd { color: #ffffff; background-color: #5f3737; } /* GenericDeleted */ .chroma .ge { color: #ddee30; } /* GenericEmph */ .chroma .gh { color: #ffaa10; } /* GenericHeading */ .chroma .gi { color: #ffffff; background-color: #3a523a; } /* GenericInserted */ +.chroma .gl {} /* GenericUnderline */ .chroma .go { color: #777e94; } /* GenericOutput */ .chroma .gp { color: #ebdbb2; } /* GenericPrompt */ .chroma .gr { color: #ff4433; } /* GenericError */ .chroma .gs { color: #ebdbb2; } /* GenericStrong */ .chroma .gt { color: #ff7540; } /* GenericTraceback */ .chroma .gu { color: #b8bb26; } /* GenericSubheading */ -.chroma .hl { background-color: #3f424d; } /* LineHighlight */ .chroma .il { color: #649bc4; } /* LiteralNumberIntegerLong */ .chroma .k { color: #ff7540; } /* Keyword */ .chroma .kc { color: #649bc4; } /* KeywordConstant */ @@ -25,16 +29,16 @@ .chroma .kn { color: #ffaa10; } /* KeywordNamespace */ .chroma .kp { color: #5f8700; } /* KeywordPseudo */ .chroma .kr { color: #ff7540; } /* KeywordReserved */ -.chroma .kt { color: #fabd2f; } /* KeywordType */ -.chroma .ln { color: #7f8699; } /* LineNumbers */ -.chroma .lnt { color: #7f8699; } /* LineNumbersTable */ +.chroma .kt { color: #ff7b72; } /* KeywordType */ +.chroma .l {} /* Literal */ +.chroma .ld {} /* LiteralDate */ .chroma .m { color: #649bc4; } /* LiteralNumber */ .chroma .mb { color: #649bc4; } /* LiteralNumberBin */ .chroma .mf { color: #649bc4; } /* LiteralNumberFloat */ .chroma .mh { color: #649bc4; } /* LiteralNumberHex */ .chroma .mi { color: #649bc4; } /* LiteralNumberInteger */ .chroma .mo { color: #649bc4; } /* LiteralNumberOct */ -.chroma .n { color: #fabd2f; } /* Name */ +.chroma .n { color: #c9d1d9; } /* Name */ .chroma .na { color: #b8bb26; } /* NameAttribute */ .chroma .nb { color: #fabd2f; } /* NameBuiltin */ .chroma .nc { color: #ffaa10; } /* NameClass */ @@ -51,6 +55,7 @@ .chroma .o { color: #ff7540; } /* Operator */ .chroma .ow { color: #5f8700; } /* OperatorWord */ .chroma .p { color: #d2d4db; } /* Punctuation */ +.chroma .py {} /* NameProperty */ .chroma .s { color: #b8bb26; } /* LiteralString */ .chroma .s1 { color: #b8bb26; } /* LiteralStringSingle */ .chroma .s2 { color: #b8bb26; } /* LiteralStringDouble */ @@ -67,4 +72,5 @@ .chroma .vc { color: #ff7540; } /* NameVariableClass */ .chroma .vg { color: #ffaa10; } /* NameVariableGlobal */ .chroma .vi { color: #ffaa10; } /* NameVariableInstance */ +.chroma .vm {} /* NameVariableMagic */ .chroma .w { color: #7f8699; } /* TextWhitespace */ diff --git a/web_src/less/chroma/light.less b/web_src/less/chroma/light.less index 2e811844c2ddd..b02e9d980b754 100644 --- a/web_src/less/chroma/light.less +++ b/web_src/less/chroma/light.less @@ -1,3 +1,5 @@ +/* stylelint-disable */ + .chroma .bp { color: #999999; } /* NameBuiltinPseudo */ .chroma .c { color: #6a737d; } /* Comment */ .chroma .c1 { color: #6a737d; } /* CommentSingle */ @@ -7,16 +9,19 @@ .chroma .cpf { color: #4c4dbc; } /* CommentPreprocFile */ .chroma .cs { color: #999999; } /* CommentSpecial */ .chroma .dl { color: #106303; } /* LiteralStringDelimiter */ +.chroma .fm {} /* NameFunctionMagic */ +.chroma .g {} /* Generic */ .chroma .gd { color: #000000; background-color: #ffdddd; } /* GenericDeleted */ .chroma .ge { color: #000000; } /* GenericEmph */ .chroma .gh { color: #999999; } /* GenericHeading */ .chroma .gi { color: #000000; background-color: #ddffdd; } /* GenericInserted */ +.chroma .gl {} /* GenericUnderline */ .chroma .go { color: #888888; } /* GenericOutput */ .chroma .gp { color: #555555; } /* GenericPrompt */ .chroma .gr { color: #aa0000; } /* GenericError */ +.chroma .gs {} /* GenericStrong */ .chroma .gt { color: #aa0000; } /* GenericTraceback */ .chroma .gu { color: #aaaaaa; } /* GenericSubheading */ -.chroma .hl { background-color: #e5e5e5; } /* LineHighlight */ .chroma .il { color: #009999; } /* LiteralNumberIntegerLong */ .chroma .k { color: #d73a49; } /* Keyword */ .chroma .kc { color: #d73a49; } /* KeywordConstant */ @@ -25,14 +30,15 @@ .chroma .kp { color: #d73a49; } /* KeywordPseudo */ .chroma .kr { color: #d73a49; } /* KeywordReserved */ .chroma .kt { color: #445588; } /* KeywordType */ -.chroma .ln { color: #7f7f7f; } /* LineNumbers */ -.chroma .lnt { color: #7f7f7f; } /* LineNumbersTable */ +.chroma .l {} /* Literal */ +.chroma .ld {} /* LiteralDate */ .chroma .m { color: #009999; } /* LiteralNumber */ .chroma .mb { color: #009999; } /* LiteralNumberBin */ .chroma .mf { color: #009999; } /* LiteralNumberFloat */ .chroma .mh { color: #009999; } /* LiteralNumberHex */ .chroma .mi { color: #009999; } /* LiteralNumberInteger */ .chroma .mo { color: #009999; } /* LiteralNumberOct */ +.chroma .n {} /* Name */ .chroma .na { color: #d73a49; } /* NameAttribute */ .chroma .nb { color: #005cc5; } /* NameBuiltin */ .chroma .nc { color: #445588; } /* NameClass */ @@ -48,6 +54,8 @@ .chroma .nx { color: #24292e; } /* NameOther */ .chroma .o { color: #d73a49; } /* Operator */ .chroma .ow { color: #d73a49; } /* OperatorWord */ +.chroma .p {} /* Punctuation */ +.chroma .py {} /* NameProperty */ .chroma .s { color: #106303; } /* LiteralString */ .chroma .s1 { color: #cc7a00; } /* LiteralStringSingle */ .chroma .s2 { color: #106303; } /* LiteralStringDouble */ @@ -64,4 +72,5 @@ .chroma .vc { color: #008080; } /* NameVariableClass */ .chroma .vg { color: #008080; } /* NameVariableGlobal */ .chroma .vi { color: #008080; } /* NameVariableInstance */ +.chroma .vm {} /* NameVariableMagic */ .chroma .w { color: #bbbbbb; } /* TextWhitespace */ diff --git a/web_src/less/chroma/base.less b/web_src/less/chroma/overwrite.less similarity index 100% rename from web_src/less/chroma/base.less rename to web_src/less/chroma/overwrite.less diff --git a/web_src/less/index.less b/web_src/less/index.less index 5d55b9291f6c9..a164cde4673f3 100644 --- a/web_src/less/index.less +++ b/web_src/less/index.less @@ -15,8 +15,8 @@ @import "./code/linebutton.less"; @import "./markup/asciicast.less"; -@import "./chroma/base.less"; @import "./chroma/light.less"; +@import "./chroma/overwrite.less"; @import "./codemirror/base.less"; @import "./codemirror/light.less"; @import "./console/console.less"; diff --git a/web_src/less/themes/theme-arc-green.less b/web_src/less/themes/theme-arc-green.less index 2f06f33aca705..46cb728fe83b2 100644 --- a/web_src/less/themes/theme-arc-green.less +++ b/web_src/less/themes/theme-arc-green.less @@ -1,4 +1,5 @@ @import "../chroma/dark.less"; +@import "../chroma/overwrite.less"; @import "../codemirror/dark.less"; :root { From fd8e0913b1e25d8e469fd3799f5c31b84adfab36 Mon Sep 17 00:00:00 2001 From: wxiaoguang Date: Wed, 1 Mar 2023 11:34:11 +0800 Subject: [PATCH 2/5] fix stylelint --- web_src/less/chroma/light.less | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/web_src/less/chroma/light.less b/web_src/less/chroma/light.less index b02e9d980b754..99b2619fda390 100644 --- a/web_src/less/chroma/light.less +++ b/web_src/less/chroma/light.less @@ -1,4 +1,4 @@ -/* stylelint-disable */ +/* stylelint-disable block-no-empty */ .chroma .bp { color: #999999; } /* NameBuiltinPseudo */ .chroma .c { color: #6a737d; } /* Comment */ From cc279dc43c57cab0e9941a4a64c6766dbe714fd7 Mon Sep 17 00:00:00 2001 From: silverwind Date: Thu, 9 Mar 2023 23:05:04 +0100 Subject: [PATCH 3/5] move stylelint override to config --- .stylelintrc.yaml | 3 +++ web_src/less/chroma/dark.less | 2 -- web_src/less/chroma/light.less | 2 -- 3 files changed, 3 insertions(+), 4 deletions(-) diff --git a/.stylelintrc.yaml b/.stylelintrc.yaml index 6ddc28e7ac344..0ad0b9b273ada 100644 --- a/.stylelintrc.yaml +++ b/.stylelintrc.yaml @@ -10,6 +10,9 @@ overrides: - files: ["**/chroma/*", "**/codemirror/*", "**/standalone/*", "**/console/*"] rules: scale-unlimited/declaration-strict-value: null + - files: ["**/chroma/*"] + rules: + block-no-empty: null rules: alpha-value-notation: null diff --git a/web_src/less/chroma/dark.less b/web_src/less/chroma/dark.less index f7820a790ee3e..1b0c722a164c5 100644 --- a/web_src/less/chroma/dark.less +++ b/web_src/less/chroma/dark.less @@ -1,5 +1,3 @@ -/* stylelint-disable block-no-empty */ - .chroma .bp { color: #fabd2f; } /* NameBuiltinPseudo */ .chroma .c { color: #777e94; } /* Comment */ .chroma .c1 { color: #777e94; } /* CommentSingle */ diff --git a/web_src/less/chroma/light.less b/web_src/less/chroma/light.less index 99b2619fda390..4bfce8fe71720 100644 --- a/web_src/less/chroma/light.less +++ b/web_src/less/chroma/light.less @@ -1,5 +1,3 @@ -/* stylelint-disable block-no-empty */ - .chroma .bp { color: #999999; } /* NameBuiltinPseudo */ .chroma .c { color: #6a737d; } /* Comment */ .chroma .c1 { color: #6a737d; } /* CommentSingle */ From da2031076ab6e9b03d767d9516128a61a7344123 Mon Sep 17 00:00:00 2001 From: silverwind Date: Fri, 10 Mar 2023 00:53:50 +0100 Subject: [PATCH 4/5] Update .stylelintrc.yaml --- .stylelintrc.yaml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.stylelintrc.yaml b/.stylelintrc.yaml index 0ad0b9b273ada..c488d0677f18a 100644 --- a/.stylelintrc.yaml +++ b/.stylelintrc.yaml @@ -10,7 +10,7 @@ overrides: - files: ["**/chroma/*", "**/codemirror/*", "**/standalone/*", "**/console/*"] rules: scale-unlimited/declaration-strict-value: null - - files: ["**/chroma/*"] + - files: ["**/chroma/*", "**/codemirror/*"] rules: block-no-empty: null From d76126484495228d35c2b1e9e40b6a304566a690 Mon Sep 17 00:00:00 2001 From: wxiaoguang Date: Fri, 10 Mar 2023 09:48:34 +0800 Subject: [PATCH 5/5] use "base.less" for chroma --- web_src/less/chroma/{overwrite.less => base.less} | 0 web_src/less/index.less | 2 +- web_src/less/themes/theme-arc-green.less | 2 +- 3 files changed, 2 insertions(+), 2 deletions(-) rename web_src/less/chroma/{overwrite.less => base.less} (100%) diff --git a/web_src/less/chroma/overwrite.less b/web_src/less/chroma/base.less similarity index 100% rename from web_src/less/chroma/overwrite.less rename to web_src/less/chroma/base.less diff --git a/web_src/less/index.less b/web_src/less/index.less index a164cde4673f3..5d55b9291f6c9 100644 --- a/web_src/less/index.less +++ b/web_src/less/index.less @@ -15,8 +15,8 @@ @import "./code/linebutton.less"; @import "./markup/asciicast.less"; +@import "./chroma/base.less"; @import "./chroma/light.less"; -@import "./chroma/overwrite.less"; @import "./codemirror/base.less"; @import "./codemirror/light.less"; @import "./console/console.less"; diff --git a/web_src/less/themes/theme-arc-green.less b/web_src/less/themes/theme-arc-green.less index 46cb728fe83b2..17b8f9bae0347 100644 --- a/web_src/less/themes/theme-arc-green.less +++ b/web_src/less/themes/theme-arc-green.less @@ -1,5 +1,5 @@ +@import "../chroma/base.less"; @import "../chroma/dark.less"; -@import "../chroma/overwrite.less"; @import "../codemirror/dark.less"; :root {