@cloudtower/eagle 0.0.0-no-uikit-1 → 0.0.0-theme-rc-1

package/dist/cjs/store/modal.js

@@ -24,6 +24,7 @@ var ModalActions = /* @__PURE__ */ ((ModalActions2) => {
   ModalActions2["POP_MODAL"] = "POP_MODAL";
   ModalActions2["REMOVE_MODAL"] = "REMOVE_MODAL";
   ModalActions2["CLOSE_MODAL"] = "CLOSE_MODAL";
+  ModalActions2["RESET_MODAL"] = "RESET_MODAL";
   return ModalActions2;
 })(ModalActions || {});
 const initialModalState = {
@@ -57,6 +58,8 @@ const modalReducer = (state = initialModalState, action) => {
       return __spreadProps(__spreadValues({}, state), {
         closeId: action.id
       });
+    case "RESET_MODAL" /* RESET_MODAL */:
+      return initialModalState;
     default:
       return state;
   }

package/dist/cjs/styles/token/animation.js

@@ -1,7 +1,28 @@
 'use strict';
 
 const Animation = {
-  loading: "loading 1600ms ease-out infinite"
+  loading: "loading 1600ms ease-out infinite",
+  circleRotate: "rotate 1200ms cubic-bezier(0.33, 0, 0.67, 1) infinite",
+  shimmer: "shimmer 1100ms infinite"
+};
+const Keyframes = {
+  rotate: `
+    @keyframes rotate {
+      from { transform: rotate(0deg); }
+      to { transform: rotate(360deg); }
+    }
+  `,
+  shimmer: `
+    @keyframes shimmer {
+      from {
+        left: -120%;
+      }
+      to {
+        left: 100%;
+      }
+    }
+  `
 };
 
 exports.Animation = Animation;
+exports.Keyframes = Keyframes;

package/dist/cjs/styles/token/antd.js

@@ -0,0 +1,26 @@
+'use strict';
+
+const antdTokens = {
+  "light": {
+    "colorPrimary": "#1677ff",
+    "colorSuccess": "#52c41a",
+    "colorWarning": "#faad14",
+    "colorError": "#ff4d4f",
+    "colorInfo": "#1677ff",
+    "colorLink": "#1677ff",
+    "colorTextBase": "#000000",
+    "colorText": "rgba(0, 0, 0, 0.88)",
+    "colorTextSecondary": "rgba(0, 0, 0, 0.65)",
+    "colorTextHeading": "rgba(0, 0, 0, 0.88)",
+    "colorTextDisabled": "rgba(0, 0, 0, 0.25)",
+    "colorBgLayout": "#f5f5f5",
+    "colorBorder": "#d9d9d9",
+    "colorBorderSecondary": "#f0f0f0",
+    "boxShadowSecondary": "0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 9px 28px 8px rgba(0, 0, 0, 0.05)",
+    "colorBgContainer": "#FFFFFF",
+    "colorBgElevated": "#FFFFFF",
+    "colorBgBase": "#FFFFFF"
+  }
+};
+
+exports.antdTokens = antdTokens;

package/dist/cjs/styles/token/color.js

@@ -1,275 +1,301 @@
 'use strict';
 
 const Color = {
-  text: {
-    neutral: {
-      primary: "#00122E",
-      secondary: "#2C3852BF",
-      tertiary: "#2C385299",
-      quaternary: "#0015404D",
-      ontint: "#FFFFFF",
-      super: "#1D326C"
+  "text": {
+    "neutral": {
+      "primary": "var(--text-neutral-primary)",
+      "secondary": "var(--text-neutral-secondary)",
+      "tertiary": "var(--text-neutral-tertiary)",
+      "quaternary": "var(--text-neutral-quaternary)",
+      "ontint": "var(--text-neutral-ontint)",
+      "super": "var(--text-neutral-super)"
     },
-    colorful: {
-      outstanding: "#0080FF",
-      serious: "#F0483E",
-      notice: "#FEA008",
-      noticedark: "#E07F00",
-      positive: "#00BA5D",
-      positivedark: "#008F4C",
-      purple: "#7E41FF"
+    "colorful": {
+      "outstanding": "var(--text-colorful-outstanding)",
+      "serious": "var(--text-colorful-serious)",
+      "notice": "var(--text-colorful-notice)",
+      "noticedark": "var(--text-colorful-noticedark)",
+      "positive": "var(--text-colorful-positive)",
+      "positivedark": "var(--text-colorful-positivedark)",
+      "purple": "var(--text-colorful-purple)"
     }
   },
-  link: {
-    outstandingnormal: "#0080FF",
-    outstandinghover: "#009DFF",
-    outstandingactive: "#005ED1",
-    neutralnormal: "#2C3852BF",
-    neutralhover: "#2C385299",
-    neutralactive: "#172640CC",
-    seriousnormal: "#F0483E",
-    serioushover: "#FF5252",
-    seriousactive: "#C73D31"
+  "link": {
+    "outstandingnormal": "var(--link-outstandingnormal)",
+    "outstandinghover": "var(--link-outstandinghover)",
+    "outstandingactive": "var(--link-outstandingactive)",
+    "neutralnormal": "var(--link-neutralnormal)",
+    "neutralhover": "var(--link-neutralhover)",
+    "neutralactive": "var(--link-neutralactive)",
+    "seriousnormal": "var(--link-seriousnormal)",
+    "serioushover": "var(--link-serioushover)",
+    "seriousactive": "var(--link-seriousactive)"
   },
-  fill: {
-    neutral: {
-      lightwhite: "#FFFFFF99",
-      "trans-1": "#EDF1FA99",
-      "trans-2": "#E1E6F199",
-      "trans-3": "#D3DAEB99",
-      "trans-4": "#C0CBE099",
-      "trans-5": "#ACBAD399",
-      "trans-7": "#0A255599",
-      "trans-8": "#172640CC",
-      white: "#FFFFFF",
-      "opaque-1": "#F2F5FA",
-      "opaque-2": "#EDF0F7",
-      "opaque-3": "#E4E9F2",
-      "opaque-4": "#D8DEEB",
-      "opaque-5": "#CCD4E3",
-      "opaque-6": "#A3B4CC",
-      "opaque-7": "#6B7D99",
-      "opaque-8": "#2D3A56"
+  "fill": {
+    "neutral": {
+      "lightwhite": "var(--fill-neutral-lightwhite)",
+      "trans-1": "var(--fill-neutral-trans-1)",
+      "trans-2": "var(--fill-neutral-trans-2)",
+      "trans-3": "var(--fill-neutral-trans-3)",
+      "trans-4": "var(--fill-neutral-trans-4)",
+      "trans-5": "var(--fill-neutral-trans-5)",
+      "trans-7": "var(--fill-neutral-trans-7)",
+      "trans-8": "var(--fill-neutral-trans-8)",
+      "white": "var(--fill-neutral-white)",
+      "opaque-1": "var(--fill-neutral-opaque-1)",
+      "opaque-2": "var(--fill-neutral-opaque-2)",
+      "opaque-3": "var(--fill-neutral-opaque-3)",
+      "opaque-4": "var(--fill-neutral-opaque-4)",
+      "opaque-5": "var(--fill-neutral-opaque-5)",
+      "opaque-6": "var(--fill-neutral-opaque-6)",
+      "opaque-7": "var(--fill-neutral-opaque-7)",
+      "opaque-8": "var(--fill-neutral-opaque-8)"
     },
-    purple: {
-      base: "#7E41FF",
-      lightactive: "#7E41FF33",
-      lighthover: "#7E41FF29",
-      light: "#7E41FF1A"
+    "purple": {
+      "base": "var(--fill-purple-base)",
+      "lightactive": "var(--fill-purple-lightactive)",
+      "lighthover": "var(--fill-purple-lighthover)",
+      "light": "var(--fill-purple-light)"
     },
-    outstanding: {
-      deep: "#1D326C",
-      dark: "#005ED1",
-      base: "#0080FF",
-      bright: "#009DFF",
-      lightactive: "#0088FF33",
-      lighthover: "#0088FF29",
-      light: "#0088FF1A",
-      thin: "#0088FF0A"
+    "outstanding": {
+      "deep": "var(--fill-outstanding-deep)",
+      "dark": "var(--fill-outstanding-dark)",
+      "base": "var(--fill-outstanding-base)",
+      "bright": "var(--fill-outstanding-bright)",
+      "lightactive": "var(--fill-outstanding-lightactive)",
+      "lighthover": "var(--fill-outstanding-lighthover)",
+      "light": "var(--fill-outstanding-light)",
+      "thin": "var(--fill-outstanding-thin)"
     },
-    serious: {
-      deep: "#7D2126",
-      dark: "#C73D31",
-      base: "#F0483E",
-      bright: "#FF5252",
-      lightactive: "#FF4A4A33",
-      lighthover: "#FF4A4A29",
-      light: "#FF4A4A1A",
-      thin: "#FF4A4A0A"
+    "serious": {
+      "deep": "var(--fill-serious-deep)",
+      "dark": "var(--fill-serious-dark)",
+      "base": "var(--fill-serious-base)",
+      "bright": "var(--fill-serious-bright)",
+      "lightactive": "var(--fill-serious-lightactive)",
+      "lighthover": "var(--fill-serious-lighthover)",
+      "light": "var(--fill-serious-light)",
+      "thin": "var(--fill-serious-thin)"
     },
-    notice: {
-      deep: "#8E671B",
-      dark: "#E07F00",
-      base: "#FEA008",
-      bright: "#FEBA33",
-      lightactive: "#FEA00833",
-      lighthover: "#FEA00829",
-      light: "#FEA0081A",
-      thin: "#FEA0080A"
+    "notice": {
+      "deep": "var(--fill-notice-deep)",
+      "dark": "var(--fill-notice-dark)",
+      "base": "var(--fill-notice-base)",
+      "bright": "var(--fill-notice-bright)",
+      "lightactive": "var(--fill-notice-lightactive)",
+      "lighthover": "var(--fill-notice-lighthover)",
+      "light": "var(--fill-notice-light)",
+      "thin": "var(--fill-notice-thin)"
     },
-    positive: {
-      deep: "#18544F",
-      dark: "#008F4C",
-      base: "#00BA5D",
-      bright: "#23CF6D",
-      lightactive: "#1EC97F33",
-      lighthover: "#1EC97F29",
-      light: "#1EC97F1A",
-      thin: "#1EC97F0A"
+    "positive": {
+      "deep": "var(--fill-positive-deep)",
+      "dark": "var(--fill-positive-dark)",
+      "base": "var(--fill-positive-base)",
+      "bright": "var(--fill-positive-bright)",
+      "lightactive": "var(--fill-positive-lightactive)",
+      "lighthover": "var(--fill-positive-lighthover)",
+      "light": "var(--fill-positive-light)",
+      "thin": "var(--fill-positive-thin)"
     }
   },
-  stroke: {
-    neutral: {
-      lightwhite: "#FFFFFF99",
-      "trans-1": "#E1E6F199",
-      "trans-2": "#D3DAEB99",
-      "trans-3": "#ACBAD399",
-      "trans-4": "#6B80A799",
-      white: "#FFFFFF",
-      "opaque-1": "#EDF0F7",
-      "opaque-2": "#E4E9F2",
-      "opaque-3": "#CCD4E3",
-      "opaque-4": "#A3B4CC"
+  "stroke": {
+    "neutral": {
+      "lightwhite": "var(--stroke-neutral-lightwhite)",
+      "trans-1": "var(--stroke-neutral-trans-1)",
+      "trans-2": "var(--stroke-neutral-trans-2)",
+      "trans-3": "var(--stroke-neutral-trans-3)",
+      "trans-4": "var(--stroke-neutral-trans-4)",
+      "white": "var(--stroke-neutral-white)",
+      "opaque-1": "var(--stroke-neutral-opaque-1)",
+      "opaque-2": "var(--stroke-neutral-opaque-2)",
+      "opaque-3": "var(--stroke-neutral-opaque-3)",
+      "opaque-4": "var(--stroke-neutral-opaque-4)"
     },
-    outstanding: {
-      base: "#0080FF",
-      light: "#0088FF29"
+    "outstanding": {
+      "base": "var(--stroke-outstanding-base)",
+      "light": "var(--stroke-outstanding-light)"
     },
-    serious: {
-      base: "#F0483E",
-      light: "#FF4A4A29",
-      thin: "#FF4A4A1A"
+    "serious": {
+      "base": "var(--stroke-serious-base)",
+      "light": "var(--stroke-serious-light)",
+      "thin": "var(--stroke-serious-thin)"
     }
   },
-  pagebackground: {
-    primary: "#FFFFFF",
-    grouped: "#EDF0F7"
+  "pagebackground": {
+    "primary": "var(--pagebackground-primary)",
+    "grouped": "var(--pagebackground-grouped)"
   },
-  dim: {
-    undermenu: "#3F63941A",
-    "single-dialogmask": "#101A2966",
-    "double-dialogmask": "#101A2999"
+  "dim": {
+    "undermenu": "var(--dim-undermenu)",
+    "single-dialogmask": "var(--dim-single-dialogmask)",
+    "double-dialogmask": "var(--dim-double-dialogmask)"
   },
-  chart: {
-    blue: {
-      "blue-1": "#ADE5FF",
-      "blue-2": "#7FD2FF",
-      "blue-3": "#51BCFF",
-      "blue-4": "#19A3FF",
-      "blue-5": "#008CFF",
-      "blue-6": "#0775F2",
-      "blue-7": "#1064DA",
-      "blue-8": "#0F53C1",
-      "blue-9": "#0C3FA6",
-      "blue-10": "#05318D"
+  "chart": {
+    "blue": {
+      "blue-1": "var(--chart-blue-blue-1)",
+      "blue-2": "var(--chart-blue-blue-2)",
+      "blue-3": "var(--chart-blue-blue-3)",
+      "blue-4": "var(--chart-blue-blue-4)",
+      "blue-5": "var(--chart-blue-blue-5)",
+      "blue-6": "var(--chart-blue-blue-6)",
+      "blue-7": "var(--chart-blue-blue-7)",
+      "blue-8": "var(--chart-blue-blue-8)",
+      "blue-9": "var(--chart-blue-blue-9)",
+      "blue-10": "var(--chart-blue-blue-10)"
     },
-    green: {
-      "green-1": "#A2F0D5",
-      "green-2": "#80E4BC",
-      "green-3": "#62D9A4",
-      "green-4": "#47CD8A",
-      "green-5": "#21BE6A",
-      "green-6": "#06AC53",
-      "green-7": "#0C9646",
-      "green-8": "#0C8137",
-      "green-9": "#0A6B29",
-      "green-10": "#05551B"
+    "green": {
+      "green-1": "var(--chart-green-green-1)",
+      "green-2": "var(--chart-green-green-2)",
+      "green-3": "var(--chart-green-green-3)",
+      "green-4": "var(--chart-green-green-4)",
+      "green-5": "var(--chart-green-green-5)",
+      "green-6": "var(--chart-green-green-6)",
+      "green-7": "var(--chart-green-green-7)",
+      "green-8": "var(--chart-green-green-8)",
+      "green-9": "var(--chart-green-green-9)",
+      "green-10": "var(--chart-green-green-10)"
     },
-    purple: {
-      "purple-1": "#E1C1FF",
-      "purple-2": "#CFA3FF",
-      "purple-3": "#BE89FF",
-      "purple-4": "#A66BFF",
-      "purple-5": "#8E51FF",
-      "purple-6": "#753BF1",
-      "purple-7": "#612FD4",
-      "purple-8": "#4E27B9",
-      "purple-9": "#3D1D9F",
-      "purple-10": "#2B1385"
+    "purple": {
+      "purple-1": "var(--chart-purple-purple-1)",
+      "purple-2": "var(--chart-purple-purple-2)",
+      "purple-3": "var(--chart-purple-purple-3)",
+      "purple-4": "var(--chart-purple-purple-4)",
+      "purple-5": "var(--chart-purple-purple-5)",
+      "purple-6": "var(--chart-purple-purple-6)",
+      "purple-7": "var(--chart-purple-purple-7)",
+      "purple-8": "var(--chart-purple-purple-8)",
+      "purple-9": "var(--chart-purple-purple-9)",
+      "purple-10": "var(--chart-purple-purple-10)"
     },
-    red: {
-      "red-1": "#FFBCC1",
-      "red-2": "#FFA8A9",
-      "red-3": "#FF8989",
-      "red-4": "#FC726E",
-      "red-5": "#F4554C",
-      "red-6": "#DE433B",
-      "red-7": "#BB3935",
-      "red-8": "#992F2D",
-      "red-9": "#782725",
-      "red-10": "#571E1E"
+    "red": {
+      "red-1": "var(--chart-red-red-1)",
+      "red-2": "var(--chart-red-red-2)",
+      "red-3": "var(--chart-red-red-3)",
+      "red-4": "var(--chart-red-red-4)",
+      "red-5": "var(--chart-red-red-5)",
+      "red-6": "var(--chart-red-red-6)",
+      "red-7": "var(--chart-red-red-7)",
+      "red-8": "var(--chart-red-red-8)",
+      "red-9": "var(--chart-red-red-9)",
+      "red-10": "var(--chart-red-red-10)"
     },
-    yellow: {
-      "yellow-1": "#FFDE6C",
-      "yellow-2": "#FED158",
-      "yellow-3": "#FEC444",
-      "yellow-4": "#FEB630",
-      "yellow-5": "#FEA819",
-      "yellow-6": "#E79305",
-      "yellow-7": "#BB7A03",
-      "yellow-8": "#926102",
-      "yellow-9": "#6B4803",
-      "yellow-10": "#483100"
+    "yellow": {
+      "yellow-1": "var(--chart-yellow-yellow-1)",
+      "yellow-2": "var(--chart-yellow-yellow-2)",
+      "yellow-3": "var(--chart-yellow-yellow-3)",
+      "yellow-4": "var(--chart-yellow-yellow-4)",
+      "yellow-5": "var(--chart-yellow-yellow-5)",
+      "yellow-6": "var(--chart-yellow-yellow-6)",
+      "yellow-7": "var(--chart-yellow-yellow-7)",
+      "yellow-8": "var(--chart-yellow-yellow-8)",
+      "yellow-9": "var(--chart-yellow-yellow-9)",
+      "yellow-10": "var(--chart-yellow-yellow-10)"
+    },
+    "pink": {
+      "pink-1": "var(--chart-pink-pink-1)",
+      "pink-2": "var(--chart-pink-pink-2)",
+      "pink-3": "var(--chart-pink-pink-3)",
+      "pink-4": "var(--chart-pink-pink-4)",
+      "pink-5": "var(--chart-pink-pink-5)",
+      "pink-6": "var(--chart-pink-pink-6)",
+      "pink-7": "var(--chart-pink-pink-7)",
+      "pink-8": "var(--chart-pink-pink-8)",
+      "pink-9": "var(--chart-pink-pink-9)",
+      "pink-10": "var(--chart-pink-pink-10)"
+    },
+    "cyan": {
+      "cyan-1": "var(--chart-cyan-cyan-1)",
+      "cyan-2": "var(--chart-cyan-cyan-2)",
+      "cyan-3": "var(--chart-cyan-cyan-3)",
+      "cyan-4": "var(--chart-cyan-cyan-4)",
+      "cyan-5": "var(--chart-cyan-cyan-5)",
+      "cyan-6": "var(--chart-cyan-cyan-6)",
+      "cyan-7": "var(--chart-cyan-cyan-7)",
+      "cyan-8": "var(--chart-cyan-cyan-8)",
+      "cyan-9": "var(--chart-cyan-cyan-9)",
+      "cyan-10": "var(--chart-cyan-cyan-10)"
     }
   },
-  white: {
-    white: "#FFFFFF",
-    "white-a60": "#FFFFFF99"
+  "white": {
+    "white": "var(--white-white)",
+    "white-a60": "var(--white-white-a60)"
   },
-  gray: {
-    "gray-10": "#F2F5FA",
-    "gray-20": "#EDF0F7",
-    "gray-30": "#E4E9F2",
-    "gray-40": "#D8DEEB",
-    "gray-50": "#CCD4E3",
-    "gray-60": "#A3B4CC",
-    "gray-70": "#6B7D99",
-    "gray-80": "#2D3A56",
-    "gray-90": "#172640",
-    "gray-100": "#0D1B36",
-    "gray-110": "#0A1833",
-    "gray-120": "#00122E",
-    "gray-a60-1": "#EDF1FA99",
-    "gray-a60-2": "#E1E6F199",
-    "gray-a60-3": "#D3DAEB99",
-    "gray-a60-4": "#C0CBE099",
-    "gray-a60-5": "#ACBAD399",
-    "gray-a60-6": "#6B80A799",
-    "gray-a80-6": "#6B80A7CC",
-    "gray-a60-7": "#0A255599",
-    "gray-a60-8": "#2C385299",
-    "gray-a75-8": "#2C3852BF",
-    "gray-a80-9": "#172640CC",
-    "gray-a30-10": "#0015404D"
+  "gray": {
+    "gray-10": "var(--gray-gray-10)",
+    "gray-20": "var(--gray-gray-20)",
+    "gray-30": "var(--gray-gray-30)",
+    "gray-40": "var(--gray-gray-40)",
+    "gray-50": "var(--gray-gray-50)",
+    "gray-60": "var(--gray-gray-60)",
+    "gray-70": "var(--gray-gray-70)",
+    "gray-80": "var(--gray-gray-80)",
+    "gray-90": "var(--gray-gray-90)",
+    "gray-100": "var(--gray-gray-100)",
+    "gray-110": "var(--gray-gray-110)",
+    "gray-120": "var(--gray-gray-120)",
+    "gray-a60-1": "var(--gray-gray-a60-1)",
+    "gray-a60-2": "var(--gray-gray-a60-2)",
+    "gray-a60-3": "var(--gray-gray-a60-3)",
+    "gray-a60-4": "var(--gray-gray-a60-4)",
+    "gray-a60-5": "var(--gray-gray-a60-5)",
+    "gray-a60-6": "var(--gray-gray-a60-6)",
+    "gray-a80-6": "var(--gray-gray-a80-6)",
+    "gray-a60-7": "var(--gray-gray-a60-7)",
+    "gray-a60-8": "var(--gray-gray-a60-8)",
+    "gray-a75-8": "var(--gray-gray-a75-8)",
+    "gray-a80-9": "var(--gray-gray-a80-9)",
+    "gray-a30-10": "var(--gray-gray-a30-10)"
   },
-  blue: {
-    "blue-90": "#1D326C",
-    "blue-60": "#005ED1",
-    "blue-50": "#0080FF",
-    "blue-40": "#009DFF",
-    "blue-a20-50": "#0088FF33",
-    "blue-a16-50": "#0088FF29",
-    "blue-a10-50": "#0088FF1A",
-    "blue-a04-50": "#0088FF0A"
+  "blue": {
+    "blue-90": "var(--blue-blue-90)",
+    "blue-60": "var(--blue-blue-60)",
+    "blue-50": "var(--blue-blue-50)",
+    "blue-40": "var(--blue-blue-40)",
+    "blue-a20-50": "var(--blue-blue-a20-50)",
+    "blue-a16-50": "var(--blue-blue-a16-50)",
+    "blue-a10-50": "var(--blue-blue-a10-50)",
+    "blue-a04-50": "var(--blue-blue-a04-50)"
   },
-  red: {
-    "red-90": "#7D2126",
-    "red-60": "#C73D31",
-    "red-50": "#F0483E",
-    "red-40": "#FF5252",
-    "red-a20-50": "#FF4A4A33",
-    "red-a16-50": "#FF4A4A29",
-    "red-a10-50": "#FF4A4A1A",
-    "red-a04-50": "#FF4A4A0A"
+  "red": {
+    "red-90": "var(--red-red-90)",
+    "red-60": "var(--red-red-60)",
+    "red-50": "var(--red-red-50)",
+    "red-40": "var(--red-red-40)",
+    "red-a20-50": "var(--red-red-a20-50)",
+    "red-a16-50": "var(--red-red-a16-50)",
+    "red-a10-50": "var(--red-red-a10-50)",
+    "red-a04-50": "var(--red-red-a04-50)"
   },
-  yellow: {
-    "yellow-90": "#8E671B",
-    "yellow-60": "#E07F00",
-    "yellow-50": "#FEA008",
-    "yellow-40": "#FEBA33",
-    "yellow-a20-50": "#FEA00833",
-    "yellow-a16-50": "#FEA00829",
-    "yellow-a10-50": "#FEA0081A",
-    "yellow-a04-50": "#FEA0080A"
+  "yellow": {
+    "yellow-90": "var(--yellow-yellow-90)",
+    "yellow-60": "var(--yellow-yellow-60)",
+    "yellow-50": "var(--yellow-yellow-50)",
+    "yellow-40": "var(--yellow-yellow-40)",
+    "yellow-a20-50": "var(--yellow-yellow-a20-50)",
+    "yellow-a16-50": "var(--yellow-yellow-a16-50)",
+    "yellow-a10-50": "var(--yellow-yellow-a10-50)",
+    "yellow-a04-50": "var(--yellow-yellow-a04-50)"
   },
-  green: {
-    "green-90": "#18544F",
-    "green-60": "#008F4C",
-    "green-50": "#00BA5D",
-    "green-40": "#23CF6D",
-    "green-a20-50": "#1EC97F33",
-    "green-a16-50": "#1EC97F29",
-    "green-a10-50": "#1EC97F1A",
-    "green-a04-50": "#1EC97F0A"
+  "green": {
+    "green-90": "var(--green-green-90)",
+    "green-60": "var(--green-green-60)",
+    "green-50": "var(--green-green-50)",
+    "green-40": "var(--green-green-40)",
+    "green-a20-50": "var(--green-green-a20-50)",
+    "green-a16-50": "var(--green-green-a16-50)",
+    "green-a10-50": "var(--green-green-a10-50)",
+    "green-a04-50": "var(--green-green-a04-50)"
   },
-  purple: {
-    "purple-50": "#7E41FF",
-    "purple-a20-50": "#7E41FF33",
-    "purple-a16-50": "#7E41FF29",
-    "purple-a10-50": "#7E41FF1A"
+  "purple": {
+    "purple-50": "var(--purple-purple-50)",
+    "purple-a20-50": "var(--purple-purple-a20-50)",
+    "purple-a16-50": "var(--purple-purple-a16-50)",
+    "purple-a10-50": "var(--purple-purple-a10-50)"
   },
-  gradient: {
-    loading: "linear-gradient(90deg, #0080ff 0%, #9ecfff 50%, #0080ff 100%)"
+  "gradient": {
+    "loading": "var(--gradient-loading)",
+    "light-blue": "var(--gradient-light-blue)",
+    "dark-blue": "var(--gradient-dark-blue)"
   }
 };