根据文档调整界面样式

snowy-admin-web/src/config/index.js

@@ -34,7 +34,7 @@ const DEFAULT_CONFIG = {
 	REQUEST_CACHE: false,
 
 	// 布局 经典：classical，双排菜单：doublerow, 顶栏菜单：top
-	SNOWY_LAYOUT: 'doublerow',
+	SNOWY_LAYOUT: 'classical',
 
 	// 菜单是否折叠
 	SNOWY_MENU_COLLAPSE: false,
@@ -43,7 +43,7 @@ const DEFAULT_CONFIG = {
 	SNOWY_MODULE_UNFOLD_OPEN: true,
 
 	// 是否开启多标签
-	SNOWY_LAYOUT_TAGS_OPEN: true,
+	SNOWY_LAYOUT_TAGS_OPEN: false,
 
 	// 是否开启展示面包屑
 	SNOWY_BREADCRUMB_OPEN: false,
@@ -70,13 +70,13 @@ const DEFAULT_CONFIG = {
 	LANG: 'zh-cn',
 
 	// 主题颜色
-	COLOR: '#1677FF',
+	COLOR: '#272a31',
 
 	// 默认整体主题
 	SNOWY_THEME: 'dark',
 
 	// 整体表单风格
-	SNOWY_FORM_STYLE: 'drawer',
+	SNOWY_FORM_STYLE: 'modal',
 
 	// 系统基础配置，这些是数据库中保存起来的
 	SYS_BASE_CONFIG: {

snowy-admin-web/src/config/settingConfig.js

@@ -51,7 +51,7 @@ const colorList = [
 	},
 	{
 		key: '主题黑',
-		color: '#001529'
+		color: '#272a31'
 	}
 ]
 

snowy-admin-web/src/layout/components/NavMenu.vue

@@ -7,6 +7,7 @@
 			<template v-if="navMenu.meta.icon" #icon>
 				<component :is="navMenu.meta.icon" />
 			</template>
+
 			<a
 				v-if="navMenu.meta && navMenu.meta.type === 'link'"
 				:href="navMenu.path"
@@ -14,7 +15,7 @@
 				@click.stop="() => {}"
 				>{{ navMenu.meta.title }}</a
 			>
-			<a v-else>{{ navMenu.meta.title }}</a>
+			<a v-else> {{ navMenu.meta.title }}</a>
 		</a-menu-item>
 		<a-sub-menu v-else-if="!hasHidden(navMenu)" :key="navMenu.path" :title="navMenu.meta.title">
 			<template v-if="navMenu.meta.icon" #icon>
@@ -46,7 +47,7 @@
 		return false
 	}
 </script>
-<style>
+<style lang="less">
 	.ant-menu-light.ant-menu-horizontal > .ant-menu-submenu-selected {
 		background-color: var(--primary-1);
 	}
@@ -62,4 +63,69 @@
 	.xn-pd20 {
 		padding: 20px;
 	}
+
+	/* 经典模式子菜单 */
+	.ant-menu-dark.ant-menu-inline ul {
+		width: 95%;
+		margin: 0 0 0 5%;
+		background-color: #1b1c1e !important;
+
+		li {
+			width: 90%;
+			margin: -2px 0 0 20px;
+			position: relative;
+			padding-left: 20px !important;
+			border-left: 1px solid #c3c4c5 !important;
+			transition:
+				background-color 0.3s ease,
+				border 0.3s ease;
+
+			span {
+				display: inline-block;
+			}
+			.ant-menu-item-icon {
+				height: 100%;
+				padding: 10% 10px !important;
+			}
+			.ant-menu-title-content {
+				margin: 0 !important;
+			}
+		}
+
+		li::before {
+			content: '';
+			position: absolute;
+			top: -10px;
+			left: -2px;
+			width: 19px;
+			height: 30px;
+			transform: rotate(11deg) !important;
+			border-bottom: 1px solid #c3c4c5;
+			border-bottom-left-radius: 15px;
+		}
+
+		// 选中时候的样式
+
+		.ant-menu-item-selected {
+			span {
+				background-color: #272a31;
+				display: inline-block;
+			}
+			.ant-menu-item-icon {
+				height: 100%;
+				padding: 8% 10px !important;
+				border-top-left-radius: 10px;
+				border-bottom-left-radius: 10px;
+			}
+			.ant-menu-title-content {
+				margin: 0 !important;
+				border-top-right-radius: 10px;
+				border-bottom-right-radius: 10px;
+			}
+		}
+	}
+	// 选中时候的样式
+	.ant-menu-dark .ant-menu-item-selected {
+		background-color: none !important;
+	}
 </style>

snowy-admin-web/src/layout/components/setting.vue

@@ -362,7 +362,7 @@
 	}
 	.snowy-setting-checkbox-item-dark::before {
 		z-index: 1;
-		background-color: #001529;
+		background-color: #272a31;
 		content: '';
 	}
 	.snowy-setting-checkbox-item-dark::after {
@@ -389,7 +389,7 @@
 		position: absolute;
 		right: 8px;
 		bottom: 8px;
-		color: #1677FF;
+		color: #1677ff;
 		font-weight: 700;
 		font-size: 14px;
 		pointer-events: none;
@@ -416,7 +416,7 @@
 	.snowy-setting-layout-menu-doublerow::before {
 		z-index: 1;
 		width: 16%;
-		background-color: #001529;
+		background-color: #272a31;
 		content: '';
 	}
 	.snowy-setting-layout-menu-doublerow-inner {
@@ -445,7 +445,7 @@
 	}
 	.snowy-setting-layout-menu-classical::before {
 		z-index: 1;
-		background-color: #001529;
+		background-color: #272a31;
 		content: '';
 	}
 	.snowy-setting-layout-menu-classical::after {
@@ -474,7 +474,7 @@
 		left: 0;
 		width: 100%;
 		height: 25%;
-		background-color: #001529;
+		background-color: #272a31;
 		content: '';
 	}
 	.scrollbar {

snowy-admin-web/src/layout/menu/classicalMenu.vue

@@ -7,6 +7,7 @@
 			collapsible
 			:theme="sideTheme"
 			width="250"
+			:style="{ backgroundColor: sideTheme && sideTheme == 'dark' ? '#1b1c1e' : '' }"
 		>
 			<header id="snowyHeaderLogo" class="snowy-header-logo">
 				<div class="snowy-header-left">
@@ -21,8 +22,8 @@
 					<a-menu
 						v-bind:openKeys="openKeys"
 						v-bind:selectedKeys="selectedKeys"
-						:theme="sideTheme"
 						mode="inline"
+						:theme="sideTheme"
 						@select="onSelect"
 						@openChange="onOpenChange"
 					>
@@ -112,6 +113,18 @@
 	}
 </script>
 <style lang="less" scoped>
+	// 经典模式
+	.ant-layout-sider-dark {
+		// 菜单栏logo 标题 部分
+		.snowy-header-logo {
+			background-color: #1b1c1e;
+		}
+
+		.ant-menu {
+			background-color: #1b1c1e;
+		}
+	}
+
 	.xn-color-fff {
 		color: #fff;
 	}

snowy-admin-web/src/style/default.less

@@ -192,9 +192,9 @@
 
 	// Layout
 	--layout-body-background: #f0f2f5;
-	--layout-header-background: #001529;
+	--layout-header-background: #272a31;
 	--layout-trigger-background: #002140;
-	//--layout-sider-background-1: coverTintMixin(#001529, 10%);
+	//--layout-sider-background-1: coverTintMixin(#272a31, 10%);
 
 	// Dropdown 有两个
 	--dropdown-menu-bg: @component-background;
@@ -242,7 +242,7 @@
 	// Menu
 	--menu-popup-bg: @component-background;
 	--menu-dark-bg: @layout-header-background;
-	--menu-dark-inline-submenu-bg: #000c17;
+	--menu-dark-inline-submenu-bg: #1b1c1e;
 
 	// Table
 	--table-header-bg: @background-color-light;

snowy-admin-web/src/style/index.less

@@ -192,7 +192,7 @@ a, button, input, textarea {
 }
 
 .top-snowy-header {
-	background: #001529;
+	background: #272a31;
 	color: white;
 }
 .top-snowy-header-light {