diff --git a/src/layout/components/lay-setting/index.vue b/src/layout/components/lay-setting/index.vue
index d9d97dbb2..21c7cc724 100644
--- a/src/layout/components/lay-setting/index.vue
+++ b/src/layout/components/lay-setting/index.vue
@@ -345,8 +345,8 @@ onUnmounted(() => removeMatchMedia);
@click="setLayoutThemeColor(item.themeColor)"
>
@@ -538,17 +538,24 @@ onUnmounted(() => removeMatchMedia);
}
.theme-color {
- height: 20px;
+ display: flex;
+ gap: 8px;
+ margin-top: 8px;
li {
- float: left;
- height: 20px;
- margin-right: 8px;
+ position: relative;
+ width: 21px;
+ height: 21px;
cursor: pointer;
border-radius: 4px;
+ box-shadow: rgb(0 0 0 / 15%) 0 0 0 1px inset;
+ transition: all 0.2s ease;
- &:nth-child(1) {
- border: 1px solid #ddd;
+ &:hover {
+ box-shadow:
+ rgb(0 0 0 / 25%) 0 0 0 1px inset,
+ 0 2px 4px rgb(0 0 0 / 15%);
+ transform: scale(1.1);
}
}
}
diff --git a/src/layout/components/lay-sidebar/NavHorizontal.vue b/src/layout/components/lay-sidebar/NavHorizontal.vue
index 9ccebccec..3bd0939e3 100644
--- a/src/layout/components/lay-sidebar/NavHorizontal.vue
+++ b/src/layout/components/lay-sidebar/NavHorizontal.vue
@@ -83,9 +83,11 @@ onMounted(() => {
diff --git a/src/layout/components/lay-sidebar/NavMix.vue b/src/layout/components/lay-sidebar/NavMix.vue
index d5f9e9838..22c8cc15c 100644
--- a/src/layout/components/lay-sidebar/NavMix.vue
+++ b/src/layout/components/lay-sidebar/NavMix.vue
@@ -104,9 +104,11 @@ watch(
diff --git a/src/layout/components/lay-sidebar/components/SidebarFullScreen.vue b/src/layout/components/lay-sidebar/components/SidebarFullScreen.vue
index 4d38bd0c7..9ea524599 100644
--- a/src/layout/components/lay-sidebar/components/SidebarFullScreen.vue
+++ b/src/layout/components/lay-sidebar/components/SidebarFullScreen.vue
@@ -24,7 +24,10 @@ watch(
-
+
diff --git a/src/style/dark.scss b/src/style/dark.scss
index 467aa6acc..7c4d755b4 100644
--- a/src/style/dark.scss
+++ b/src/style/dark.scss
@@ -135,17 +135,6 @@ html.dark {
}
}
- /* 系统配置面板 */
- .right-panel-items {
- .el-divider__text {
- --el-bg-color: var(--el-bg-color);
- }
-
- .el-divider--horizontal {
- border-top: none;
- }
- }
-
/* 表单设计器 */
.design-form {
.el-main.config-content,
diff --git a/src/style/index.scss b/src/style/index.scss
index aac8c32a7..e0f6ddc19 100644
--- a/src/style/index.scss
+++ b/src/style/index.scss
@@ -35,3 +35,18 @@
.html-weakness {
filter: invert(80%);
}
+
+/* 轻微缩小，再恢复原状的平滑缩放动画 */
+@keyframes pure-scale-bounce {
+ 0% {
+ transform: scale(1);
+ }
+
+ 50% {
+ transform: scale(0.9);
+ }
+
+ 100% {
+ transform: scale(1);
+ }
+}
diff --git a/src/style/sidebar.scss b/src/style/sidebar.scss
index 52c6a9306..83142b76a 100644
--- a/src/style/sidebar.scss
+++ b/src/style/sidebar.scss
@@ -34,12 +34,14 @@
}
.set-icon,
- .fullscreen-icon {
+ .fullscreen-icon,
+ .globalization-icon {
display: flex;
align-items: center;
justify-content: center;
width: 40px;
height: 48px;
+ font-size: 16px;
cursor: pointer;
}
@@ -449,7 +451,7 @@
/* 搜索 */
.search-container,
/* 国际化 */
- .globalization,
+ .globalization-icon,
/* 全屏 */
.fullscreen-icon,
/* 消息通知 */
@@ -468,15 +470,6 @@
color: var(--pure-theme-sub-menu-active-text);
}
- .globalization {
- width: 40px;
- height: 48px;
- padding: 11px;
- color: var(--pure-theme-sub-menu-active-text);
- cursor: pointer;
- outline: none;
- }
-
.el-dropdown-link {
display: flex;
align-items: center;
@@ -630,7 +623,7 @@ body[layout="vertical"] {
/* 搜索 */
.search-container,
/* 国际化 */
- .globalization,
+ .globalization-icon,
/* 全屏 */
.fullscreen-icon,
/* 消息通知 */
diff --git a/src/style/tailwind.css b/src/style/tailwind.css
index e495ae295..937e0695a 100644
--- a/src/style/tailwind.css
+++ b/src/style/tailwind.css
@@ -44,3 +44,7 @@
@utility navbar-bg-hover {
@apply dark:text-white dark:hover:bg-[#242424]!;
}
+
+@utility animate-scale-bounce {
+ animation: pure-scale-bounce 0.3s ease-in-out;
+}
diff --git a/src/views/tabs/index.vue b/src/views/tabs/index.vue
index 7380104a6..efc62b4d2 100644
--- a/src/views/tabs/index.vue
+++ b/src/views/tabs/index.vue
@@ -102,7 +102,6 @@ function onCloseTags() {
default-expand-all
:props="{
label: data => transformI18n(data.meta.title),
- value: 'uniqueId',
children: 'children',
disabled: 'disabled'
}"