sgd.git - Gitblit

			@@ -1,16 +1,21 @@
			#app {

			.main-container {
			min-height: 100%;
			height: 100%;
			transition: margin-left .28s;
			margin-left: $sideBarWidth;
			margin-left: $base-sidebar-width;
			position: relative;
			}

			.sidebarHide {
			margin-left: 0!important;
			}

			.sidebar-container {
			-webkit-transition: width .28s;
			transition: width 0.28s;
			width: $sideBarWidth !important;
			background-color: $menuBg;
			width: $base-sidebar-width !important;
			background-color: $base-menu-background;
			height: 100%;
			position: fixed;
			font-size: 0px;
			@@ -19,6 +24,8 @@
			left: 0;
			z-index: 1001;
			overflow: hidden;
			-webkit-box-shadow: 2px 0 6px rgba(0,21,41,.35);
			box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.1);

			// reset element-ui css
			.horizontal-collapse-transition {
			@@ -54,7 +61,7 @@
			}

			.svg-icon {
			margin-right: 16px;
			margin-right: 10px !important;
			}

			.el-menu {
			@@ -63,25 +70,131 @@
			width: 100% !important;
			}

			.el-menu-item, .el-submenu__title {
			overflow: hidden !important;
			text-overflow: ellipsis !important;
			white-space: nowrap !important;
			height: 44px !important;
			line-height: 44px !important;
			}

			// menu hover
			.submenu-title-noDropdown,
			.el-submenu__title {
			&:hover {
			background-color: $menuHover !important;
			background-color: rgba(0, 0, 0, 0.06) !important;
			}
			}

			.is-active>.el-submenu__title {
			color: $subMenuActiveText !important;
			& .theme-dark .is-active > .el-submenu__title {
			color: $base-menu-color-active !important;
			}

			& .nest-menu .el-submenu>.el-submenu__title,
			& .el-submenu .el-menu-item {
			min-width: $sideBarWidth !important;
			background-color: $subMenuBg !important;
			min-width: $base-sidebar-width !important;

			&:hover {
			background-color: $subMenuHover !important;
			background-color: rgba(0, 0, 0, 0.06) !important;
			}
			}

			& .theme-dark .nest-menu .el-submenu>.el-submenu__title,
			& .theme-dark .el-submenu .el-menu-item {
			background-color: $base-sub-menu-background !important;

			&:hover {
			background-color: $base-sub-menu-hover !important;
			}
			}

			// theme-dark 深色主题
			&.theme-dark {
			box-shadow: 2px 0 8px rgba(0, 0, 0, 0.4);
			border-right: none;

			.el-menu-item.is-active {
			position: relative;

			&::before {
			content: '';
			position: absolute;
			inset: 0;
			background-color: var(--current-color-dark-bg, rgba(64, 158, 255, 0.2));
			border-right: 3px solid var(--current-color, #409eff);
			pointer-events: none;
			z-index: 1;
			}
			}

			.el-submenu.is-active > .el-submenu__title {
			color: var(--current-color, #409eff) !important;
			}

			.el-menu-item:not(.is-active),
			.submenu-title-noDropdown,
			.el-submenu__title {
			position: relative;

			&::before {
			content: '';
			position: absolute;
			inset: 0;
			background-color: transparent;
			pointer-events: none;
			z-index: 1;
			transition: background-color 0.2s;
			}

			&:hover::before {
			background-color: var(--current-color-dark-bg, rgba(64, 158, 255, 0.2));
			}
			}
			}

			// theme-light 浅色主题
			&.theme-light {
			border-right: 1px solid #e8eaf0;
			box-shadow: none;

			.el-menu-item,
			.el-submenu__title {
			color: rgba(0, 0, 0, 0.65);
			}

			.el-menu-item.is-active {
			color: var(--current-color, #409eff) !important;
			position: relative;

			&::before {
			content: '';
			position: absolute;
			inset: 0;
			background-color: var(--current-color-light, #ecf5ff);
			border-right: 3px solid var(--current-color, #409eff);
			pointer-events: none;
			z-index: 1;
			}
			}

			.el-submenu.is-active > .el-submenu__title {
			color: var(--current-color, #409eff) !important;
			}

			.el-menu-item:not(.is-active):hover,
			.submenu-title-noDropdown:hover,
			.el-submenu__title:hover {
			background-color: #f5f7fa !important;
			color: rgba(0, 0, 0, 0.85) !important;
			}

			.nest-menu .el-submenu > .el-submenu__title,
			.el-submenu .el-menu-item {
			background-color: #fafafa !important;

			&:hover {
			background-color: #f0f5ff !important;
			}
			}
			}
			}
			@@ -95,15 +208,17 @@
			margin-left: 54px;
			}

			.submenu-title-noDropdown {
			padding: 0 !important;
			position: relative;

			.el-tooltip {
			.el-menu:not(.el-menu--horizontal) {
			.submenu-title-noDropdown {
			padding: 0 !important;
			position: relative;

			.svg-icon {
			margin-left: 20px;
			.el-tooltip {
			padding: 0 !important;

			.svg-icon {
			margin-left: 20px;
			}
			}
			}
			}
			@@ -118,9 +233,6 @@
			margin-left: 20px;
			}

			.el-submenu__icon-arrow {
			display: none;
			}
			}
			}

			@@ -140,7 +252,7 @@
			}

			.el-menu--collapse .el-menu .el-submenu {
			min-width: $sideBarWidth !important;
			min-width: $base-sidebar-width !important;
			}

			// mobile responsive
			@@ -151,14 +263,14 @@

			.sidebar-container {
			transition: transform .28s;
			width: $sideBarWidth !important;
			width: $base-sidebar-width !important;
			}

			&.hideSidebar {
			.sidebar-container {
			pointer-events: none;
			transition-duration: 0.3s;
			transform: translate3d(-$sideBarWidth, 0, 0);
			transform: translate3d(-$base-sidebar-width, 0, 0);
			}
			}
			}
			@@ -184,7 +296,7 @@
			.el-menu-item {
			&:hover {
			// you can use $subMenuHover
			background-color: $menuHover !important;
			background-color: rgba(0, 0, 0, 0.06) !important;
			}
			}