create-iking-admin/template-micro/iking-main-admin/src/mainApp/logics/theme/index.ts

金合技术中台脚手架

/*
 * @Author: wfl
 * @LastEditors: wfl
 * @description:
 * @updateInfo:
 * @Date: 2022-07-29 11:45:14
 * @LastEditTime: 2022-08-29 11:02:31
 */
import { generateColors, getThemeColors } from '../../../../build/config/themeConfig';

import { ikColor } from 'iking-utils';
import { replaceStyleVariables } from 'vite-plugin-theme/es/client';
import { mixDarken, mixLighten, tinycolor } from 'vite-plugin-theme/es/colorUtils';

export async function changeTheme(color: string) {
  const colors = generateColors({
    mixDarken,
    mixLighten,
    tinycolor,
    color,
  });
  document.documentElement.style.setProperty('--theme-main-color', color);
  document.documentElement.style.setProperty('--theme-main-color-2', ikColor.hexToRGBA(color, 0.2));
  document.documentElement.style.setProperty('--theme-main-color-3', ikColor.hexToRGBA(color, 0.3));
  document.documentElement.style.setProperty('--theme-main-color-5', ikColor.hexToRGBA(color, 0.5));
  document.documentElement.style.setProperty('--theme-main-color-8', ikColor.hexToRGBA(color, 0.8));
  return await replaceStyleVariables({
    colorVariables: [...getThemeColors(color), ...colors],
  });
}