renxiaodong/lingji-work-fe
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: 项目列表、统一4种状态color色值

Browse Source
This commit is contained in:
rd
2025-07-23 11:32:37 +08:00
parent db00888ca9
commit 9ffe5be94e
8 changed files with 321 additions and 41 deletions
Download Patch File Download Diff File Expand all files Collapse all files

144
src/styles/components/button.scss
View File

@ -1,5 +1,3 @@
$disabled-ele: '.arco-btn-disabled';
.arco-btn {
border-radius: 2px;
border: 1px solid #d7d7d9 !important;
@ -22,32 +20,114 @@ $disabled-ele: '.arco-btn-disabled';
}
.arco-btn-primary {
background-color: #6d4cfe !important;
background-color: $color-primary !important;
border: none !important;
color: #fff !important;
&.arco-btn-disabled {
color: #fff !important;
background-color: #c5b7ff !important;
background-color: $color-primary-3 !important;
}
&:not(.arco-btn-disabled) {
&:hover {
color: #fff !important;
background-color: #8a70fe !important;
background-color: $color-primary-5 !important;
}
}
//success
&.arco-btn-status-success {
background-color: $color-success !important;
&.arco-btn-disabled {
background-color: $color-success-3 !important;
}
&:not(.arco-btn-disabled) {
&:hover {
background-color: $color-success-5 !important;
}
}
}
// danger
&.arco-btn-status-danger {
background-color: $color-error !important;
&.arco-btn-disabled {
background-color: $color-error-3 !important;
}
&:not(.arco-btn-disabled) {
&:hover {
background-color: $color-error-5 !important;
}
}
}
// warning
&.arco-btn-status-warning {
background-color: $color-warning !important;
&.arco-btn-disabled {
background-color: $color-warning-3 !important;
}
&:not(.arco-btn-disabled) {
&:hover {
background-color: $color-warning-5 !important;
}
}
}
}
.arco-btn-outline {
border: 1px solid #6d4cfe !important;
color: #6d4cfe !important;
border: 1px solid $color-primary !important;
color: $color-primary !important;
&.arco-btn-disabled {
border-color: #c5b7ff !important;
color: #c5b7ff !important;
border-color: $color-primary-3 !important;
color: $color-primary-3 !important;
}
&:not(.arco-btn-disabled) {
&:hover {
border-color: #8a70fe !important;
color: #8a70fe !important;
border-color: $color-primary-5 !important;
color: $color-primary-5 !important;
}
}
&.arco-btn-status-success {
border: 1px solid $color-success !important;
color: $color-success !important;
&.arco-btn-disabled {
border-color: $color-success-3 !important;
color: $color-success-3 !important;
}
&:not(.arco-btn-disabled) {
&:hover {
border-color: $color-success-5 !important;
color: $color-success-5 !important;
}
}
}
&.arco-btn-status-danger {
border: 1px solid $color-error !important;
color: $color-error !important;
&.arco-btn-disabled {
border-color: $color-error-3 !important;
color: $color-error-3 !important;
}
&:not(.arco-btn-disabled) {
&:hover {
border-color: $color-error-5 !important;
color: $color-error-5 !important;
}
}
}
&.arco-btn-status-warning {
border: 1px solid $color-warning !important;
color: $color-warning !important;
&.arco-btn-disabled {
border-color: $color-warning-3 !important;
color: $color-warning-3 !important;
}
&:not(.arco-btn-disabled) {
&:hover {
border-color: $color-warning-5 !important;
color: $color-warning-5 !important;
}
}
}
}
@ -55,13 +135,49 @@ $disabled-ele: '.arco-btn-disabled';
.arco-btn-text {
background-color: transparent !important;
border: none !important;
color: #6d4cfe !important;
color: $color-primary !important;
&.arco-btn-disabled {
color: #c5b7ff !important;
color: $color-primary-2 !important;
}
&:not(.arco-btn-disabled) {
&:hover {
color: #8a70fe !important;
color: $color-primary-5 !important;
}
}
&.arco-btn-status-success {
color: $color-success !important;
&.arco-btn-disabled {
color: $color-success-2 !important;
}
&:not(.arco-btn-disabled) {
&:hover {
color: $color-success-5 !important;
}
}
}
&.arco-btn-status-danger {
color: $color-error !important;
&.arco-btn-disabled {
color: $color-error-2 !important;
}
&:not(.arco-btn-disabled) {
&:hover {
color: $color-error-5 !important;
}
}
}
&.arco-btn-status-warning {
color: $color-warning !important;
&.arco-btn-disabled {
color: $color-warning-2 !important;
}
&:not(.arco-btn-disabled) {
&:hover {
color: $color-warning-5 !important;
}
}
}
}