Merge branch 'dev' of http://124.70.149.18:10880/lianghj/queenshow into dev

src/modules/editor/components/CompUI/formItems/BaseColorPicker.tsx

@@ -20,14 +20,14 @@ const defaultColor = [
   // "rgba(103, 58, 183, 1)",
   // "rgba(63, 81, 181, 1)",
   "rgba(33, 150, 243, 1)",
-  "rgba(3, 169, 244, 1)",
+  // "rgba(3, 169, 244, 1)",
   "rgba(0, 188, 212, 1)",
   "rgba(0, 150, 136, 1)",
   "rgba(76, 175, 80, 1)",
   "rgba(139, 195, 74, 1)",
   "rgba(205, 220, 57, 1)",
   "rgba(255, 235, 59, 1)",
-  "rgba(255, 193, 7, 1)",
+  // "rgba(255, 193, 7, 1)",
 ];
 
 export default defineComponent({
@@ -120,7 +120,7 @@ export default defineComponent({
         >
           <div class="color_view flex items-center">
             <div
-              class="color_icon color_item w-30px h-30px mx-3px mb-5px rounded-2px cursor-pointer"
+              class="color_icon color_item"
               onClick={() => (disabled ? null : show())}
             ></div>
 
@@ -131,7 +131,7 @@ export default defineComponent({
                   class={cx(
                     index == state.index && "item_active",
                     thisColor.alpha == 0 && "item_empty",
-                    "color_item w-30px h-30px mx-3px mb-5px rounded-2px cursor-pointer"
+                    "color_item"
                   )}
                   style={{ backgroundColor: color }}
                   key={index}
@@ -151,6 +151,7 @@ export default defineComponent({
 });
 
 const ColorPiackerView = css`
+  margin: 0 -5px;
   position: relative;
   &.picker-disabled {
     cursor: not-allowed;
@@ -166,10 +167,14 @@ const ColorPiackerView = css`
   .color_view {
     flex-wrap: wrap;
     .color_item {
-      border-radius: 3px;
       position: relative;
+      width: 36px;
+      height: 36px;
+      margin: 2px 5px 6px;
+      border-radius: 4px;
+      cursor: pointer;
       &::after {
-        border-radius: 2px;
+        border-radius: 4px;
         content: "";
         position: absolute;
         right: 0;
@@ -178,17 +183,17 @@ const ColorPiackerView = css`
         bottom: 0;
         transition: box-shadow 0.2s ease-in-out;
       }
-      &.item_active {
-        box-shadow: 0 0 0 1px @inf-border-color,
-          inset 0 0 0 1px @inf-border-color, inset 0 0 0 3px #fff;
+      &.item_active::after {
+        box-shadow: 0 0 0 1px @inf-primary-color,
+          inset 0 0 0 1px @inf-primary-color, inset 0 0 0 3px #fff;
       }
       &.item_empty {
         background: url("@/assets/imgs/bgBlank.svg") repeat;
         background-color: #fff !important;
       }
-      &:hover {
-        box-shadow: 0 0 0 1px @inf-border-color,
-          inset 0 0 0 1px @inf-border-color, inset 0 0 0 3px #fff;
+      &:hover::after {
+        box-shadow: 0 0 0 1px @inf-primary-color,
+          inset 0 0 0 1px @inf-primary-color, inset 0 0 0 3px #fff;
       }
     }
     .color_icon {