feat: update tag colors

ecomfe · Nov 23, 2023 · da4cb70 · da4cb70 · vercel · Nov 23, 2023
1 parent 1cae0bc
commit da4cb70
Show file tree

Hide file tree

Showing 4 changed files with 33 additions and 14 deletions.
diff --git a/packages/veui-theme-dls/components/tag.less b/packages/veui-theme-dls/components/tag.less
@@ -54,23 +54,20 @@
   }
 
   &-default {
-    .apply-color(@dls-tag-color);
+    .apply-color(@dls-tag-color-default, false);
 
     &.@{veui-prefix}-tag-selected {
-      .apply-flip-color(selected, @dls-tag-color);
+      .apply-color(@dls-tag-color-default-selected);
     }
 
     &[ui~="reverse"] {
-      .apply-flip-color(reverse, @dls-tag-color);
+      .apply-flip-color(reverse, @dls-tag-color-default);
     }
 
-    &[ui~="theme:d22"] {
-      .apply-color(fade(@dls-color-translucent-2, 100%), false);
-      color: @dls-foreground-color-neutral;
+    color: @dls-tag-font-color-default;
 
-      .@{veui-prefix}-tag-remove {
-        color: @dls-foreground-color-neutral-weak;
-      }
+    .@{veui-prefix}-tag-remove {
+      color: @dls-foreground-color-neutral-weak;
     }
   }
 

diff --git a/packages/veui-theme-dls/package.json b/packages/veui-theme-dls/package.json
@@ -22,7 +22,7 @@
     "dls-icons-vue": "~3.28.0",
     "dls-illustrations-vue": "^1.4.3",
     "focus-visible": "^4.1.5",
-    "less-plugin-dls": "11.8.2",
+    "less-plugin-dls": "11.8.4",
     "less-plugin-est": "^3.0.1"
   },
   "peerDependencies": {

diff --git a/packages/veui/demo/cases/Tag.vue b/packages/veui/demo/cases/Tag.vue
@@ -99,6 +99,28 @@
     </div>
   </section>
 
+  <section>
+    <h2>反色标签</h2>
+    <div>
+      <veui-tag
+        v-for="status in statuses"
+        :key="status"
+        :status="status"
+        :selected.sync="selected"
+        :ui="'reverse' + (bordered ? ' bordered' : '')"
+        selectable
+      >{{ status }}</veui-tag>
+      <veui-tag
+        v-for="color in colors"
+        :key="color"
+        :color="color"
+        :selected.sync="selected"
+        :ui="'reverse' + (bordered ? ' bordered' : '')"
+        selectable
+      >{{ color }}</veui-tag>
+    </div>
+  </section>
+
   <section>
     <h2>禁用标签</h2>
     <div>

diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml