This repository has been archived by the owner on Apr 29, 2020. It is now read-only.
Releases: benface/tailwindcss-transitions
Releases · benface/tailwindcss-transitions
v2.2.0
Added
- Added a
default
transition property, which generates a simpletransition
class and includes all the properties fromcolors
as well asopacity
,box-shadow
, andtransform
(taken from Tailwind 1.2) - Added a
shadow
transition property (taken from Tailwind 1.2) - Added
50
,75
,150
,200
,300
, and400
transition durations
Changed
- The
transition-colors
utility now includes thefill
andstroke
properties, in addition tobackground-color
,border-color
, andcolor
(taken from Tailwind 1.2)
v2.1.0
Changed since 2.1.0-beta.2
- Allowed for durations and delays to be defined as numbers but be output as
ms
Changed since 2.0.x
- Changed the implementation of the
default
duration, timing function, and delay to prevent generating base styles that change the value oftransition-property
,transition-duration
,transition-timing-function
, andtransition-delay
on all elements, in order to prevent conflicts with libraries that don’t expect these properties to differ from their CSS-defined default - Base styles targeting all elements are still generated if a
default
duration, timing function, and/or delay is set (which is the case by default: thedefault
duration is250ms
), but they define custom properties that are very unlikely to conflict with third-party libraries (e.g.--transition-duration
); these are then used to set actual properties on elements that have atransition-[property]
ortransition-[duration]
class - As a result, it is now possible to only use a transition duration utility (e.g.
transition-500
) on an element to make it transition all its properties; no need fortransition-all
anymore, since the default value oftransition-property
is alreadyall
v2.1.0-beta.2
Release 2.1.0-beta.1
was deprecated and reverted, so the following changes were made from release 2.0.1
:
Changed
- Changed the implementation of the
default
duration, timing function, and delay to prevent generating base styles that change the value oftransition-property
,transition-duration
,transition-timing-function
, andtransition-delay
on all elements, in order to prevent conflicts with libraries that don’t expect these properties to differ from their CSS-defined default - Base styles targeting all elements are still generated if a
default
duration, timing function, and/or delay is set (which is the case by default: thedefault
duration is250ms
), but they define custom properties that are very unlikely to conflict with third-party libraries (e.g.--transition-duration
); these are then used to set actual properties on elements that have atransition-[property]
ortransition-[duration]
class - As a result, it is now possible to only use a transition duration utility (e.g.
transition-500
) on an element to make it transition all its properties; no need fortransition-all
anymore, since the default value oftransition-property
is alreadyall
v2.1.0-beta.1 [DEPRECATED]
Decided to go in another direction for v2.1, and reverted most of the changes in this release.
Added
- Added the ability to set a
default
transition property, which is set toauto
by default, meaning that it depends on thedefault
transition duration: if it’s0s
or0ms
thenauto
resolves toall
, otherwise it resolves tonone
Changed
- Changed the
default
transition duration from250ms
to0ms
- As a result of the above, base styles targeting all elements are no longer generated by default since the default property and duration are now the same as the CSS defaults (
all
and0s
, respectively) - Therefore, with the new defaults you only need a transition duration utility (e.g.
transition-fast
) on an element to make it transition all its properties (no need fortransition-all
); if you want the previous behaviour, simply set thedefault
transition duration to a non-zero value - Changed the default transition durations from a numeric scale (
250
,500
,750
, etc.) to a descriptive scale (slow
,medium
,fast
, etc.) - Changed the default transition delays to match the new duration values, but with a numeric scale (
0
,200
,400
,600
,800
, and1000
)
v2.0.1
v2.0.0
Changed since 2.0.0-beta.2
- Added support for global variants thanks to Tailwind’s
variants()
helper function
Added since 1.x
- Tailwind 1.0.0 compatibility
Changed since 1.x
- The plugin doesn’t accept a config object anymore; instead it finds what it needs in the
theme
andvariants
keys of your config (seeREADME
for more info) - Multiple utilities as well as responsive variants are now generated by default (see
README
for more info) - Shorter class names for transition durations (
transition-duration-500
is nowtransition-500
) and timing functions (transition-timing-ease
is nowtransition-ease
) - Transition utilities now set
transition-property
instead of thetransition
shorthand; as a result, responsive transition utilities don’t reset the duration, timing function or delay anymore - For the above to work, the plugin now sets some base styles on all elements (changes
transition-property
's default value ofall
tonone
, and sets the default duration, timing function, and delay defined in the theme)
v2.0.0-beta.2
Removed
- Removed
transitionProperty
andwillChange
’sdefault
key feature introduced in beta 1; it is confusing because the behaviour is different from the otherdefault
keys in this plugin, but also because it’s not clear what the classes do... it’s better to be explicit (e.g.transition-all
andwill-change-contents
)
v2.0.0-beta.1
Added
- Tailwind 1.0.0 compatibility
transitionProperty
andwillChange
now accept adefault
key that generates a simpletransition
/will-change
class
Changed
- The plugin doesn’t accept a config object anymore; instead it finds what it needs in the
theme
andvariants
keys of your config (seeREADME
for more info) - Multiple utilities as well as responsive variants are now generated by default (see
README
for more info) - Shorter class names for transition durations (
transition-duration-500
is nowtransition-500
) and timing functions (transition-timing-ease
is nowtransition-ease
) - Transition utilities now set
transition-property
instead of thetransition
shorthand; as a result, responsive transition utilities don’t reset the duration, timing function or delay anymore - For the above to work, the plugin now sets some base styles on all elements (changes
transition-property
's default value ofall
tonone
, and sets the default duration, timing function, and delay defined in the theme)