From 089bf5d2378b3c4a61d795b2a92bede2c193b771 Mon Sep 17 00:00:00 2001
From: admin <344137771@qq.com>
Date: Tue, 06 Jan 2026 11:22:58 +0800
Subject: [PATCH] 1
---
src/assets/scss/_base.scss | 470 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 470 insertions(+), 0 deletions(-)
diff --git a/src/assets/scss/_base.scss b/src/assets/scss/_base.scss
new file mode 100644
index 0000000..f5105f0
--- /dev/null
+++ b/src/assets/scss/_base.scss
@@ -0,0 +1,470 @@
+*,
+*:before,
+*:after {
+ // box-sizing: border-box;
+}
+body {
+ font-family: "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "微软雅黑", Arial, sans-serif;
+ font-size: 14px;
+ line-height: 1.15;
+ color: #303133;
+ background-color: #fff;
+}
+a {
+ color: mix(#fff, $--color-primary, 20%);
+ text-decoration: none;
+ &:focus,
+ &:hover {
+ color: $--color-primary;
+ text-decoration: underline;
+ }
+}
+img {
+ vertical-align: middle;
+ max-width: 100%;
+}
+
+.el-cascader-menu {
+ .el-scrollbar__wrap {
+ overflow-y: auto !important;
+ width: 100% !important;
+ margin: 0 !important;
+ overflow: auto !important;
+ }
+}
+
+/* Utils
+------------------------------ */
+.clearfix:before,
+.clearfix:after {
+ content: " ";
+ display: table;
+}
+.clearfix:after {
+ clear: both;
+}
+
+
+/* Animation
+------------------------------ */
+.fade-enter-active,
+.fade-leave-active {
+ transition: opacity .5s;
+}
+.fade-enter,
+.fade-leave-to {
+ opacity: 0;
+}
+
+
+/* Reset element-ui
+------------------------------ */
+.site-wrapper {
+ .el-pagination {
+ text-align: right;
+ }
+}
+
+
+/* Layout
+------------------------------ */
+.site-wrapper {
+ position: relative;
+ min-width: 1180px;
+}
+
+
+/* Sidebar fold
+------------------------------ */
+.site-sidebar--fold {
+ .site-navbar__header,
+ .site-navbar__brand,
+ .site-sidebar,
+ .site-sidebar__inner,
+ .el-menu.site-sidebar__menu {
+ width: 64px;
+ }
+ .site-navbar__body,
+ .site-content__wrapper {
+ margin-left: 64px;
+ }
+ .site-navbar__brand {
+ &-lg {
+ display: none;
+ }
+ &-mini {
+ display: inline-block;
+ }
+ }
+ .site-sidebar,
+ .site-sidebar__inner {
+ overflow: initial;
+ }
+ .site-sidebar__menu-icon {
+ margin-right: 0;
+ font-size: 20px;
+ }
+ .site-content--tabs > .el-tabs > .el-tabs__header {
+ left: 64px;
+ }
+}
+// animation
+.site-navbar__header,
+.site-navbar__brand,
+.site-navbar__body,
+.site-sidebar,
+.site-sidebar__inner,
+.site-sidebar__menu.el-menu,
+.site-sidebar__menu-icon,
+.site-content__wrapper,
+.site-content--tabs > .el-tabs .el-tabs__header {
+ transition: inline-block .3s, left .3s, width .3s, margin-left .3s, font-size .3s;
+}
+
+
+/* Navbar
+------------------------------ */
+.site-navbar {
+ position: fixed;
+ top: 0;
+ right: 0;
+ left: 0;
+ z-index: 1030;
+ height: 50px;
+ box-shadow: 0 2px 4px rgba(0, 0, 0, .08);
+ background-color: $navbar--background-color;
+
+ &--inverse {
+ .site-navbar__body {
+ background-color: transparent;
+ }
+ .el-menu {
+ > .el-menu-item,
+ > .el-submenu > .el-submenu__title {
+ color: #fff;
+ &:focus,
+ &:hover {
+ color: #fff;
+ background-color: mix(#000, $navbar--background-color, 15%);
+ }
+ }
+ > .el-menu-item.is-active,
+ > .el-submenu.is-active > .el-submenu__title {
+ border-bottom-color: mix(#fff, $navbar--background-color, 85%);
+ }
+ .el-menu-item i,
+ .el-submenu__title i,
+ .el-dropdown {
+ color: #fff;
+ }
+ }
+ .el-menu--popup-bottom-start {
+ background-color: $navbar--background-color;
+ }
+ }
+
+ &__header {
+ position: relative;
+ float: left;
+ width: 230px;
+ height: 50px;
+ overflow: hidden;
+ }
+ &__brand {
+ display: table-cell;
+ vertical-align: middle;
+ width: 230px;
+ height: 50px;
+ margin: 0;
+ line-height: 50px;
+ font-size: 20px;
+ text-align: center;
+ text-transform: uppercase;
+ white-space: nowrap;
+ color: #fff;
+
+ &-lg,
+ &-mini {
+ margin: 0 5px;
+ color: #fff;
+ &:focus,
+ &:hover {
+ color: #fff;
+ text-decoration: none;
+ }
+ }
+ &-mini {
+ display: none;
+ }
+ }
+ &__switch {
+ font-size: 18px;
+ border-bottom: none !important;
+ }
+ &__avatar {
+ border-bottom: none !important;
+ * {
+ vertical-align: inherit;
+ }
+ .el-dropdown-link {
+ > img {
+ width: 36px;
+ height: auto;
+ margin-right: 5px;
+ border-radius: 100%;
+ vertical-align: middle;
+ }
+ }
+ }
+ &__body {
+ position: relative;
+ margin-left: 230px;
+ padding-right: 15px;
+ background-color: #fff;
+ }
+ &__menu {
+ float: left;
+ background-color: transparent;
+ border-bottom: 0;
+
+ &--right {
+ float: right;
+ }
+ a:focus,
+ a:hover {
+ text-decoration: none;
+ }
+ .el-menu-item,
+ .el-submenu > .el-submenu__title {
+ height: 50px;
+ line-height: 50px;
+ }
+ .el-submenu > .el-menu {
+ top: 55px;
+ }
+ .el-badge {
+ display: inline;
+ z-index: 2;
+ &__content {
+ line-height: 16px;
+ }
+ }
+ }
+}
+
+
+/* Sidebar
+------------------------------ */
+.site-sidebar {
+ position: fixed;
+ top: 50px;
+ left: 0;
+ bottom: 0;
+ z-index: 1020;
+ width: 230px;
+ overflow: hidden;
+
+ &--dark,
+ &--dark-popper {
+ background-color: $sidebar--background-color-dark;
+ .site-sidebar__menu.el-menu,
+ > .el-menu--popup {
+ background-color: $sidebar--background-color-dark;
+ .el-menu-item,
+ .el-submenu > .el-submenu__title {
+ color: $sidebar--color-text-dark;
+ &:focus,
+ &:hover {
+ color: mix(#fff, $sidebar--color-text-dark, 50%);
+ background-color: mix(#fff, $sidebar--background-color-dark, 2.5%);
+ }
+ }
+ .el-menu,
+ .el-submenu.is-opened {
+ background-color: mix(#000, $sidebar--background-color-dark, 15%);
+ }
+ .el-menu-item.is-active,
+ .el-submenu.is-active > .el-submenu__title {
+ color: mix(#fff, $sidebar--color-text-dark, 80%);
+ }
+ }
+ }
+ &__inner {
+ position: relative;
+ z-index: 1;
+ width: 250px;
+ height: 100%;
+ padding-bottom: 15px;
+ overflow-y: scroll;
+ }
+ &__menu.el-menu {
+ width: 230px;
+ border-right: 0;
+ }
+ &__menu-icon {
+ width: 24px;
+ margin-right: 5px;
+ text-align: center;
+ font-size: 16px;
+ color: inherit !important;
+ }
+}
+
+
+/* Content
+------------------------------ */
+.site-content {
+ position: relative;
+ padding: 15px;
+
+ &__wrapper {
+ position: relative;
+ padding-top: 50px;
+ margin-left: 230px;
+ min-height: 100%;
+ background: $content--background-color;
+ }
+ &--tabs {
+ padding: 55px 0 0;
+ }
+ > .el-tabs {
+ > .el-tabs__header {
+ position: fixed;
+ top: 50px;
+ left: 230px;
+ right: 0;
+ z-index: 930;
+ padding: 0 55px 0 15px;
+ box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .12), 0 0 6px 0 rgba(0, 0, 0, .04);
+ background-color: #fff;
+ > .el-tabs__nav-wrap {
+ margin-bottom: 0;
+ &:after {
+ display: none;
+ }
+ }
+ }
+ > .el-tabs__content {
+ padding: 0 15px 15px;
+ > .site-tabs__tools {
+ position: fixed;
+ top: 50px;
+ right: 0;
+ z-index: 931;
+ height: 40px;
+ padding: 0 12px;
+ font-size: 16px;
+ line-height: 40px;
+ background-color: $content--background-color;
+ cursor: pointer;
+ .el-icon--right {
+ margin-left: 0;
+ }
+ }
+ }
+ }
+}
+
+// 以下是默认样式
+.element-error-message-zindex{
+ z-index:3000 !important;
+}
+.green{
+ color: rgb(44, 194, 44) !important;
+}
+.red{
+ color: red !important;
+}
+.blue{
+ color: #356ced !important;
+}
+.yellow{
+ color: #F18C16 !important;
+}
+.info input[type='number']::-webkit-outer-spin-button,
+
+.info input[type='number']::-webkit-inner-spin-button {
+-webkit-appearance: none;
+
+}
+.avue-crud .el-table th {
+ word-break: break-word;
+ color: #fafafa;
+ background-color: #263238;
+}
+
+.el-table thead.is-group th {
+ background: #263238;
+}
+
+.site-wrapper .el-pagination{
+ display: block;
+ margin: 0 auto;
+ text-align: center;
+}
+.el-button--primary {
+ color: #FFF;
+ background-color: #1C4EFA; //按钮颜色
+ border-color: #1C4EFA;
+}
+.el-pagination.is-background .el-pager li:not(.disabled).active {
+ background-color: #1C4EFA; //分页颜色
+ color: #FFF;
+}
+.site-sidebar--dark .site-sidebar__menu.el-menu, .site-sidebar--dark > .el-menu--popup, .site-sidebar--dark-popper .site-sidebar__menu.el-menu, .site-sidebar--dark-popper > .el-menu--popup {
+ // background-color: #323338; //侧边栏颜色
+}
+.site-navbar{
+ background-color: #323338;
+}
+.el-button--primary:focus, .el-button--primary:hover {
+ background: #356ced; // 按钮触摸颜色
+ border-color: #356ced;
+ color: #FFF;
+}
+.el-tabs__item.is-active { //顶部小分页颜色
+ color: #356ced;
+}
+.el-tabs__active-bar { //顶部小分页颜色
+ background-color: #356ced;
+}
+.el-table__fixed{
+ height: 100% !important;
+}
+.el-table__fixed-right{
+ height: 100% !important;
+}
+// 表单按钮样式
+.seachButton {
+ cursor: pointer;
+ color: rgb(69, 147, 235);
+}
+.seachButton:hover {
+ color: rgb(8, 63, 134);
+}
+
+.el-header{
+ background: rgb(38, 50, 56);
+ background: rgb(255, 255, 255);
+
+}
+//顶部样式看不到搜索栏
+@media (max-width: 1194px) {
+ .site-content--tabs {
+ padding: 155px 0 0;
+}
+}
+//顶部标签栏
+@media (max-width: 1194px) {
+ .site-content > .el-tabs > .el-tabs__header {
+ top: 152px !important;
+}
+}
+@media (min-width: 1195px){
+ .site-content--tabs {
+ padding: 90px 0 0;
+}
+.site-content > .el-tabs > .el-tabs__header {
+ top: 99px !important;
+}
+}
--
Gitblit v1.9.3