Skip to content

feat: add dark theme #479

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 8 commits into from
Oct 19, 2025
Merged

feat: add dark theme #479

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
8 commits
Select commit Hold shift + click to select a range
43f9e58
feat: add dark theme
Sep 7, 2025
0c116cd
refactor: replace github icon in top bar
Sep 7, 2025
f86f5c4
fix: json editor dark theme
Sep 7, 2025
d3478bf
Merge branch 'dev' into pr/479
MakinoharaShoko Oct 2, 2025
1a35e48
fix: 修复主题ID类型问题，移除不必要的类型忽略注释
MakinoharaShoko Oct 19, 2025
4a111bc
Merge branch 'dev' into pr/479
MakinoharaShoko Oct 19, 2025
f1b2e74
不知为何加上 id 会导致切换主题后代码编辑器颜色模式不生效
MakinoharaShoko Oct 19, 2025
8ccb43c
Merge branch 'dev' into pr/479
MakinoharaShoko Oct 19, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
7 changes: 6 additions & 1 deletion packages/origine2/public/monaco-iframe/monaco.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,9 @@
require(['vs/editor/editor.main'], function () {
var editor = monaco.editor.create(document.getElementById('container'), {
value: '',
language: 'js' // 初始化语言为 javascript，可以根据需要修改
language: 'js', // 初始化语言为 javascript，可以根据需要修改
automaticLayout: true,
wordWrap: 'on',
});

// 通知父窗口 editor 已经准备好
Expand All @@ -49,6 +51,9 @@
]);
}
break;
case 'setTheme':
monaco.editor.setTheme(message.theme);
break;
}
});

Expand Down
2 changes: 1 addition & 1 deletion packages/origine2/src/config/highlighting/hl.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -99,7 +99,7 @@
]
},
"3": {
"name": "markup.quote"
"name": "variable.other.webgal"
}
}
}
Expand Down
72 changes: 0 additions & 72 deletions packages/origine2/src/config/themes/light-vs.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -35,69 +35,6 @@
"diffEditor.unchangedRegionBackground": "#f8f8f8"
},
"tokenColors": [
{
"scope": [
"keyword.operator.webgal"
],
"settings": {
"foreground": "#f9005a",
"fontStyle": "bold"
}
},
{
"scope": [
"keyword.operator.webgal"
],
"settings": {
"foreground": "#f9005a",
"fontStyle": "bold"
}
},
{
"scope": [
"string.unquoted.utterance.webgal"
],
"settings": {
"foreground": "#998f2f",
"fontStyle": "bold"
}
},
{
"scope": [
"meta.command.webgal",
"support.function.command.webgal"
],
"settings": {
"foreground": "#f9005a",
"fontStyle": "bold"
}
},
{
"scope": [
"meta.character.webgal",
"entity.name.type.character.webgal"
],
"settings": {
"foreground": "#684d99",
"fontStyle": "bold"
}
},
{
"scope": [
"variable.parameter.webgal",
],
"settings": {
"foreground": "#cf7000",
}
},
{
"scope": [
"variable.other.webgal",
],
"settings": {
"foreground": "#000000",
}
},
{
"scope": [
"meta.embedded",
Expand Down Expand Up @@ -127,15 +64,6 @@
"foreground": "#000080"
}
},
{
"scope": [
"comment",
"comment.line.webgal"
],
"settings": {
"foreground": "#999999"
}
},
{
"scope": "constant.language",
"settings": {
Expand Down
66 changes: 65 additions & 1 deletion packages/origine2/src/config/themes/monokai-light-vs.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,13 +4,77 @@
"colors": {
"editor.background": "#fafafa",
"editor.lineHighlightBackground": "#e6e3c3",
"editor.selectionBackground": "#ccc9ad",
"editor.selectionBackground": "#ccc9ad8e",
"editor.wordHighlightBackground": "#00000011",
"editorCursor.foreground": "#666663",
"editorIndentGuide.background": "#D3D4D5",
"editorLineNumber.foreground": "#a2a19c",
"editorWhitespace.foreground": "#bbbbb7"
},
"tokenColors": [
{
"scope": [
"comment",
"comment.line.webgal"
],
"settings": {
"foreground": "#999999"
}
},
{
"scope": [
"keyword.operator.webgal"
],
"settings": {
"foreground": "#ff2c80",
"fontStyle": "bold"
}
},
{
"scope": [
"string.unquoted.utterance.webgal"
],
"settings": {
"foreground": "#aca21a",
"fontStyle": "bold"
}
},
{
"scope": [
"meta.command.webgal",
"support.function.command.webgal"
],
"settings": {
"foreground": "#0075d4",
"fontStyle": "bold"
}
},
{
"scope": [
"meta.character.webgal",
"entity.name.type.character.webgal"
],
"settings": {
"foreground": "#8db118",
"fontStyle": "bold underline"
}
},
{
"scope": [
"variable.parameter.webgal",
],
"settings": {
"foreground": "#d88a14",
}
},
{
"scope": [
"variable.other.webgal",
],
"settings": {
"foreground": "#16c441",
}
},
Comment on lines +15 to +77
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

medium

这个文件中部分新增的 JSON 对象块（例如第 24 行和第 59 行）的缩进使用了制表符（Tab），而文件中的其他部分使用的是空格。为了保持代码风格的一致性，建议将文件中的制表符全部替换为空格。

{
"settings": {
"background": "#fafafa",
Expand Down
61 changes: 61 additions & 0 deletions packages/origine2/src/config/themes/theme.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -70,3 +70,64 @@
--shadow-primary-md: 0 1px 2px var(--primary-10pct);
--shadow-primary-lg: 0 2px 4px var(--primary-10pct);
}

.monaco-list-row:hover:not(.focused) {
background-color: var(--black-10pct) !important;
}

:root.dark {
--black: rgb(255, 255, 255);
--black-0pct: rgba(255, 255, 255, 0);
--black-5pct: rgba(255, 255, 255, 0.05);
--black-7pct: rgba(255, 255, 255, 0.07);
--black-10pct: rgba(255, 255, 255, 0.1);
--black-15pct: rgba(255, 255, 255, 0.15);
--black-35pct: rgba(255, 255, 255, 0.35);
--black-50pct: rgba(255, 255, 255, 0.5);
--black-75pct: rgba(255, 255, 255, 0.75);
--gray-dark: rgba(205, 208, 213, 1);
--gray-51: rgba(204, 204, 204, 1);
--gray-102: rgba(153, 153, 153, 1);
--gray-153: rgba(102, 102, 102, 1);
--gray-204: rgba(51, 51, 51, 1);
--gray-242: rgba(13, 13, 13, 1);
--gray-245: rgba(10, 10, 10, 1);
--gray-248: rgba(8, 8, 8, 1);
--blue-deep: rgba(122, 190, 255, 1);
--blue-deep-20pct: rgba(122, 190, 255, 0.2);
--blue-light: rgba(0, 128, 163, 1);
--blue-ultra-light: rgba(0, 3, 10, 1);
--blue-medium: rgba(133, 196, 255, 1);
--blue-medium-10pct: rgba(133, 196, 255, 0.1);
--blue-sky-50pct: rgba(128, 184, 255, 0.5);
--blue-navy: rgba(199, 223, 255, 1);
--white: rgb(0, 0, 0);

--primary: rgb(89, 178, 255);
--primary-5pct: rgba(89, 178, 255, 0.05);
--primary-10pct: rgba(89, 178, 255, 0.1);
--primary-90pct: rgba(89, 178, 255, 0.9);
--text: rgb(223, 223, 223);
--text-sub: rgb(150, 150, 150);
--text-weak: rgb(123, 123, 123);
--bg-base: rgb(0, 0, 0);
--bg-root: rgb(24, 24, 24);
--bg-card: rgb(30, 30, 30);
--bg-button: rgb(40, 40, 40);
--bg-input: rgb(40, 40, 40);
}

:root.dark ::-webkit-scrollbar {
width: 8px;
background: var(--bg-scrollbar);
}
:root.dark ::-webkit-scrollbar-thumb {
background: var(--bg-scrollbar-thumb);
border-radius: 4px;
}
:root.dark ::-webkit-scrollbar-thumb:hover {
background: var(--bg-scrollbar-thumb-hover);
}
:root.dark ::-webkit-scrollbar-corner {
background: var(--bg-scrollbar);
}
Loading