From 11a36ef03ff241016421bd2a1885cc0836cf16cf Mon Sep 17 00:00:00 2001 From: vben Date: Tue, 28 May 2024 23:38:36 +0800 Subject: [PATCH] chore: update deps --- .vscode/settings.json | 4 + apps/antd-view/package.json | 2 +- .../commitlint-config/package.json | 4 +- .../lint-configs/eslint-config/package.json | 4 +- internal/tailwind-config/package.json | 3 +- internal/tailwind-config/src/index.ts | 13 +- internal/tailwind-config/src/plugins.ts | 22 ++ package.json | 4 +- .../shared/design-tokens/src/dark/index.scss | 18 +- .../design-tokens/src/default/index.scss | 12 +- .../shared/design/src/scss/common/base.scss | 23 +- .../shared/design/src/scss/index.scss | 4 - .../@vben-core/shared/design/src/tailwind.css | 12 +- .../@vben-core/uikit/layout-ui/package.json | 2 +- .../src/components/layout-header.vue | 30 +- .../layout-ui/src/components/layout-tabs.vue | 24 +- .../uikit/layout-ui/src/vben-layout.vue | 59 +--- .../@vben-core/uikit/menu-ui/package.json | 2 +- .../@vben-core/uikit/shadcn-ui/package.json | 4 +- packages/business/common-ui/package.json | 4 +- .../common-ui/src/fallback/fallback.vue | 2 +- .../src/authentication/authentication.vue | 18 +- .../layouts/src/authentication/toolbar.vue | 2 +- packages/preference/package.json | 2 +- packages/preference/src/preference.ts | 4 +- .../src/scss => styles/src}/common/entry.scss | 0 .../src/common/nprogress.css} | 3 +- packages/styles/src/index.scss | 4 + packages/styles/src/index.ts | 1 + packages/styles/src/tokens/dark.scss | 6 + packages/styles/src/tokens/light.scss | 9 + pnpm-lock.yaml | 300 ++++++++++++------ 32 files changed, 327 insertions(+), 274 deletions(-) create mode 100644 internal/tailwind-config/src/plugins.ts rename packages/{@vben-core/shared/design/src/scss => styles/src}/common/entry.scss (100%) rename packages/{@vben-core/shared/design/src/scss/nprogress.scss => styles/src/common/nprogress.css} (97%) create mode 100644 packages/styles/src/index.scss create mode 100644 packages/styles/src/tokens/dark.scss create mode 100644 packages/styles/src/tokens/light.scss diff --git a/.vscode/settings.json b/.vscode/settings.json index 7c867e60..7ed1ca79 100644 --- a/.vscode/settings.json +++ b/.vscode/settings.json @@ -155,6 +155,10 @@ "json5" ], + "tailwindCSS.experimental.classRegex": [ + ["cva\\(([^)]*)\\)", "[\"'`]([^\"'`]*).*?[\"'`]"] + ], + "github.copilot.enable": { "*": true, "markdown": true, diff --git a/apps/antd-view/package.json b/apps/antd-view/package.json index 29e68dbc..d4175345 100644 --- a/apps/antd-view/package.json +++ b/apps/antd-view/package.json @@ -33,7 +33,7 @@ "@vben/styles": "workspace:*", "@vben/types": "workspace:*", "@vben/utils": "workspace:*", - "@vueuse/core": "^10.9.0", + "@vueuse/core": "^10.10.0", "ant-design-vue": "^4.2.1", "axios": "^1.7.2", "dayjs": "^1.11.11", diff --git a/internal/lint-configs/commitlint-config/package.json b/internal/lint-configs/commitlint-config/package.json index 3fb21fae..0e1bec40 100644 --- a/internal/lint-configs/commitlint-config/package.json +++ b/internal/lint-configs/commitlint-config/package.json @@ -34,7 +34,7 @@ "@commitlint/cli": "^19.3.0", "@commitlint/config-conventional": "^19.2.2", "@vben/node-utils": "workspace:*", - "cz-git": "^1.9.1", - "czg": "^1.9.1" + "cz-git": "^1.9.2", + "czg": "^1.9.2" } } diff --git a/internal/lint-configs/eslint-config/package.json b/internal/lint-configs/eslint-config/package.json index 823fe3f4..cff8e393 100644 --- a/internal/lint-configs/eslint-config/package.json +++ b/internal/lint-configs/eslint-config/package.json @@ -35,8 +35,8 @@ "devDependencies": { "@eslint/js": "^9.3.0", "@types/eslint": "^8.56.10", - "@typescript-eslint/eslint-plugin": "^7.10.0", - "@typescript-eslint/parser": "^7.10.0", + "@typescript-eslint/eslint-plugin": "^7.11.0", + "@typescript-eslint/parser": "^7.11.0", "eslint": "^8.57.0", "eslint-config-prettier": "^9.1.0", "eslint-plugin-eslint-comments": "^3.2.0", diff --git a/internal/tailwind-config/package.json b/internal/tailwind-config/package.json index 84f9dc52..dd9c5dab 100644 --- a/internal/tailwind-config/package.json +++ b/internal/tailwind-config/package.json @@ -45,9 +45,10 @@ "./*": "./*" }, "dependencies": { - "@iconify/json": "^2.2.213", + "@iconify/json": "^2.2.214", "@iconify/tailwind": "^1.1.1", "@tailwindcss/forms": "^0.5.7", + "@tailwindcss/typography": "^0.5.13", "autoprefixer": "^10.4.19", "cssnano": "^7.0.1", "postcss": "^8.4.38", diff --git a/internal/tailwind-config/src/index.ts b/internal/tailwind-config/src/index.ts index 232a24ec..5384ba4c 100644 --- a/internal/tailwind-config/src/index.ts +++ b/internal/tailwind-config/src/index.ts @@ -4,8 +4,11 @@ import path from 'node:path'; import { addDynamicIconSelectors } from '@iconify/tailwind'; import formsPlugin from '@tailwindcss/forms'; +import typographyPlugin from '@tailwindcss/typography'; import { fs, getPackagesSync } from '@vben/node-utils'; import animate from 'tailwindcss-animate'; + +import { plugins } from './plugins'; // import defaultTheme from 'tailwindcss/defaultTheme'; const { packages } = getPackagesSync(); @@ -27,7 +30,13 @@ export default { ), ], darkMode: 'class', - plugins: [animate, formsPlugin, addDynamicIconSelectors()], + plugins: [ + ...plugins, + animate, + formsPlugin, + typographyPlugin, + addDynamicIconSelectors(), + ], prefix: '', safelist: ['dark'], theme: { @@ -59,7 +68,7 @@ export default { hover: 'hsl(var(--color-accent-hover))', }, background: 'hsl(var(--color-background) / )', - body: 'hsl(var(--color-body) / )', + // body: 'hsl(var(--color-body) / )', border: 'hsl(var(--color-border))', card: { DEFAULT: 'hsl(var(--color-card))', diff --git a/internal/tailwind-config/src/plugins.ts b/internal/tailwind-config/src/plugins.ts new file mode 100644 index 00000000..697b04af --- /dev/null +++ b/internal/tailwind-config/src/plugins.ts @@ -0,0 +1,22 @@ +import type { Config } from 'tailwindcss'; + +import plugin from 'tailwindcss/plugin'; + +const flexCenterStyles = { + 'align-items': 'center', + display: 'flex', + 'justify-content': 'center', +}; + +const plugins = [ + plugin(({ addUtilities }) => { + addUtilities({ + '.flex-center': flexCenterStyles, + '.flex-col-center': { + ...flexCenterStyles, + }, + }); + }), +] as unknown as Config['plugins'][]; + +export { plugins }; diff --git a/package.json b/package.json index 1e589464..1ad13028 100644 --- a/package.json +++ b/package.json @@ -61,7 +61,7 @@ "cross-env": "^7.0.3", "husky": "^9.0.11", "is-ci": "^3.0.1", - "jsdom": "^24.0.0", + "jsdom": "^24.1.0", "rimraf": "^5.0.7", "taze": "^0.13.8", "turbo": "^1.13.3", @@ -75,7 +75,7 @@ "node": ">=18.7.0", "pnpm": ">=8.5.0" }, - "packageManager": "pnpm@9.1.2", + "packageManager": "pnpm@9.1.3", "pnpm": { "overrides": { "@ctrl/tinycolor": "4.1.0", diff --git a/packages/@vben-core/shared/design-tokens/src/dark/index.scss b/packages/@vben-core/shared/design-tokens/src/dark/index.scss index 958afe0f..7138e481 100644 --- a/packages/@vben-core/shared/design-tokens/src/dark/index.scss +++ b/packages/@vben-core/shared/design-tokens/src/dark/index.scss @@ -3,7 +3,7 @@ /* --color-background: 240 6% 18%; */ // --color-body: 220deg 13.04% 8%; - --color-body: 220deg 13.04% 8%; + // --color-body: hsl(240deg 11% 4%); --color-background: 220deg 13.04% 8%; /* --color-background: 219 42% 11%; */ @@ -76,20 +76,4 @@ /* 基本圆角大小 */ --radius-base: 0.5rem; - - /* ======================================== */ - - /* =============component & UI============= */ - - /* ======================================== */ - - /* --color-login-background: 219 42% 11%; */ - - /* 图标颜色 */ - - /* authentication */ - --color-authentication-from: hsl(240deg 11% 6%); - --color-authentication-to: hsl(240deg 11% 6%); - - color-scheme: dark; } diff --git a/packages/@vben-core/shared/design-tokens/src/default/index.scss b/packages/@vben-core/shared/design-tokens/src/default/index.scss index 3acc1de5..2096c57e 100644 --- a/packages/@vben-core/shared/design-tokens/src/default/index.scss +++ b/packages/@vben-core/shared/design-tokens/src/default/index.scss @@ -1,13 +1,9 @@ /* https://gavin-yyc.github.io/colorconvert/ */ :root { - --font-geist-sans: 'geist-sans', -apple-system, blinkmacsystemfont, 'Segoe UI', - roboto, helvetica, arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', - 'Segoe UI Symbol'; - /* 基础背景颜色颜色 */ /* --color-background: 210deg 25% 96.86%; */ - --color-body: 210deg 25% 96.86%; + // --color-main: 210deg 25% 96.86%; --color-background: 0 0 100%; // --color-darken-background: 220deg 13.04% 8%; @@ -86,8 +82,6 @@ /* ======================================== */ - /* --color-login-background: 0 0 100%; */ - /* menu */ --color-menu-dark: 225deg 12% 13%; --color-menu-dark-darken: 223deg 11% 10%; @@ -96,8 +90,4 @@ --color-menu: 0deg 0% 100%; --color-menu-darken: 0deg 0% 95%; // --color-menu-opened: 0deg 0% 100%; - - /* authentication */ - --color-authentication-from: hsl(231deg 61% 44%); - --color-authentication-to: hsl(218deg 70% 42%); } diff --git a/packages/@vben-core/shared/design/src/scss/common/base.scss b/packages/@vben-core/shared/design/src/scss/common/base.scss index 9b2b2165..99101c23 100644 --- a/packages/@vben-core/shared/design/src/scss/common/base.scss +++ b/packages/@vben-core/shared/design/src/scss/common/base.scss @@ -10,29 +10,26 @@ html { *, ::after, ::before { + @apply border-border; + box-sizing: border-box; - border-color: hsl(var(--color-border)); border-style: solid; border-width: 0; } -body.invert { - filter: invert(100%); +body.invert-mode { + @apply invert; } -body.grayscale { - --tw-grayscale: grayscale(100%); - - filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) - var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) - var(--tw-sepia) var(--tw-drop-shadow); +body.grayscale-mode { + @apply grayscale; } html { - font-size: var(--font-size-base); + @apply text-foreground bg-background; + + // font-size: 62.5%; font-variation-settings: normal; - color: hsl(var(--color-foreground)); - background-color: hsl(var(--color-background)); text-size-adjust: 100%; font-synthesis-weight: none; scroll-behavior: smooth; @@ -73,7 +70,7 @@ html.dark::view-transition-new(root) { input::placeholder, textarea::placeholder { - color: hsl(var(--color-input-placeholder)) !important; + // color: hsl(var(--color-input-placeholder)) !important; opacity: 1; } diff --git a/packages/@vben-core/shared/design/src/scss/index.scss b/packages/@vben-core/shared/design/src/scss/index.scss index 0caa558b..7776baef 100644 --- a/packages/@vben-core/shared/design/src/scss/index.scss +++ b/packages/@vben-core/shared/design/src/scss/index.scss @@ -1,8 +1,4 @@ /** css 样式重置 */ @import 'modern-normalize/modern-normalize.css'; - -/** 元素进入动画 */ -@import './common/entry'; @import './common/base'; @import './transition'; -@import './nprogress'; diff --git a/packages/@vben-core/shared/design/src/tailwind.css b/packages/@vben-core/shared/design/src/tailwind.css index c07c94e8..99817876 100644 --- a/packages/@vben-core/shared/design/src/tailwind.css +++ b/packages/@vben-core/shared/design/src/tailwind.css @@ -1,21 +1,15 @@ @tailwind base; @tailwind components; @tailwind utilities; + @layer base { html { @apply font-sans; } } -@layer components { - .flex-center { - @apply flex items-center justify-center; - } - .flex-col-center { - @apply flex flex-col items-center justify-center; - } - .outline-box { - @apply outline-border relative cursor-pointer rounded-md p-1 outline outline-1; +@layer components { + .outline-box { &:after { @apply absolute left-1/2 top-1/2 z-20 h-0 w-[1px] rounded-sm opacity-0 outline outline-2 outline-transparent transition-all duration-300 content-['']; } diff --git a/packages/@vben-core/uikit/layout-ui/package.json b/packages/@vben-core/uikit/layout-ui/package.json index 812114f9..a45c75a4 100644 --- a/packages/@vben-core/uikit/layout-ui/package.json +++ b/packages/@vben-core/uikit/layout-ui/package.json @@ -46,7 +46,7 @@ "@vben-core/shadcn-ui": "workspace:*", "@vben-core/toolkit": "workspace:*", "@vben-core/typings": "workspace:*", - "@vueuse/core": "^10.9.0", + "@vueuse/core": "^10.10.0", "vue": "3.4.27" } } diff --git a/packages/@vben-core/uikit/layout-ui/src/components/layout-header.vue b/packages/@vben-core/uikit/layout-ui/src/components/layout-header.vue index c46bb18c..6ff5e0cd 100644 --- a/packages/@vben-core/uikit/layout-ui/src/components/layout-header.vue +++ b/packages/@vben-core/uikit/layout-ui/src/components/layout-header.vue @@ -1,7 +1,6 @@ - - diff --git a/packages/@vben-core/uikit/layout-ui/src/components/layout-tabs.vue b/packages/@vben-core/uikit/layout-ui/src/components/layout-tabs.vue index d8e8e544..60d07127 100644 --- a/packages/@vben-core/uikit/layout-ui/src/components/layout-tabs.vue +++ b/packages/@vben-core/uikit/layout-ui/src/components/layout-tabs.vue @@ -1,6 +1,4 @@ - - diff --git a/packages/@vben-core/uikit/layout-ui/src/vben-layout.vue b/packages/@vben-core/uikit/layout-ui/src/vben-layout.vue index 6b6eb990..305d71d9 100644 --- a/packages/@vben-core/uikit/layout-ui/src/vben-layout.vue +++ b/packages/@vben-core/uikit/layout-ui/src/vben-layout.vue @@ -1,6 +1,4 @@ - - diff --git a/packages/@vben-core/uikit/menu-ui/package.json b/packages/@vben-core/uikit/menu-ui/package.json index a1a0be13..47fd9ccd 100644 --- a/packages/@vben-core/uikit/menu-ui/package.json +++ b/packages/@vben-core/uikit/menu-ui/package.json @@ -46,7 +46,7 @@ "@vben-core/shadcn-ui": "workspace:*", "@vben-core/toolkit": "workspace:*", "@vben-core/typings": "workspace:*", - "@vueuse/core": "^10.9.0", + "@vueuse/core": "^10.10.0", "vue": "3.4.27" } } diff --git a/packages/@vben-core/uikit/shadcn-ui/package.json b/packages/@vben-core/uikit/shadcn-ui/package.json index 99cd41ae..90944675 100644 --- a/packages/@vben-core/uikit/shadcn-ui/package.json +++ b/packages/@vben-core/uikit/shadcn-ui/package.json @@ -45,10 +45,10 @@ "@vben-core/iconify": "workspace:*", "@vben-core/toolkit": "workspace:*", "@vben-core/typings": "workspace:*", - "@vueuse/core": "^10.9.0", + "@vueuse/core": "^10.10.0", "class-variance-authority": "^0.7.0", "clsx": "2.1.1", - "radix-vue": "^1.8.1", + "radix-vue": "^1.8.2", "tailwind-merge": "^2.3.0", "vue": "3.4.27", "vue-sonner": "^1.1.2" diff --git a/packages/business/common-ui/package.json b/packages/business/common-ui/package.json index d8bbd7cc..3e5d5579 100644 --- a/packages/business/common-ui/package.json +++ b/packages/business/common-ui/package.json @@ -50,8 +50,8 @@ "@vben-core/toolkit": "workspace:*", "@vben/locales": "workspace:*", "@vben/preference": "workspace:*", - "@vueuse/core": "^10.9.0", - "@vueuse/integrations": "^10.9.0", + "@vueuse/core": "^10.10.0", + "@vueuse/integrations": "^10.10.0", "qrcode": "^1.5.3", "vue": "3.4.27", "vue-router": "^4.3.2" diff --git a/packages/business/common-ui/src/fallback/fallback.vue b/packages/business/common-ui/src/fallback/fallback.vue index 17f28019..444bf77f 100644 --- a/packages/business/common-ui/src/fallback/fallback.vue +++ b/packages/business/common-ui/src/fallback/fallback.vue @@ -59,7 +59,7 @@ function back() {