admin-panel: upgrade to ant-design-vue 4.2.6
- Bump ant-design-vue 3.2.20 -> 4.2.6, @ant-design/icons-vue 6.1.0 -> 7.0.1. - ADV4 removed LESS theming (modifyVars) for CSS-in-JS design tokens: drop the vite.config.ts modifyVars block and the antd.less import; move the three tokens ant actually consumed (primary/link/border-radius) to App.vue's <a-config-provider :theme>. - Delete src/assets/styles/ant.less (426 lines of hand-written RTL flips): ADV4 renders RTL natively via CSS logical properties given direction="rtl", which App.vue already sets. Preserve only the small residue ADV4 doesn't cover natively (upload filename LTR, select dropdown z-index, tabs nav direction) in a new rtl-overrides.css. - Clean up the stale --primary/--accent token comment in utilities.less now that ant.less is gone. - Verified: pnpm build (vue-tsc -b && vite build) passes with zero errors; the codebase already used v-model:open everywhere (no ADV3 visible prop usage to migrate). Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
This commit is contained in:
co-authored by
Claude Sonnet 5
parent
8fac6a3f36
commit
7e30701570
@@ -1,11 +1,21 @@
|
||||
// Style entry for admin-panel.
|
||||
// Order matters and mirrors legacy henza_admin/src/main.js:
|
||||
// 1. ant-design-vue's own less theme (compiled with the modifyVars in vite.config.ts)
|
||||
// 2. farsi.scss -> font faces + global reset
|
||||
// 3. ara/ant.less -> RTL overrides layered on top of ant's defaults
|
||||
@import 'ant-design-vue/dist/antd.less';
|
||||
//
|
||||
// ant-design-vue 4 removed its LESS theme entirely (CSS-in-JS design tokens
|
||||
// replace modifyVars) — `ant-design-vue/dist/antd.less` no longer exists, so
|
||||
// it is no longer imported here; ADV4's runtime styles are injected by the
|
||||
// library itself. Primary/link/radius tokens now live in App.vue's
|
||||
// <a-config-provider :theme>.
|
||||
//
|
||||
// `ara/ant.less` (426 lines of hand-written RTL flips for float/margin/
|
||||
// transform) is also gone: ADV4 renders RTL natively via CSS logical
|
||||
// properties when direction="rtl" is set, which App.vue already does. The
|
||||
// small residue ADV4 does not cover lives in ./rtl-overrides.css.
|
||||
//
|
||||
// Remaining order:
|
||||
// 1. farsi.less -> font faces + global reset
|
||||
// 2. rtl-overrides.css -> the few RTL rules ADV4 doesn't provide natively
|
||||
// 3. utilities.less -> the global utility layer replacing legacy's Tailwind
|
||||
// build. Must come last so its card chrome layers over ant's own styles.
|
||||
@import './farsi.less';
|
||||
@import './ant.less';
|
||||
// 4. utilities.less -> the global utility layer replacing legacy's Tailwind
|
||||
// build. Must come LAST so its card chrome layers over ant's own styles.
|
||||
@import './rtl-overrides.css';
|
||||
@import './utilities.less';
|
||||
|
||||
Reference in New Issue
Block a user