Skip to content

Commit 9798f74

Browse files
MrWangJustToDoMrWangJustToDo
committed
update
1 parent e96191b commit 9798f74

File tree

4 files changed

+137
-311
lines changed

4 files changed

+137
-311
lines changed

‎packages/cli/gen.mjs‎

Lines changed: 38 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,38 @@
1+
import fs from "fs";
2+
import path from "path";
3+
import { parse } from "postcss";
4+
import process from "process";
5+
6+
const readCssFile = async (filePath) => {
7+
const fullPath = path.resolve(process.cwd(), filePath);
8+
return await fs.promises.readFile(fullPath, { encoding: "utf-8" });
9+
};
10+
11+
function cssToJson(cssString) {
12+
const root = parse(cssString);
13+
const result = {};
14+
15+
root.walkRules((rule) => {
16+
const styles = {};
17+
18+
rule.walkDecls((decl) => {
19+
styles[decl.prop] = decl.value;
20+
});
21+
22+
rule.selectors.forEach((selector) => {
23+
if (selector.includes(" ")) return;
24+
result[selector.startsWith(".") ? selector.slice(1) : selector] = styles;
25+
});
26+
});
27+
28+
return result;
29+
}
30+
31+
const start = async () => {
32+
const cssFilePath = "node_modules/highlight.js/styles/github-dark.css";
33+
const cssContent = await readCssFile(cssFilePath);
34+
const re = cssToJson(cssContent);
35+
console.log("CSS to JSON conversion result:", re);
36+
};
37+
38+
start();

‎packages/cli/package.json‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -20,6 +20,7 @@
2020
},
2121
"scripts": {
2222
"dev": "DEV=true node ./test/index.mjs",
23+
"gen:color": "node ./gen.mjs",
2324
"gen:type": "dts-bundle-generator -o index.d.ts dist/types/index.d.ts"
2425
},
2526
"homepage": "https://mrwangjusttodo.github.io/git-diff-view",

‎packages/cli/src/components/color.ts‎

Lines changed: 1 addition & 311 deletions
Original file line numberDiff line numberDiff line change
@@ -1,314 +1,4 @@
1-
// color from gemini-cli SEE https://github.com/google-gemini/gemini-cli/tree/main/packages/cli/src/ui/themes
2-
3-
const githubLightColors = {
4-
type: "light",
5-
Background: "#f8f8f8",
6-
Foreground: "#24292E",
7-
LightBlue: "#0086b3",
8-
AccentBlue: "#458",
9-
AccentPurple: "#900",
10-
AccentCyan: "#009926",
11-
AccentGreen: "#008080",
12-
AccentYellow: "#990073",
13-
AccentRed: "#d14",
14-
DiffAdded: "#C6EAD8",
15-
DiffRemoved: "#FFCCCC",
16-
Comment: "#998",
17-
Gray: "#999",
18-
GradientColors: ["#458", "#008080"],
19-
} as const;
20-
21-
const githubDarkColors = {
22-
type: "dark",
23-
Background: "#24292e",
24-
Foreground: "#d1d5da",
25-
LightBlue: "#79B8FF",
26-
AccentBlue: "#79B8FF",
27-
AccentPurple: "#B392F0",
28-
AccentCyan: "#9ECBFF",
29-
AccentGreen: "#85E89D",
30-
AccentYellow: "#FFAB70",
31-
AccentRed: "#F97583",
32-
DiffAdded: "#3C4636",
33-
DiffRemoved: "#502125",
34-
Comment: "#6A737D",
35-
Gray: "#6A737D",
36-
GradientColors: ["#79B8FF", "#85E89D"],
37-
} as const;
38-
39-
export const GitHubLight = {
40-
hljs: {
41-
display: "block",
42-
overflowX: "auto",
43-
padding: "0.5em",
44-
background: githubLightColors.Background,
45-
color: githubLightColors.Foreground,
46-
},
47-
"hljs-keyword": {
48-
color: githubLightColors.AccentBlue,
49-
},
50-
"hljs-literal": {
51-
color: githubLightColors.AccentBlue,
52-
},
53-
"hljs-symbol": {
54-
color: githubLightColors.AccentBlue,
55-
},
56-
"hljs-name": {
57-
color: githubLightColors.AccentBlue,
58-
},
59-
"hljs-link": {
60-
color: githubLightColors.AccentBlue,
61-
textDecoration: "underline",
62-
},
63-
"hljs-built_in": {
64-
color: githubLightColors.AccentCyan,
65-
},
66-
"hljs-type": {
67-
color: githubLightColors.AccentCyan,
68-
},
69-
"hljs-number": {
70-
color: githubLightColors.AccentGreen,
71-
},
72-
"hljs-class": {
73-
color: githubLightColors.AccentGreen,
74-
},
75-
"hljs-string": {
76-
color: githubLightColors.AccentYellow,
77-
},
78-
"hljs-meta-string": {
79-
color: githubLightColors.AccentYellow,
80-
},
81-
"hljs-regexp": {
82-
color: githubLightColors.AccentRed,
83-
},
84-
"hljs-template-tag": {
85-
color: githubLightColors.AccentRed,
86-
},
87-
"hljs-subst": {
88-
color: githubLightColors.Foreground,
89-
},
90-
"hljs-function": {
91-
color: githubLightColors.Foreground,
92-
},
93-
"hljs-title": {
94-
color: githubLightColors.Foreground,
95-
},
96-
"hljs-params": {
97-
color: githubLightColors.Foreground,
98-
},
99-
"hljs-formula": {
100-
color: githubLightColors.Foreground,
101-
},
102-
"hljs-comment": {
103-
color: githubLightColors.Comment,
104-
fontStyle: "italic",
105-
},
106-
"hljs-quote": {
107-
color: githubLightColors.Comment,
108-
fontStyle: "italic",
109-
},
110-
"hljs-doctag": {
111-
color: githubLightColors.Comment,
112-
},
113-
"hljs-meta": {
114-
color: githubLightColors.Gray,
115-
},
116-
"hljs-meta-keyword": {
117-
color: githubLightColors.Gray,
118-
},
119-
"hljs-tag": {
120-
color: githubLightColors.Gray,
121-
},
122-
"hljs-variable": {
123-
color: githubLightColors.AccentPurple,
124-
},
125-
"hljs-template-variable": {
126-
color: githubLightColors.AccentPurple,
127-
},
128-
"hljs-attr": {
129-
color: githubLightColors.LightBlue,
130-
},
131-
"hljs-attribute": {
132-
color: githubLightColors.LightBlue,
133-
},
134-
"hljs-builtin-name": {
135-
color: githubLightColors.LightBlue,
136-
},
137-
"hljs-section": {
138-
color: githubLightColors.AccentYellow,
139-
},
140-
"hljs-emphasis": {
141-
fontStyle: "italic",
142-
},
143-
"hljs-strong": {
144-
fontWeight: "bold",
145-
},
146-
"hljs-bullet": {
147-
color: githubLightColors.AccentYellow,
148-
},
149-
"hljs-selector-tag": {
150-
color: githubLightColors.AccentYellow,
151-
},
152-
"hljs-selector-id": {
153-
color: githubLightColors.AccentYellow,
154-
},
155-
"hljs-selector-class": {
156-
color: githubLightColors.AccentYellow,
157-
},
158-
"hljs-selector-attr": {
159-
color: githubLightColors.AccentYellow,
160-
},
161-
"hljs-selector-pseudo": {
162-
color: githubLightColors.AccentYellow,
163-
},
164-
"hljs-addition": {
165-
backgroundColor: githubLightColors.AccentGreen,
166-
display: "inline-block",
167-
width: "100%",
168-
},
169-
"hljs-deletion": {
170-
backgroundColor: githubLightColors.AccentRed,
171-
display: "inline-block",
172-
width: "100%",
173-
},
174-
};
175-
176-
export const GitHubDark = {
177-
hljs: {
178-
display: "block",
179-
overflowX: "auto",
180-
padding: "0.5em",
181-
background: githubDarkColors.Background,
182-
color: githubDarkColors.Foreground,
183-
},
184-
"hljs-keyword": {
185-
color: githubDarkColors.AccentBlue,
186-
},
187-
"hljs-literal": {
188-
color: githubDarkColors.AccentBlue,
189-
},
190-
"hljs-symbol": {
191-
color: githubDarkColors.AccentBlue,
192-
},
193-
"hljs-name": {
194-
color: githubDarkColors.AccentBlue,
195-
},
196-
"hljs-link": {
197-
color: githubDarkColors.AccentBlue,
198-
textDecoration: "underline",
199-
},
200-
"hljs-built_in": {
201-
color: githubDarkColors.AccentCyan,
202-
},
203-
"hljs-type": {
204-
color: githubDarkColors.AccentCyan,
205-
},
206-
"hljs-number": {
207-
color: githubDarkColors.AccentGreen,
208-
},
209-
"hljs-class": {
210-
color: githubDarkColors.AccentGreen,
211-
},
212-
"hljs-string": {
213-
color: githubDarkColors.AccentYellow,
214-
},
215-
"hljs-meta-string": {
216-
color: githubDarkColors.AccentYellow,
217-
},
218-
"hljs-regexp": {
219-
color: githubDarkColors.AccentRed,
220-
},
221-
"hljs-template-tag": {
222-
color: githubDarkColors.AccentRed,
223-
},
224-
"hljs-subst": {
225-
color: githubDarkColors.Foreground,
226-
},
227-
"hljs-function": {
228-
color: githubDarkColors.Foreground,
229-
},
230-
"hljs-title": {
231-
color: githubDarkColors.Foreground,
232-
},
233-
"hljs-params": {
234-
color: githubDarkColors.Foreground,
235-
},
236-
"hljs-formula": {
237-
color: githubDarkColors.Foreground,
238-
},
239-
"hljs-comment": {
240-
color: githubDarkColors.Comment,
241-
fontStyle: "italic",
242-
},
243-
"hljs-quote": {
244-
color: githubDarkColors.Comment,
245-
fontStyle: "italic",
246-
},
247-
"hljs-doctag": {
248-
color: githubDarkColors.Comment,
249-
},
250-
"hljs-meta": {
251-
color: githubDarkColors.Gray,
252-
},
253-
"hljs-meta-keyword": {
254-
color: githubDarkColors.Gray,
255-
},
256-
"hljs-tag": {
257-
color: githubDarkColors.Gray,
258-
},
259-
"hljs-variable": {
260-
color: githubDarkColors.AccentPurple,
261-
},
262-
"hljs-template-variable": {
263-
color: githubDarkColors.AccentPurple,
264-
},
265-
"hljs-attr": {
266-
color: githubDarkColors.LightBlue,
267-
},
268-
"hljs-attribute": {
269-
color: githubDarkColors.LightBlue,
270-
},
271-
"hljs-builtin-name": {
272-
color: githubDarkColors.LightBlue,
273-
},
274-
"hljs-section": {
275-
color: githubDarkColors.AccentYellow,
276-
},
277-
"hljs-emphasis": {
278-
fontStyle: "italic",
279-
},
280-
"hljs-strong": {
281-
fontWeight: "bold",
282-
},
283-
"hljs-bullet": {
284-
color: githubDarkColors.AccentYellow,
285-
},
286-
"hljs-selector-tag": {
287-
color: githubDarkColors.AccentYellow,
288-
},
289-
"hljs-selector-id": {
290-
color: githubDarkColors.AccentYellow,
291-
},
292-
"hljs-selector-class": {
293-
color: githubDarkColors.AccentYellow,
294-
},
295-
"hljs-selector-attr": {
296-
color: githubDarkColors.AccentYellow,
297-
},
298-
"hljs-selector-pseudo": {
299-
color: githubDarkColors.AccentYellow,
300-
},
301-
"hljs-addition": {
302-
backgroundColor: githubDarkColors.AccentGreen,
303-
display: "inline-block",
304-
width: "100%",
305-
},
306-
"hljs-deletion": {
307-
backgroundColor: githubDarkColors.AccentRed,
308-
display: "inline-block",
309-
width: "100%",
310-
},
311-
};
1+
export { GitHubDark, GitHubLight } from "./highlightColor";
3122

3133
export const diffBorder = {
3144
light: "#dedede",

0 commit comments

Comments
 (0)