🔱: [client] sync upgrade with 21 commits [trident-sync]

Update README.md
2026-04-24 20:57:26 +08:00 · 2023-01-29 15:26:45 +08:00
parent 62e3945d30
commit d10e80bf83
567 changed files with 36438 additions and 2 deletions
@@ -0,0 +1,11 @@
+// import { getThemeVariables } from "ant-design-vue/dist/theme";
+// import path from "path";
+// const resolve = path.resolve;
+export function generateModifyVars(dark = false) {
+  //const modifyVars = getThemeVariables({ dark });
+  // const vars = `${resolve("src/style/theme/index.less")}`;
+  return {
+    //...modifyVars
+    // hack: `true; @import (reference) "${vars}";`
+  };
+}
@@ -0,0 +1,72 @@
+import { generate } from "@ant-design/colors";
+
+export const primaryColor = "#1890ff";
+
+export const darkMode = "light";
+
+type Fn = (...arg: any) => any;
+
+export interface GenerateColorsParams {
+  mixLighten: Fn;
+  mixDarken: Fn;
+  tinycolor: any;
+  color?: string;
+}
+
+export function generateAntColors(color: string) {
+  return generate(color, {
+    theme: "default"
+  });
+}
+
+export function getThemeColors(color?: string) {
+  const tc = color || primaryColor;
+  const colors = generateAntColors(tc);
+  const primary = colors[5];
+  const modeColors = generateAntColors(primary);
+
+  return [...colors, ...modeColors];
+}
+
+export function generateColors({ color = primaryColor, mixLighten, mixDarken, tinycolor }: GenerateColorsParams) {
+  const arr = new Array(19).fill(0);
+  const lightens = arr.map((_t, i) => {
+    return mixLighten(color, i / 5);
+  });
+
+  const darkens = arr.map((_t, i) => {
+    return mixDarken(color, i / 5);
+  });
+
+  const alphaColors = arr.map((_t, i) => {
+    return tinycolor(color)
+      .setAlpha(i / 20)
+      .toRgbString();
+  });
+
+  const shortAlphaColors = alphaColors.map((item) => item.replace(/\s/g, "").replace(/0\./g, "."));
+
+  const tinycolorLightens = arr
+    .map((_t, i) => {
+      return tinycolor(color)
+        .lighten(i * 5)
+        .toHexString();
+    })
+    .filter((item) => item !== "#ffffff");
+
+  const tinycolorDarkens = arr
+    .map((_t, i) => {
+      return tinycolor(color)
+        .darken(i * 5)
+        .toHexString();
+    })
+    .filter((item) => item !== "#000000");
+  return [
+    ...lightens,
+    ...darkens,
+    ...alphaColors,
+    ...shortAlphaColors,
+    ...tinycolorDarkens,
+    ...tinycolorLightens
+  ].filter((item) => !item.includes("-"));
+}
@@ -0,0 +1,68 @@
+/**
+ * Vite plugin for website theme color switching
+ * https://github.com/anncwb/vite-plugin-theme
+ */
+import type { Plugin } from "vite";
+import path from "path";
+import { viteThemePlugin, mixLighten, mixDarken, tinycolor, antdDarkThemePlugin } from "vite-plugin-theme";
+import { getThemeColors, generateColors } from "./theme-colors";
+import { generateModifyVars } from "./modify-vars";
+
+export function configThemePlugin(isBuild: boolean): Plugin[] {
+  const colors = generateColors({
+    mixDarken,
+    mixLighten,
+    tinycolor
+  });
+  const colorVariables = [...getThemeColors(), ...colors];
+  const plugin = [
+    viteThemePlugin({
+      // resolveSelector: (s) => {
+      //   s = s.trim();
+      //   switch (s) {
+      //     case ".ant-steps-item-process .ant-steps-item-icon > .ant-steps-icon":
+      //       return ".ant-steps-item-icon > .ant-steps-icon";
+      //     case ".ant-radio-button-wrapper-checked:not(.ant-radio-button-wrapper-disabled)":
+      //     case ".ant-radio-button-wrapper-checked:not(.ant-radio-button-wrapper-disabled):hover":
+      //     case ".ant-radio-button-wrapper-checked:not(.ant-radio-button-wrapper-disabled):active":
+      //       return s;
+      //     case ".ant-steps-item-icon > .ant-steps-icon":
+      //       return s;
+      //   }
+      //   return `[data-theme] ${s}`;
+      // },
+      resolveSelector: (s) => {
+        s = s.trim();
+        if (s === ".ant-btn:hover,.ant-btn:focus") {
+          // console.log("ssss", s);
+          return ".theme-discard-xxxxxxx";
+        }
+        return s;
+      },
+      colorVariables
+    }),
+    antdDarkThemePlugin({
+      preloadFiles: [
+        path.resolve(process.cwd(), "node_modules/ant-design-vue/dist/antd.less"),
+        path.resolve(process.cwd(), "src/style/theme/index.less")
+      ],
+      filter: (id) => (isBuild ? !id.endsWith("antd.less") : true),
+      // extractCss: false,
+      darkModifyVars: {
+        ...generateModifyVars(true),
+        "text-color": "#c9d1d9",
+        "text-color-base": "#c9d1d9",
+        "component-background": "#151515",
+        // black: '#0e1117',
+        // #8b949e
+        "text-color-secondary": "#8b949e",
+        "border-color-base": "#303030",
+        // 'border-color-split': '#30363d',
+        "item-active-bg": "#111b26",
+        "app-content-background": "rgb(255 255 255 / 4%)"
+      }
+    })
+  ];
+
+  return (plugin as unknown) as Plugin[];
+}