104 lines
2.4 KiB
Vue
104 lines
2.4 KiB
Vue
<template>
|
|
<a-config-provider :locale="locale" :theme="themeConfig">
|
|
<router-view />
|
|
</a-config-provider>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import { ConfigProviderProps } from "ant-design-vue"
|
|
import zhCN from "ant-design-vue/es/locale/zh_CN"
|
|
import type { Locale } from "ant-design-vue/es/locale"
|
|
|
|
// 引入 ant-design-vue 中文语言包
|
|
const locale: Locale = zhCN
|
|
|
|
// 乐绘世界创想活动乐园 — 主题配置
|
|
// 风格：活泼、艺术、少儿绘本创作
|
|
const themeConfig: ConfigProviderProps["theme"] = {
|
|
token: {
|
|
// 色彩
|
|
colorPrimary: "#6366F1",
|
|
colorSuccess: "#10B981",
|
|
colorError: "#F43F5E",
|
|
colorWarning: "#F59E0B",
|
|
colorInfo: "#6366F1",
|
|
colorLink: "#6366F1",
|
|
|
|
// 字体
|
|
fontFamily:
|
|
"'Nunito', -apple-system, BlinkMacSystemFont, 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', sans-serif",
|
|
fontSize: 14,
|
|
|
|
// 圆角
|
|
borderRadius: 10,
|
|
borderRadiusLG: 16,
|
|
borderRadiusSM: 8,
|
|
|
|
// 阴影
|
|
boxShadow:
|
|
"0 1px 3px rgba(99,102,241,0.06), 0 4px 12px rgba(99,102,241,0.04)",
|
|
boxShadowSecondary:
|
|
"0 4px 16px rgba(99,102,241,0.10), 0 8px 32px rgba(99,102,241,0.06)",
|
|
|
|
// 背景与边框
|
|
colorBgLayout: "#F8F7FC",
|
|
colorBgContainer: "#FFFFFF",
|
|
colorBorder: "#E5E1F5",
|
|
colorBorderSecondary: "#F0ECF9",
|
|
|
|
// 文字
|
|
colorText: "#1E1B4B",
|
|
colorTextSecondary: "#6B7280",
|
|
colorTextTertiary: "#9CA3AF",
|
|
|
|
// 控件尺寸
|
|
controlHeight: 38,
|
|
controlHeightLG: 44,
|
|
controlHeightSM: 32,
|
|
},
|
|
components: {
|
|
Button: {
|
|
borderRadius: 10,
|
|
controlHeight: 38,
|
|
fontWeight: 600,
|
|
},
|
|
Card: {
|
|
borderRadiusLG: 16,
|
|
},
|
|
Table: {
|
|
headerBg: "#F5F3FF",
|
|
headerColor: "#6B7280",
|
|
rowHoverBg: "#FAF9FE",
|
|
borderColor: "#F0ECF9",
|
|
},
|
|
Input: {
|
|
borderRadius: 10,
|
|
},
|
|
Select: {
|
|
borderRadius: 10,
|
|
},
|
|
Tag: {
|
|
borderRadiusSM: 20,
|
|
},
|
|
Menu: {
|
|
itemBorderRadius: 12,
|
|
itemHeight: 44,
|
|
subMenuItemBg: "transparent",
|
|
itemSelectedBg: "rgba(99, 102, 241, 0.10)",
|
|
itemSelectedColor: "#6366F1",
|
|
itemHoverBg: "rgba(99, 102, 241, 0.06)",
|
|
itemHoverColor: "#6366F1",
|
|
},
|
|
DatePicker: {
|
|
borderRadius: 10,
|
|
},
|
|
Modal: {
|
|
borderRadiusLG: 16,
|
|
},
|
|
},
|
|
algorithm: undefined,
|
|
}
|
|
</script>
|
|
|
|
<style scoped lang="scss"></style>
|