// @unocss-include
import { getColorPalette, getRgb } from '@sa/color';
import { DARK_CLASS } from '@/constants/app';
import { localStg } from '@/utils/storage';
import { toggleHtmlClass } from '@/utils/common';
import { $t } from '@/locales';
export function setupLoading() {
const themeColor = localStg.get('themeColor') || '#646cff';
const darkMode = localStg.get('darkMode') || false;
const palette = getColorPalette(themeColor);
const { r, g, b } = getRgb(themeColor);
const primaryColor = `--primary-color: ${r} ${g} ${b}`;
const svgCssVars = Array.from(palette.entries())
.map(([key, value]) => `--logo-color-${key}: ${value}`)
.join(';');
const cssVars = `${primaryColor}; ${svgCssVars}`;
if (darkMode) {
toggleHtmlClass(DARK_CLASS).add();
}
const loadingClasses = [
'left-0 top-0',
'left-0 bottom-0 animate-delay-500',
'right-0 top-0 animate-delay-1000',
'right-0 bottom-0 animate-delay-1500'
];
const dot = loadingClasses
.map(item => {
return ``;
})
.join('\n');
const loading = `
${getLogoSvg()}
${$t('system.title')}
`;
const app = document.getElementById('app');
if (app) {
app.innerHTML = loading;
}
}
function getLogoSvg() {
const logoSvg = `
`;
return logoSvg;
}