From 56675a634dcaba8c02e1370bcf8ce5a02bfab979 Mon Sep 17 00:00:00 2001 From: qwq Date: Wed, 10 Apr 2024 09:57:49 +0800 Subject: [PATCH 1/4] fix: remove conflicting transition utilities see: https://tailwindcss.com/docs/transition-property --- packages/core/theme/src/plugin.ts | 2 + .../core/theme/src/utilities/transition.ts | 66 +++++++++---------- 2 files changed, 35 insertions(+), 33 deletions(-) diff --git a/packages/core/theme/src/plugin.ts b/packages/core/theme/src/plugin.ts index e726f27998..08e8ebaee2 100644 --- a/packages/core/theme/src/plugin.ts +++ b/packages/core/theme/src/plugin.ts @@ -20,6 +20,7 @@ import {createSpacingUnits, generateSpacingScale, isBaseTheme} from "./utils/the import {ConfigTheme, ConfigThemes, DefaultThemeType, NextUIPluginConfig} from "./types"; import {lightLayout, darkLayout, defaultLayout} from "./default-layout"; import {baseStyles} from "./utils/classes"; +import {DEFAULT_TRANSITION_DURATION} from "./utilities/transition"; const DEFAULT_PREFIX = "nextui"; @@ -264,6 +265,7 @@ const corePlugin = ( 0: "0ms", 250: "250ms", 400: "400ms", + DEFAULT: DEFAULT_TRANSITION_DURATION, }, transitionTimingFunction: { "soft-spring": "cubic-bezier(0.155, 1.105, 0.295, 1.12)", diff --git a/packages/core/theme/src/utilities/transition.ts b/packages/core/theme/src/utilities/transition.ts index d11468ff93..ecfc055ce8 100644 --- a/packages/core/theme/src/utilities/transition.ts +++ b/packages/core/theme/src/utilities/transition.ts @@ -1,36 +1,36 @@ -const DEFAULT_TRANSITION_DURATION = "250ms"; +export const DEFAULT_TRANSITION_DURATION = "250ms"; export default { /** * Transition utilities */ - ".transition-all": { - "transition-property": "all", - "transition-timing-function": "ease", - "transition-duration": DEFAULT_TRANSITION_DURATION, - }, + // ".transition-all": { + // "transition-property": "all", + // "transition-timing-function": "ease", + // "transition-duration": DEFAULT_TRANSITION_DURATION, + // }, ".transition-background": { "transition-property": "background", "transition-timing-function": "ease", "transition-duration": DEFAULT_TRANSITION_DURATION, }, - ".transition": { - "transition-property": - "color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter", - "transition-timing-function": "ease", - "transition-duration": DEFAULT_TRANSITION_DURATION, - }, - ".transition-colors": { - "transition-property": - "color, background-color, border-color, text-decoration-color, fill, stroke", - "transition-timing-function": "ease", - "transition-duration": DEFAULT_TRANSITION_DURATION, - }, - ".transition-opacity": { - "transition-property": "opacity", - "transition-timing-function": "ease", - "transition-duration": DEFAULT_TRANSITION_DURATION, - }, + // ".transition": { + // "transition-property": + // "color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter", + // "transition-timing-function": "ease", + // "transition-duration": DEFAULT_TRANSITION_DURATION, + // }, + // ".transition-colors": { + // "transition-property": + // "color, background-color, border-color, text-decoration-color, fill, stroke", + // "transition-timing-function": "ease", + // "transition-duration": DEFAULT_TRANSITION_DURATION, + // }, + // ".transition-opacity": { + // "transition-property": "opacity", + // "transition-timing-function": "ease", + // "transition-duration": DEFAULT_TRANSITION_DURATION, + // }, ".transition-colors-opacity": { "transition-property": "color, background-color, border-color, text-decoration-color, fill, stroke, opacity", @@ -57,16 +57,16 @@ export default { "transition-timing-function": "ease", "transition-duration": DEFAULT_TRANSITION_DURATION, }, - ".transition-shadow": { - "transition-property": "box-shadow", - "transition-timing-function": "ease", - "transition-duration": DEFAULT_TRANSITION_DURATION, - }, - ".transition-transform": { - "transition-property": "transform", - "transition-timing-function": "ease", - "transition-duration": DEFAULT_TRANSITION_DURATION, - }, + // ".transition-shadow": { + // "transition-property": "box-shadow", + // "transition-timing-function": "ease", + // "transition-duration": DEFAULT_TRANSITION_DURATION, + // }, + // ".transition-transform": { + // "transition-property": "transform", + // "transition-timing-function": "ease", + // "transition-duration": DEFAULT_TRANSITION_DURATION, + // }, ".transition-transform-opacity": { "transition-property": "transform, opacity", "transition-timing-function": "ease", From f847f12224920f311cf3f3d5fd5ae7fb86be29bb Mon Sep 17 00:00:00 2001 From: qwq Date: Wed, 10 Apr 2024 10:04:23 +0800 Subject: [PATCH 2/4] chore: add changeset --- .changeset/rare-ants-ring.md | 7 +++++++ 1 file changed, 7 insertions(+) create mode 100644 .changeset/rare-ants-ring.md diff --git a/.changeset/rare-ants-ring.md b/.changeset/rare-ants-ring.md new file mode 100644 index 0000000000..1baa18bfa4 --- /dev/null +++ b/.changeset/rare-ants-ring.md @@ -0,0 +1,7 @@ +--- +"@nextui-org/theme": patch +--- + +fix: remove conflicting transition utilities (close #1502) + +see: https://tailwindcss.com/docs/transition-property \ No newline at end of file From b52abc94fe2ca2f55e57538aa93614d76f9ab822 Mon Sep 17 00:00:00 2001 From: qwq Date: Wed, 10 Apr 2024 10:21:38 +0800 Subject: [PATCH 3/4] fix: typo --- .changeset/rare-ants-ring.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/.changeset/rare-ants-ring.md b/.changeset/rare-ants-ring.md index 1baa18bfa4..9ecb63146c 100644 --- a/.changeset/rare-ants-ring.md +++ b/.changeset/rare-ants-ring.md @@ -2,6 +2,6 @@ "@nextui-org/theme": patch --- -fix: remove conflicting transition utilities (close #1502) +Fix: remove conflicting transition utilities (close #1502) -see: https://tailwindcss.com/docs/transition-property \ No newline at end of file +See: https://tailwindcss.com/docs/transition-property \ No newline at end of file From 42a1946c81c415ec3e70c35ebe0b5a9153d7e752 Mon Sep 17 00:00:00 2001 From: qwq Date: Wed, 10 Apr 2024 10:43:05 +0800 Subject: [PATCH 4/4] chore: remove comments --- .../core/theme/src/utilities/transition.ts | 32 ------------------- 1 file changed, 32 deletions(-) diff --git a/packages/core/theme/src/utilities/transition.ts b/packages/core/theme/src/utilities/transition.ts index ecfc055ce8..f5049f95fe 100644 --- a/packages/core/theme/src/utilities/transition.ts +++ b/packages/core/theme/src/utilities/transition.ts @@ -4,33 +4,11 @@ export default { /** * Transition utilities */ - // ".transition-all": { - // "transition-property": "all", - // "transition-timing-function": "ease", - // "transition-duration": DEFAULT_TRANSITION_DURATION, - // }, ".transition-background": { "transition-property": "background", "transition-timing-function": "ease", "transition-duration": DEFAULT_TRANSITION_DURATION, }, - // ".transition": { - // "transition-property": - // "color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter", - // "transition-timing-function": "ease", - // "transition-duration": DEFAULT_TRANSITION_DURATION, - // }, - // ".transition-colors": { - // "transition-property": - // "color, background-color, border-color, text-decoration-color, fill, stroke", - // "transition-timing-function": "ease", - // "transition-duration": DEFAULT_TRANSITION_DURATION, - // }, - // ".transition-opacity": { - // "transition-property": "opacity", - // "transition-timing-function": "ease", - // "transition-duration": DEFAULT_TRANSITION_DURATION, - // }, ".transition-colors-opacity": { "transition-property": "color, background-color, border-color, text-decoration-color, fill, stroke, opacity", @@ -57,16 +35,6 @@ export default { "transition-timing-function": "ease", "transition-duration": DEFAULT_TRANSITION_DURATION, }, - // ".transition-shadow": { - // "transition-property": "box-shadow", - // "transition-timing-function": "ease", - // "transition-duration": DEFAULT_TRANSITION_DURATION, - // }, - // ".transition-transform": { - // "transition-property": "transform", - // "transition-timing-function": "ease", - // "transition-duration": DEFAULT_TRANSITION_DURATION, - // }, ".transition-transform-opacity": { "transition-property": "transform, opacity", "transition-timing-function": "ease",