kingecg
/
regexptester
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

使用深色模式

This commit is contained in:
程广 2025-02-28 09:37:29 +08:00
parent 51450a75c7
commit 86d72edec5
3 changed files with 14 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
index.html
View File

@ -1,5 +1,5 @@
<!doctype html>
<html lang="">
<html lang="zh" class="dark">
<head>
<meta charset="UTF-8" />
<link rel="icon" href="/favicon.ico" />

22
src/components/RegExp.vue
View File

@ -119,7 +119,7 @@ onMounted(() => {
padding: 20px;
max-width: 600px;
margin: 0 auto;
background-color: #1e1e1e; /* 暗色背景 */
/* background-color: #1e1e1e; /* 暗色背景 */
border-radius: 8px;
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
}
@ -127,7 +127,7 @@ onMounted(() => {
h1,
h2 {
text-align: center;
color: #ffffff; /* 白色文字 */
/* color: #ffffff; /* 白色文字 */
}
.regex-input,
@ -144,47 +144,47 @@ h2 {
.results {
margin-top: 20px;
padding: 15px;
background-color: #2d2d2d; /* 暗色背景 */
/* background-color: #2d2d2d; /* 暗色背景 */
border-radius: 8px;
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
}
.result-item {
border: 1px solid #444444; /* 暗色边框 */
/* border: 1px solid #444444; /* 暗色边框 */
padding: 10px;
margin-bottom: 10px;
border-radius: 4px;
background-color: #333333; /* 暗色背景 */
/* background-color: #333333; /* 暗色背景 */
}
.result-item p {
margin: 5px 0;
color: #cccccc; /* 浅灰色文字 */
/*color: #cccccc; /* 浅灰色文字 */
}
/* 匹配示意图样式 */
.match-diagram {
margin-top: 20px;
padding: 15px;
background-color: #2d2d2d; /* 暗色背景 */
/*background-color: #2d2d2d; /* 暗色背景 */
border-radius: 8px;
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
}
.diagram-content {
padding: 10px;
background-color: #333333; /* 暗色背景 */
border: 1px solid #444444; /* 暗色边框 */
/*background-color: #333333; /* 暗色背景 */
/* border: 1px solid #444444; /* 暗色边框 */
border-radius: 4px;
}
.diagram-content pre {
margin: 0;
color: #cccccc; /* 浅灰色文字 */
/* color: #cccccc; /* 浅灰色文字 */
}
.highlight {
background-color: #ffeb3b; /* 高亮颜色 */
/* background-color: #ffeb3b; /* 高亮颜色 */
padding: 2px 4px;
border-radius: 3px;
}

2
src/main.ts
View File

@ -1,6 +1,8 @@
// main.ts 或 main.js
// main.ts 或 main.js
import 'element-plus/dist/index.css';
// if you just want to import css
import 'element-plus/theme-chalk/dark/css-vars.css'
import { createApp } from 'vue';
import App from './App.vue';
import ElementPlus from 'element-plus';