YoreseeDoc/frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

simplify dark mode related styles

Browse Source
This commit is contained in:
XingfenD
2026-08-11 15:15:26 +08:00
parent fb8f52fe76
commit 4c9b5d4f5d
16 changed files with 24 additions and 111 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/base/AppMenu.vue
-5
View File
@@ -188,9 +188,4 @@ defineExpose({
box-shadow: var(--shadow-md);
padding: var(--spacing-xs) 0;
}
.dark-mode .app-menu {
background-color: var(--bg-white);
border-color: var(--border-color);
}
</style>
src/components/base/AppMenuItem.vue
+1 -1
View File
@@ -56,7 +56,7 @@ const handleClick = () => {
}
.dark-mode .app-menu-item:hover {
background-color: rgba(255, 255, 255, 0.08);
background-color: var(--hover-overlay);
}
.app-menu-item.is-danger:hover {
src/components/document/DirectorySidebar.vue
-9
View File
@@ -93,10 +93,6 @@ defineExpose({
border-bottom: 1px solid var(--border-color);
}
:global(.dark-mode) .sidebar-header {
border-color: var(--border-color);
}
.sidebar-title {
padding: var(--spacing-md);
font-size: 16px;
@@ -108,11 +104,6 @@ defineExpose({
align-items: center;
}
:global(.dark-mode) .sidebar-title {
color: var(--text-dark);
border-color: var(--border-color);
}
.collapse-button {
padding: 4px;
color: var(--text-light);
src/components/document/DocumentTree.vue
+2 -15
View File
@@ -299,10 +299,6 @@ defineExpose({ treeRef, closeContextMenu });
border-bottom: 1px solid var(--border-color);
}
.dark-mode .tree-toolbar {
border-color: var(--border-color);
}
.tree-toolbar-actions {
display: flex;
align-items: center;
@@ -350,7 +346,7 @@ defineExpose({ treeRef, closeContextMenu });
}
.dark-mode .editor-tree :deep(.el-tree-node__content:hover) {
background-color: rgba(255, 255, 255, 0.08);
background-color: var(--hover-overlay);
}
.editor-tree :deep(.el-tree-node.is-current > .el-tree-node__content),
@@ -362,21 +358,12 @@ defineExpose({ treeRef, closeContextMenu });
outline: none;
}
.dark-mode .editor-tree :deep(.el-tree-node.is-current > .el-tree-node__content),
.dark-mode .editor-tree :deep(.el-tree-node.is-focus > .el-tree-node__content),
.dark-mode .editor-tree :deep(.el-tree-node:focus-within > .el-tree-node__content),
.dark-mode .editor-tree :deep(.el-tree-node__content:focus),
.dark-mode .editor-tree :deep(.el-tree-node__content:focus-visible) {
background-color: transparent;
outline: none;
}
.tree-node-content.is-selected {
background-color: rgba(22, 93, 255, 0.1);
}
.dark-mode .tree-node-content.is-selected {
background-color: rgba(64, 128, 255, 0.35);
background-color: var(--selected-overlay);
}
.tree-node-content {
src/components/list/CardListSection.vue
-16
View File
@@ -228,20 +228,4 @@ const resolveMetaRows = (item) => {
background-color: var(--bg-white);
border: 1px solid var(--border-color);
}
.dark-mode .item-name {
color: var(--text-dark);
}
.dark-mode .item-description {
color: var(--text-medium);
}
.dark-mode .meta-label {
color: var(--text-light);
}
.dark-mode .meta-value {
color: var(--text-medium);
}
</style>
src/components/list/common/CommonListPagination.vue
+6 -6
View File
@@ -148,21 +148,21 @@ const innerPageSize = computed({
}
:global(.dark-mode .common-list-pagination-popper.el-popper) {
background: #1a2230;
border-color: #2f3b4d;
background: var(--bg-medium);
border-color: var(--border-color);
}
:global(.dark-mode .common-list-pagination-popper .el-select-dropdown__item) {
color: #e5e7eb;
color: var(--text-primary);
}
:global(.dark-mode .common-list-pagination-popper .el-select-dropdown__item.is-hovering),
:global(.dark-mode .common-list-pagination-popper .el-select-dropdown__item:hover) {
background: #233147;
background: var(--hover-overlay);
}
:global(.dark-mode .common-list-pagination-popper .el-select-dropdown__item.is-selected) {
color: #ffffff;
background: #3370ff;
color: var(--bg-white);
background: var(--primary-color);
}
</style>
src/components/manage/InviteCreateDialog.vue
-22
View File
@@ -173,26 +173,4 @@ watch(
align-items: center;
gap: var(--spacing-md);
}
.dark-mode :deep(.el-input-number__decrease),
.dark-mode :deep(.el-input-number__increase) {
background-color: var(--bg-medium);
color: var(--text-dark);
border-color: var(--border-color);
}
.dark-mode :deep(.el-switch) {
--el-switch-on-color: #3a7afe;
--el-switch-off-color: #3a3a3a;
}
.dark-mode :deep(.el-date-editor),
.dark-mode :deep(.el-date-editor .el-input__wrapper) {
background-color: var(--bg-medium);
border-color: var(--border-color);
}
.dark-mode :deep(.el-date-editor .el-input__inner) {
color: var(--text-dark);
}
</style>
src/components/manage/ManageSection.vue
+4 -4
View File
@@ -70,8 +70,8 @@ const showHeader = computed(() => Boolean(props.title || slots.header));
}
.dark-mode .manage-section {
background: #161b22;
border-color: #2b2f36;
background: var(--bg-white);
border-color: var(--border-color);
}
.dark-mode .manage-section--plain {
@@ -80,7 +80,7 @@ const showHeader = computed(() => Boolean(props.title || slots.header));
}
.dark-mode .section-header {
background: #161b22;
border-bottom-color: #2b2f36;
background: var(--bg-white);
border-bottom-color: var(--border-color);
}
</style>
src/components/shared/InfoStatsCard.vue
-17
View File
@@ -83,21 +83,4 @@ const formatStatText = (stat) => {
flex-direction: column;
}
}
:global(.dark-mode) .info-stats-card {
background: var(--bg-medium);
border-color: var(--border-color);
}
:global(.dark-mode) .info-title {
color: var(--text-dark);
}
:global(.dark-mode) .info-description {
color: var(--text-medium);
}
:global(.dark-mode) .stat-item {
color: var(--text-medium);
}
</style>
src/styles/dark-mode-overrides.css
-1
View File
@@ -1,5 +1,4 @@
.dark-mode {
input[type="text"],
input[type="password"],
input[type="email"] {
src/styles/variables.css
+4
View File
@@ -122,4 +122,8 @@
--el-messagebox-content-color: var(--text-dark);
--el-loading-fill-color: rgba(16, 18, 22, 0.72);
--hover-overlay: rgba(255, 255, 255, 0.08);
--selected-overlay: rgba(64, 128, 255, 0.2);
--loading-overlay: rgba(11, 17, 26, 0.72);
}
src/views/document/DocumentAttachmentOpen.vue
+1 -1
View File
@@ -254,6 +254,6 @@ onMounted(async () => {
:global(.dark-mode) .preview-meta,
:global(.dark-mode) .preview-body {
background: var(--bg-secondary);
background: var(--bg-medium);
}
</style>
src/views/document/DocumentEditor.vue
-4
View File
@@ -495,10 +495,6 @@ watch(collabReady, async (ready) => {
transition: all 0.3s ease-in-out;
}
.dark-mode .editor-main {
background-color: var(--bg-white);
}
.editor-content {
flex: 1;
display: flex;
src/views/error/NotFound.vue
+1 -1
View File
@@ -95,7 +95,7 @@ const goBack = () => {
}
:global(body.dark-mode) .not-found-card {
box-shadow: none;
box-shadow: var(--shadow-sm);
}
@media (max-width: 640px) {
src/views/template/TemplatePreview.vue
+2 -6
View File
@@ -200,18 +200,14 @@ onMounted(() => {
padding: var(--spacing-lg) 0;
}
.dark-mode .template-preview {
background: var(--bg-white);
}
.dark-mode .template-preview-title {
color: #f3f4f6;
color: var(--text-primary);
}
.dark-mode .template-preview-meta,
.dark-mode .template-preview-desc,
.dark-mode .template-preview-date {
color: #cbd5e1;
color: var(--text-medium);
}
</style>
src/views/user/UserNotifications.vue
+3 -3
View File
@@ -216,14 +216,14 @@ const openDetail = (row) => {
}
.dark-mode .notice-main {
color: #e5e7eb;
color: var(--text-primary);
}
.dark-mode .notice-title.is-unread .notice-main {
color: #8ab4ff;
color: var(--primary-color);
}
.dark-mode .notice-sub {
color: #9aa4b2;
color: var(--text-light);
}
</style>