全局样式调整

src/App.vue

@@ -97,35 +97,48 @@ onMounted(async () => {
 </template>
 
 <style lang="scss">
+body {
+  --arcoblue-9: 255, 151, 7;//#FF9707
+  --arcoblue-8: 38, 54, 40;//#263628
+  --arcoblue-6: 74, 102, 77;//#4A664D
+  --arcoblue-5: 149, 169, 151;//#95A997
+  --arcoblue-7: 227, 230, 218;//#e3e6da
+  --arcoblue-4: 192, 206, 179;//#C0CEB3
+  --arcoblue-3: 138, 168, 138;//#8AA88A
+  --arcoblue-2: 235, 235, 233;//#EBEBE9
+  --arcoblue-1: 72, 96, 91;//#48605B
+} 
 :root {
-  --primary1-6: #263628!important;
-  --primary1-5: #4a664d!important;
-  --primary1-5-hover: #95A997!important;
-  --primary1-7: #8aaa8a!important;
-  --primary1-4: #c0ceb3!important;
-  --primary1-3: #e3e6da!important;
-  --primary1-2: #ebebe9!important;
-  --primary1-1: #48605B!important;
-  --primary1-orange: #ff9707!important;
+  --primary1-9: #ff9707;
+  --primary1-8: #263628;
+  --primary1-6: #4A664D;
+  --primary1-5: #95A997;
+  --primary1-7: #e3e6da;
+  --primary1-4: #C0CEB3;
+  --primary1-3: #8AA88A;
+  --primary1-2: #EBEBE9;
+  --primary1-1: #48605B;
 
    /* 文本色调整为深灰 */
-  --color-text-1: #0c150d!important;
-  --color-text-2: #5a5a5a!important;
-  --color-text-3: #133537!important;
+  --color-text-1: #0c150d;
+  --color-text-2: #5a5a5a;
+  --color-text-3: #133537;
 }
+.primary1-10{color: var(--primary1-10);}
+.primary1-9{color: var(--primary1-9);}
+.primary1-8{color: var(--primary1-8);}
 .primary1-6{color: var(--primary1-6);}
 .primary1-5{color: var(--primary1-5);}
-.primary1-5-hover{color: var(--primary1-5-hover);}
 .primary1-7{color: var(--primary1-7);}
 .primary1-4{color: var(--primary1-4);}
 .primary1-3{color: var(--primary1-3);}
 .primary1-2{color: var(--primary1-2);}
 .primary1-1{color: var(--primary1-1);}
-.primary1-orange{color: var(--primary1-orange);}
+
 
 .primary1-bg-6{background-color: var(--primary1-6);}
-.primary1-bg-5{background-color: var(--primary1-5);}
-.primary1-bg-5-hover{background-color: var(--primary1-5-hover);}
+.primary1-bg-5{background-color: var(--primary1-8);}
+.primary1-bg-5-hover{background-color: var(--primary1-5);}
 .primary1-bg-7{background-color: var(--primary1-7);}
 .primary1-bg-4{background-color: var(--primary1-4);}
 .primary1-bg-3{background-color: var(--primary1-3);}

src/views/auth/Login.vue

@@ -377,27 +377,28 @@ onMounted(async () => {
 :deep(.arco-input-wrapper .arco-input.arco-input-size-large){
   font-size: 16px;
 }
-:deep(.items-center-button .arco-btn-primary){
-  box-shadow: rgba(74,102,77,0.15) 0px 5px 15px;
-  background-color: var(--primary1-5-hover);
-}
-:deep(.items-center-button .arco-btn-primary:hover){
-  box-shadow: rgba(74,102,77,0.15) 0px 5px 15px;
-  background-color: var(--primary1-5-hover);
-}
-:deep(.items-center-button.isClick .arco-btn-primary){
-  background-color: var(--primary1-5);
-}
-:deep(.items-center-button.isClick .arco-btn-primary:hover){
-  background-color: var(--primary1-5);
-}
-// :deep(.arco-btn-primary){
+// :deep(.items-center-button .arco-btn-primary){
 //   box-shadow: rgba(74,102,77,0.15) 0px 5px 15px;
 //   background-color: var(--primary1-5);
 // }
-// :deep(.arco-btn-primary:hover){
+// :deep(.items-center-button .arco-btn-primary:hover){
+//   box-shadow: rgba(74,102,77,0.15) 0px 5px 15px;
 //   background-color: var(--primary1-5);
 // }
+// :deep(.items-center-button.isClick .arco-btn-primary){
+//   background-color: var(--primary1-8);
+// }
+// :deep(.items-center-button.isClick .arco-btn-primary:hover){
+//   background-color: var(--primary1-8);
+// }
+
+// :deep(.arco-btn-primary){
+//   box-shadow: rgba(74,102,77,0.15) 0px 5px 15px;
+//   background-color: var(--primary1-8);
+// }
+// :deep(.arco-btn-primary:hover){
+//   background-color: var(--primary1-8);
+// }
 :deep(.arco-divider-text){
   /*background: #fff;*/
   font-size: 16px;
@@ -474,12 +475,12 @@ onMounted(async () => {
   background-color: var(--primary1-6) !important;
 }*/
 .loginForm-item{
-  border: 1px solid var(--primary1-3);
+  border: 1px solid var(--primary1-7);
 }
 .loginForm-item:hover{
-  border: 2px solid var(--primary1-5);
+  border: 2px solid var(--primary1-8);
 }
 .loginForm-itemActive{
-  border: 2px solid var(--primary1-5);
+  border: 2px solid var(--primary1-8);
 }
 </style>

src/views/auth/components/registerSuccess.vue

@@ -56,10 +56,10 @@ onMounted(async () => {
 </script>
 <style scoped lang="scss">
 :deep(.arco-btn-primary){
-  background-color: var(--primary1-5);
+  background-color: var(--primary1-8);
 }
 :deep(.arco-btn-primary:hover){
-  background-color: var(--primary1-5);
+  background-color: var(--primary1-8);
 }
 .loginForm-bg{
   background: rgba(255, 255, 255, 0.7);

src/views/auth/forgePassword.vue

@@ -41,7 +41,7 @@
                             <icon-close-circle-fill v-else-if="codeValidateStatus === 'error'" class="text-red-500" /> -->
                             <a-button @click="handleSendCode" :disabled="sendCodeCountdown > 0"
                               :loading="sendingCode" size="large" type="text" class="w-full !px-[0]">
-                              <span class="primary1-5">
+                              <span class="primary1-6">
                                 {{ sendCodeCountdown > 0 ? `${sendCodeCountdown}s ${t('login.resend')}` :
                                 t('login.getVerifyCode') }}</span>
                             </a-button>
@@ -461,7 +461,7 @@ watch(()=>currentStep.value,(newVal,oldVal)=>{
 :deep(.arco-input-focus){
   border-radius: 12px;
   box-shadow: rgba(60,85,62,0.18) 0px 5px 15px;
-  border: 2px solid var(--primary1-5);
+  border: 2px solid var(--primary1-8);
   background-color: #FFFFFF;
 }
 :deep(.arco-form-item-label){
@@ -491,17 +491,17 @@ watch(()=>currentStep.value,(newVal,oldVal)=>{
 }
 :deep(.items-center-button .arco-btn-primary){
   box-shadow: rgba(74,102,77,0.15) 0px 5px 15px;
-  background-color: var(--primary1-5-hover);
+  background-color: var(--primary1-5);
 }
 :deep(.items-center-button .arco-btn-primary:hover){
   box-shadow: rgba(74,102,77,0.15) 0px 5px 15px;
-  background-color: var(--primary1-5-hover);
+  background-color: var(--primary1-5);
 }
 :deep(.items-center-button.isClick .arco-btn-primary){
-  background-color: var(--primary1-5);
+  background-color: var(--primary1-6);
 }
 :deep(.items-center-button.isClick .arco-btn-primary:hover){
-  background-color: var(--primary1-5);
+  background-color: var(--primary1-6);
 }
 .loginForm-item{
   border: 1px solid var(--primary1-4);
@@ -525,7 +525,10 @@ watch(()=>currentStep.value,(newVal,oldVal)=>{
 :deep(.formData-input .arco-dropdown){
   opacity: 0 !important;
 }
-:deep(.arco-icon){
-  color: var(--primary1-5);
+:deep(.arco-btn-text.arco-btn-disabled){
+  background-color: #EEEEEB;
+}
+:deep(.arco-btn-text.arco-btn-loading){
+  background-color: #dddddd;
 }
 </style>

src/views/auth/register.vue

@@ -50,7 +50,7 @@
                             <icon-close-circle-fill v-else-if="codeValidateStatus === 'error'" class="text-red-500" />
                             <a-button @click="handleSendCode" :disabled="!canSendCode || sendCodeCountdown > 0"
                               :loading="sendingCode" size="large" type="text" class="w-full !px-[0]">
-                              <span class="primary1-5">
+                              <span class="primary1-6">
                                 {{ sendCodeCountdown > 0 ? `${sendCodeCountdown}s ${t('login.resend')}` :
                                 t('login.getVerifyCode') }}</span>
                             </a-button>
@@ -719,7 +719,7 @@ getSimples()
 :deep(.arco-input-focus){
   border-radius: 12px;
   box-shadow: rgba(60,85,62,0.18) 0px 5px 15px;
-  border: 2px solid var(--primary1-5);
+  border: 2px solid var(--primary1-8);
   background-color: #FFFFFF;
 }
 :deep(.arco-form-item-label){
@@ -749,22 +749,18 @@ getSimples()
 }
 :deep(.items-center-button .arco-btn-primary){
   box-shadow: rgba(74,102,77,0.15) 0px 5px 15px;
-  background-color: var(--primary1-5-hover);
+  background-color: var(--primary1-5);
 }
 :deep(.items-center-button .arco-btn-primary:hover){
   box-shadow: rgba(74,102,77,0.15) 0px 5px 15px;
-  background-color: var(--primary1-5-hover);
+  background-color: var(--primary1-5);
 }
 :deep(.items-center-button .isClick .arco-btn-primary){
-  background-color: var(--primary1-5);
+  background-color: var(--primary1-6);
 }
 :deep(.items-center-button .isClick .arco-btn-primary:hover){
-  background-color: var(--primary1-5);
+  background-color: var(--primary1-6);
 }
-// :deep(.arco-btn-primary:hover){
-//   box-shadow: rgba(74,102,77,0.15) 0px 5px 15px;
-//   background-color: var(--primary1-7);
-// }
 :deep(.arco-form-item-label-required-symbol){
   display: none;
 }
@@ -788,7 +784,10 @@ getSimples()
 :deep(.formData-input .arco-dropdown){
   opacity: 0 !important;
 }
-:deep(.arco-icon){
-  color: var(--primary1-5);
+:deep(.arco-btn-text.arco-btn-disabled){
+  background-color: #EEEEEB;
+}
+:deep(.arco-btn-text.arco-btn-loading){
+  background-color: #dddddd;
 }
 </style>