u

code/base-project/base-vue/packages/ao-design/src/textarea/index.scss

@@ -12,6 +12,8 @@ $textarea-prefix: #{$prefix}-textarea;
   width: 100%;
 
   .#{$textarea-prefix}-inner {
+    font-family: 'PingFang SC', 'Microsoft YaHei', 'Helvetica Neue', Helvetica, Arial, sans-serif;
+    height: 100%;
     width: 100%;
     display: flex;
     padding: 5px 8px;
@@ -23,20 +25,21 @@ $textarea-prefix: #{$prefix}-textarea;
     transition:
       all cubic-bezier(0.38, 0, 0.24, 1) 0.2s,
       height 0s;
-    border: 1px solid $border-outline-color;
+    border: 1px solid $border-color;
     border-radius: $border-radius;
-
+    background-color: $bg-color-control;
+    color: $text-color-base;
     &::placeholder {
       color: $text-color-placeholder;
     }
 
     &:hover {
-      border-color: $brand-color;
+      border-color: $primary-color;
     }
 
     &:focus-within {
-      border-color: $brand-color;
-      box-shadow: 0 0 0 2px $brand-color-focus;
+      border-color: $primary-color;
+      box-shadow: 0 0 0 2px $primary-color-focus;
     }
 
     &::-webkit-scrollbar {
@@ -44,33 +47,33 @@ $textarea-prefix: #{$prefix}-textarea;
     }
 
     &::-webkit-scrollbar-track {
-      background: transparent;
+      background: $scroll-track-color;
     }
 
     &::-webkit-scrollbar-thumb {
-      background-color: #e5e5e5;
+      background-color: $scrollbar-color;
       border-radius: 0px;
     }
 
     &::-webkit-scrollbar-thumb:hover {
-      background-color: #b2b2b2;
+      background-color: $scrollbar-hover-color;
     }
   }
 
   .#{$textarea-prefix}-disabled {
-    background-color: $bg-color-component-disabled;
+    background-color: $default-color-disabled;
     cursor: not-allowed;
     color: $text-color-disabled;
 
     &:hover,
     &:focus-within {
-      border: $border-outline-color;
+      border: $border-color;
       box-shadow: none;
     }
   }
 
   .#{$textarea-prefix}-readonly {
-    background-color: $bg-color-component-readonly;
+    // background-color: $bg-color-component-readonly;
   }
 
   .#{$textarea-prefix}-clear {
@@ -88,13 +91,13 @@ $textarea-prefix: #{$prefix}-textarea;
     align-items: center;
     justify-content: center;
 
-    color: $text-color-secondary;
+    color: $text-color-assist;
     transition:
       color 0.2s,
       background-color 0.2s;
 
     &:hover {
-      background-color: $bg-color-component-hover;
+      background-color: $default-color-hover;
     }
   }
 
@@ -103,6 +106,6 @@ $textarea-prefix: #{$prefix}-textarea;
     right: 8px;
     bottom: 0px;
     font-size: 12px;
-    color: $text-color-secondary;
+    color: $text-color-assist;
   }
 }