zx/hazardousWaste_web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

样式调整

Browse Source
This commit is contained in:
zx
2026-03-11 08:22:15 +08:00
parent 97b070a1a4
commit 882558c511
65 changed files with 1104 additions and 1747 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/assets/styles/btn.scss
View File

@@ -1,4 +1,4 @@
@use './variables.module.scss' as *;
@import './variables.module.scss';
@mixin colorBtn($color) {
background: $color;

21
src/assets/styles/common.css Normal file
View File

@@ -0,0 +1,21 @@
:root {
--mineTable-notFinish-bg-color: #c7ffa5;
--mineTable-click-bg-color: #d2f0ff;
}
.el-table .success-row {
background-color: var(--mineTable-notFinish-bg-color) !important;
}
.el-table__body tr.current-row>td.el-table__cell {
background-color: var(--mineTable-click-bg-color) !important;
}
/* :deep(.el-table__body tr.hover-row>td.el-table__cell){
background-color: unset !important;
}
.el-table {
--el-table-row-hover-bg-color: transparent;
} */

23
src/assets/styles/index.scss
View File

@@ -1,9 +1,10 @@
@use './mixin.scss';
@use './transition.scss';
@use './element-ui.scss';
@use './sidebar.scss';
@use './btn.scss';
@use './ruoyi.scss';
@import './variables.module.scss';
@import './mixin.scss';
@import './transition.scss';
@import './element-ui.scss';
@import './sidebar.scss';
@import './btn.scss';
@import './manage.scss';
body {
height: 100%;
@@ -123,6 +124,16 @@ aside {
//main-container全局样式
.app-container {
padding: 20px;
background-color: #ffffff;
border-radius: 8px;
margin: 24px;
.el-form{
.el-form-item__label{
color:rgba(0, 0, 0, .9);
font-weight: 500;
}
}
}
.components-container {

20
src/assets/styles/ruoyi.scss → src/assets/styles/manage.scss
View File

@@ -1,6 +1,6 @@
/**
* 通用css样式布局处理
* Copyright (c) 2019 ruoyi
* Copyright (c) 2019
*/
/** 基础通用 **/
@@ -60,14 +60,6 @@
color: inherit;
}
.el-form--inline {
.el-form-item {
.el-input, .el-cascader, .el-select, .el-autocomplete {
width: 200px;
}
}
}
.el-form .el-form-item__label {
font-weight: 700;
}
@@ -156,16 +148,6 @@
width: inherit;
}
/* horizontal el menu */
.el-menu--horizontal .el-menu-item .svg-icon + span,
.el-menu--horizontal .el-sub-menu__title .svg-icon + span {
margin-left: 3px;
}
.el-menu--horizontal .el-menu--popup {
min-width: 120px !important;
}
/** 表格更多操作下拉样式 */
.el-table .el-dropdown-link {
cursor: pointer;

27
src/assets/styles/sidebar.scss
View File

@@ -1,11 +1,9 @@
@use './variables.module.scss' as vars;
#app {
.main-container {
min-height: 100%;
transition: margin-left .28s;
margin-left: vars.$base-sidebar-width;
margin-left: $base-sidebar-width;
position: relative;
}
@@ -15,7 +13,7 @@
.sidebar-container {
transition: width 0.28s;
width: vars.$base-sidebar-width !important;
width: $base-sidebar-width !important;
height: 100%;
position: fixed;
font-size: 0px;
@@ -24,8 +22,9 @@
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);
// -webkit-box-shadow: 2px 0 6px rgba(0,21,41,.35);
// box-shadow: 2px 0 6px rgba(0,21,41,.35);
border-right: 1px solid #e4e4e7;
// reset element-ui css
.horizontal-collapse-transition {
@@ -61,7 +60,7 @@
}
.svg-icon {
margin-right: 10px !important;
margin-right: 16px;
}
.el-menu {
@@ -89,12 +88,12 @@
}
& .theme-dark .is-active > .el-sub-menu__title {
color: vars.$base-menu-color-active !important;
color: $base-menu-color-active !important;
}
& .nest-menu .el-sub-menu>.el-sub-menu__title,
& .el-sub-menu .el-menu-item {
min-width: vars.$base-sidebar-width !important;
min-width: $base-sidebar-width !important;
&:hover {
background-color: rgba(0, 0, 0, 0.06) !important;
@@ -103,10 +102,10 @@
& .theme-dark .nest-menu .el-sub-menu>.el-sub-menu__title,
& .theme-dark .el-sub-menu .el-menu-item {
background-color: vars.$base-sub-menu-background;
background-color: $base-sub-menu-background;
&:hover {
background-color: vars.$base-sub-menu-hover !important;
background-color: $base-sub-menu-hover !important;
}
}
}
@@ -169,7 +168,7 @@
}
.el-menu--collapse .el-menu .el-sub-menu {
min-width: vars.$base-sidebar-width !important;
min-width: $base-sidebar-width !important;
}
// mobile responsive
@@ -180,14 +179,14 @@
.sidebar-container {
transition: transform .28s;
width: vars.$base-sidebar-width !important;
width: $base-sidebar-width !important;
}
&.hideSidebar {
.sidebar-container {
pointer-events: none;
transition-duration: 0.3s;
transform: translate3d(-(vars.$base-sidebar-width), 0, 0);
transform: translate3d(-$base-sidebar-width, 0, 0);
}
}
}

37
src/assets/styles/transition.scss
View File

@@ -6,7 +6,7 @@
transition: opacity 0.28s;
}
.fade-enter-from,
.fade-enter,
.fade-leave-active {
opacity: 0;
}
@@ -18,7 +18,7 @@
transition: all .5s;
}
.fade-transform-enter-from {
.fade-transform-enter {
opacity: 0;
transform: translateX(-30px);
}
@@ -34,7 +34,7 @@
transition: all .5s;
}
.breadcrumb-enter-from,
.breadcrumb-enter,
.breadcrumb-leave-active {
opacity: 0;
transform: translateX(20px);
@@ -47,34 +47,3 @@
.breadcrumb-leave-active {
position: absolute;
}
/* 黑暗模式下过渡效果 */
::view-transition-new(root), ::view-transition-old(root) {
animation: none !important;
backface-visibility: hidden;
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
}
.dark::view-transition-old(root) {
z-index: 2147483646;
background: var(--bg-color-dark);
}
.dark::view-transition-new(root) {
z-index: 1;
background: var(--bg-color);
}
::view-transition-old(root) {
z-index: 1;
background: var(--bg-color);
}
::view-transition-new(root) {
z-index: 2147483646;
background: var(--bg-color-dark);
}

56
src/assets/styles/variables.module.scss
View File

@@ -89,9 +89,6 @@ html.dark {
--el-text-color-regular: #d0d0d0;
--el-border-color: #434343;
--el-border-color-light: #434343;
/* primary */
--primary-bg: #18212b;
/* 侧边栏 */
--sidebar-bg: #141414;
@@ -130,8 +127,8 @@ html.dark {
--splitpanes-default-bg: #141414;
/* 侧边栏菜单覆盖 */
.sidebar-container {
.el-menu-item:not(.is-active), .menu-title {
.sidebar-container {
.el-menu-item, .menu-title {
color: var(--el-text-color-regular);
}
& .theme-dark .nest-menu .el-sub-menu>.el-sub-menu__title,
@@ -140,27 +137,13 @@ html.dark {
}
}
.topmenu-container {
.el-menu-item,
.el-sub-menu .el-sub-menu__title {
color: var(--el-text-color-regular) !important;
}
}
.topbar-menu.el-menu--horizontal > .el-sub-menu .el-sub-menu__title{
color: var(--el-text-color-regular) !important;
}
/* 顶部栏栏菜单覆盖 */
.el-menu--horizontal {
.el-menu-item, .el-sub-menu {
.el-menu-item {
&:not(.is-disabled) {
&:hover,
&:focus {
background-color: var(--navbar-hover) !important;
.el-sub-menu__title {
background-color: var(--navbar-hover) !important;
}
}
}
}
@@ -190,33 +173,6 @@ html.dark {
}
}
/* 按钮样式覆盖 */
.el-button--primary.is-plain {
background-color: var(--primary-bg);
border: 1px solid var(--el-color-primary-light-2);
color: var(--el-color-primary-light-2);
&:hover {
background-color: var(--el-button-hover-bg-color);
border-color: var(--el-button-hover-border-color);
color: var(--el-button-hover-text-color);
}
&.is-disabled {
background-color: var(--link-active-bg-color);
border-color: var(--el-color-primary-light-3);
color: var(--el-color-primary-light-3);
opacity: 0.5;
}
}
/* primary tag 样式覆盖 */
.el-tag--primary {
background-color: var(--primary-bg);
border: 1px solid var(--el-border-color-light);
color: var(--el-color-primary);
}
/* 表格样式覆盖 */
.el-table {
--el-table-header-bg-color: var(--el-bg-color-overlay) !important;
@@ -261,11 +217,5 @@ html.dark {
background: var(--cron-border);
}
/* 底部版权样式覆盖 */
.copyright {
background-color: var(--el-bg-color) !important;
color: var(--el-text-color-regular) !important;
border-top: 1px solid var(--el-bg-color) !important;
}
}