Update dependency tailwindcss to v4 #188
Loading…
x
Reference in New Issue
Block a user
No description provided.
Delete Branch "renovate/tailwindcss-4.x"
Deleting a branch is permanent. Although the deleted branch may continue to exist for a short time before it actually gets removed, it CANNOT be undone in most cases. Continue?
This PR contains the following updates:
3.4.17->4.1.13Release Notes
tailwindlabs/tailwindcss (tailwindcss)
v4.1.13Compare Source
Changed
Fixed
visibilitywhen usingtransition(#18795)matchVariantvalues (#18798)clipwithclip-pathinsr-only(#18769)matchUtilities(#18820).vercelfolders by default (can be overridden by@source …rules) (#18855)@-to be invalid (e.g.@-2xl:flex) (#18869)-or_(#18867, #18872)ariatheme keys to@custom-variant(#18815)datatheme keys to@custom-variant(#18816)supportstheme keys to@custom-variant(#18817)v4.1.12Compare Source
Fixed
@apply(#18404)flex-<number>utilities (#18642))from interfering with extraction in Clojure keywords (#18345)@pluginand@config(#18345)process.env.DEBUGin@tailwindcss/node(#18485)falseorundefinedproperties (#18571)@tailwindcss/postcssviatransformAssetUrls: false(#18321)addEventListenerand JavaScript variable names (#18718)--border-color-*theme keys individe-*utilities for backwards compatibility (#18704).hdrand.exrfiles for classes by default (#18734)v4.1.11Compare Source
Fixed
emit(…)(#18330)--watch=alwaysin the CLI's usage (#18337)@tailwindcss/vite(#18384)v4.1.10Compare Source
Fixed
w-[calc(100%-var(--offset))]) (#18289)v4.1.9Compare Source
Fixed
/[0.16]→/16) (#18184)mb-[-32rem]→-mb-128) (#18212)blurinwire:model.blur(#18216)v4.1.8Compare Source
Added
@applyfails (#18059)Fixed
<style>blocks (#18057, 18068)tailwindcssin pnpm monorepos (#18065)order-nonetoorder-0(#18126)class:attributes when extracting classes (#18093)-mt-[0px]tomt-[0px]instead of the other way around (#18154)\nat the end of the file (#18155).pnpm-storefolders by default (can be overridden by@source …rules) (#18163)toJSON()(#18083)v4.1.7Compare Source
Added
Fixed
_before numbers during candidate extraction (#17961)@themeand@utilitytogether (#17675)::beforeand::afterpseudo selectors create valid CSS rules in production builds (#17979)-rotate-*utilities properly negate arbitrary values (#18014):merge(…)selectors in legacy JS plugins (#18020).are properly extracted from Clojure files (#18038)@import … source(…)(#17963)class(#18025)v4.1.6Compare Source
Added
h-[1lh]toh-lh) (#17831, #17854)@sourcedirectives, discovered files and scanned files when usingDEBUG=*(#17906, #17952)Fixed
scalevalues generate negative values (#17831)@reference(#17836)_within arbitrary modifier shorthandbg-red-500/(--my_opacity)(#17889).logfiles for classes by default (#17906)@applyrules (#17925)optionalDependenciesare skipped (#17929)v4.1.5Compare Source
Added
@tailwindcss/upgradeto upgrade between versions of v4.* (#17717)h-lh/min-h-lh/max-h-lhutilities (#17790)display,visibility,content-visibility,overlay, andpointer-eventswhen usingtransitionto simplify@starting-styleusage (#17812)Fixed
.geojsonor.dbfiles for classes by default (#17700, #17711)_with.in theme suggestions for@utilityif surrounded by digits (#17733)color-mix(…)when opacity is100%(#17815)-to variants starting with@(#17814)Changed
.hg,.svn,.venv,venv,.yarn,.next,.turbo,.parcel-cache,__pycache__, and.svelte-kitfolders by default (can be overridden by@source …rules) (#17892)@sourcerules that point inside.hg,.svn,.venv,venv,.yarn,.next,.turbo,.parcel-cache,__pycache__, and.svelte-kitfolders no longer consider your.gitignorerules (#17892)v4.1.4Compare Source
Added
@tailwindcss/oxide-wasm32-wasitarget for running Tailwind in browser environments like StackBlitz (#17558)Fixed
color-mix(…)polyfills do not cause used CSS variables to be removed (#17555)color-mix(…)polyfills create fallbacks for theme variables that reference other theme variables (#17562){10..0..5}and{0..10..-5}(#17591)skew-*utilities (#17627)shadow-inherit,inset-shadow-inherit,drop-shadow-inherit, andtext-shadow-inheritinherit the shadow color (#17647)fontSizeJS theme keys (#17630)fontSizearray tuple syntax to CSS theme variables (#17630)v4.1.3Compare Source
Fixed
--value(…)(#17464)%wsyntax in Slim templates (#17557)v4.1.2Compare Source
Fixed
@layer baseto polyfill@property(#17506)drop-shadow-*utilities that are defined with multiple shadows (#17515)@tailwind utilitiesare processed (#17514)color-mix(…)polyfill creates fallbacks even when using colors that cannot be statically analyzed (#17513)@tailwindcss/viteand@tailwindcss/postscss(especially on Windows) (#17511)v4.1.1Compare Source
Changed
Fixed
visibilitywhen usingtransition(#18795)matchVariantvalues (#18798)clipwithclip-pathinsr-only(#18769)matchUtilities(#18820).vercelfolders by default (can be overridden by@source …rules) (#18855)@-to be invalid (e.g.@-2xl:flex) (#18869)-or_(#18867, #18872)ariatheme keys to@custom-variant(#18815)datatheme keys to@custom-variant(#18816)supportstheme keys to@custom-variant(#18817)v4.1.0Compare Source
Added
details-contentvariant (#15319)inverted-colorsvariant (#11693)noscriptvariant (#11929, #17431)items-baseline-lastandself-baseline-lastutilities (#13888, #17476)pointer-none,pointer-coarse, andpointer-finevariants (#16946)any-pointer-none,any-pointer-coarse, andany-pointer-finevariants (#16941)user-validanduser-invalidvariants (#12370)wrap-anywhere,wrap-break-word, andwrap-normalutilities (#12128)@source inline(…)and@source not inline(…)(#17147)@source not "…"(#17255)text-shadow-*utilities (#17389)mask-*utilities (#17134)bg-{position,size}-*utilities for arbitrary values (#17432)shadow-*/<alpha>,inset-shadow-*/<alpha>,drop-shadow-*/<alpha>, andtext-shadow-*/<alpha>utilities to control shadow opacity (#17398, #17434)drop-shadow-<color>utilities (#17434)Fixed
@sourcedirectives (#17391)@tailwindcss/cli(#17255)contentrules in legacy JavaScript configuration (#17255)@("@​")md:…as@md:…in Razor files (#17427)--theme(…)function still resolves to the CSS variables when using legacy JS plugins (#17458)Changed
node_modulesby default (can be overridden by@source …rules) (#17255)@sourcerules that include file extensions or point insidenode_modules/folders no longer consider your.gitignorerules (#17255)bg-{left,right}-{top,bottom}in favor ofbg-{top,bottom}-{left,right}utilities (#17378)object-{left,right}-{top,bottom}in favor ofobject-{top,bottom}-{left,right}utilities (#17437)v4.0.17Compare Source
Fixed
v4.0.16Compare Source
Added
--value('…')and--modifier('…')(#17304)Fixed
(in Pug (#17320)@keyframesfor theme animations are emitted if they are referenced following a comma (#17352)Slimtemplates embedded in Ruby files (#17336)--spacing(--value(integer, number))is used (#17308)::-webkit-details-markerpseudo tomarkervariant (#17362)v4.0.15Compare Source
Fixed
-bg-conic-*utilities (#17174)border-[12px_4px]being interpreted as aborder-colorinstead of aborder-width(#17248)<template lang="…">in Vue files (#17252)--value(…)or--modifier(…)calls don't delete subsequent declarations (#17273)(in Slim (#17278)PluginUtilsfromtailwindcss/pluginfor compatibility with v3 (#17299)line-height: initialfrom Preflight (#15212)Changed
--theme(…)function now returns CSS variables from your theme variables unless used inside positions where CSS variables are invalid (e.g. inside@mediaqueries) (#17036)v4.0.14Compare Source
Fixed
${(#17142).character (#17153)v4.0.13Compare Source
Fixed
.nodeand.wasmfiles are not scanned for utilities (#17123)v4.0.12Compare Source
Fixed
url(…)rebasing in transitively imported CSS files (#16965)url(…)s in imported CSS files (#16965)}and{are properly extracted (#17001)razor/cshtmlpre-processing (#17027)v4.0.11Compare Source
Fixed
--are extracted correctly (#16972)[are extracted in Slim templating language (#16985)v4.0.10Compare Source
Added
col-<number>androw-<number>utilities forgrid-columnandgrid-row(#15183)Fixed
not-*does not remove:is(…)from variants (#16825)@keyframesare correctly emitted when using a prefix (#16850)@utilitydeclarations when@applyis used in nested rules (#16940)outline-hiddenbehaves likeoutline-noneoutside of forced colors mode (#16943)!importanton CSS variables again (#16873).svgfile with#or?in the filename (#16957)Changed
max-w-autoandmax-h-autoutilities as they generate invalid CSS (#16917)v4.0.9Compare Source
Fixed
.css(#16780)@reference "…"would sometimes omit keyframe animations (#16774)z-*!utilities are properly marked as!important(#16795)Changed
@reference "…"instead of duplicate CSS variable declarations (#16774)v4.0.8Compare Source
Added
@importwiththeme(…)options for stylesheets that contain more than just@themerules (#16514)Fixed
!importantto CSS variable declarations when using the important modifier (#16668).gitignorefile when using automatic source detection(#16631)translate-z-pxutilities once in compiled CSS (#16718)Changed
v4.0.7Compare Source
Fixed
tailwindcss/lib/util/flattenColorPalette.jsfor backward compatibility (#16411)_in suggested theme keys (#16433)--default-outline-widthcan be used to change theoutline-widthvalue of theoutlineutility (#16469)tailwindcss/pluginfor backward compatibility (#16505)@tailwindcss/oxideWindows builds (#16602)tailwindcssin@tailwindcss/*packages (#16623)darkModeJS config setting with block syntax converts to use@slot(#16507)tailwindcssand@tailwindcss/postcssare installed when upgrading (#16620)v4.0.6Compare Source
Fixed
blurtoblur-smwhen used with Next.js<Image placeholder="blur" />(#16405)v4.0.5Compare Source
Added
@theme staticoption for always including theme variables in compiled CSS (#16211)Fixed
console.logfrom@tailwindcss/vite(#16307)Changed
v4.0.4Compare Source
Fixed
null(#16210)containersJS theme key is added to the--container-*namespace (#16169)@keyframesare generated even if an--animation-*variable spans multiple lines (#16237)?commonjs-proxyflag (#16238)order-firstandorder-lastfor Firefox (#16266)NODE_PATHis respected when resolving JavaScript and CSS files (#16274)@variantinside a referenced stylesheet could cause a stack overflow (#16300)v4.0.3Compare Source
Fixed
@import url();(#16144)v4.0.2Compare Source
Fixed
grid-cols-*andgrid-rows-*utilities (#16020)@referenceor@variant(#16057)<style>blocks in HTML files (#16069)@keyframesin@theme reference(#16120)@variantwhen at the top-level of a stylesheet (#16129)v4.0.1Compare Source
Fixed
v4.0.0Compare Source
Added
@property, andcolor-mix().color-scheme,field-sizing, complex shadows,inert, and more.Start using Tailwind CSS v4.0 today by installing it in a new project, or playing with it directly in the browser on Tailwind Play.
For existing projects, we've published a comprehensive upgrade guide and built an automated upgrade tool to get you on the latest version as quickly and painlessly as possible.
For a deep-dive into everything that's new, check out the announcement post.
Configuration
📅 Schedule: Branch creation - At any time (no schedule defined), Automerge - At any time (no schedule defined).
🚦 Automerge: Disabled by config. Please merge this manually once you are satisfied.
♻ Rebasing: Whenever PR is behind base branch, or you tick the rebase/retry checkbox.
🔕 Ignore: Close this PR and you won't be reminded about this update again.
This PR has been generated by Renovate Bot.
0438f3c40bto8efccd756a8efccd756atoc0fd48b89dc0fd48b89dto5c841460de5c841460deto6b1333fc316b1333fc31toc2cba31f7bc2cba31f7btoea843b99a4ea843b99a4toff0aaf4fbfff0aaf4fbftof4b135d877f4b135d877to4c0b627e394c0b627e39to3ddad2d6153ddad2d615to050806a47f050806a47ftoa06fa847f1a06fa847f1tocf8db640d3cf8db640d3to8d6f4bd1128d6f4bd112to3ea3de409f3ea3de409fto8ef16e1f078ef16e1f07to2078c0cd6d2078c0cd6dtoe7b1a6d1fde7b1a6d1fdtoce27df14c4ce27df14c4tob04524ca81b04524ca81tof608b4915df608b4915dtofd8a618c58fd8a618c58to072028bd2b072028bd2bto8570cd13158570cd1315tobc6be22f02bc6be22f02to1483fb6e9c1483fb6e9cto02a28ba3d102a28ba3d1to23c1b31d4323c1b31d43tocd3e4b8a0bcd3e4b8a0btoaffebc72bcaffebc72bcto2aec3fccaf2aec3fccaftof570fdd326f570fdd326to4786604d824786604d82tof05f07b692f05f07b692to9445d1df8e9445d1df8eto4c9d5d381e4c9d5d381etoe345a823e7e345a823e7to76362103637636210363to7967ce93777967ce9377to55d355dc5255d355dc52tod876c14798d876c14798to9f04c199f79f04c199f7to752938d0c0752938d0c0tob2f8d7dab4b2f8d7dab4tof2e06d31b3f2e06d31b3tof93d6279a8f93d6279a8to68f762ab2f68f762ab2fto92dece76cb92dece76cbtob545c3354db545c3354dto9865c7098f9865c7098fto9197da26b19197da26b1to02ee75253002ee752530tob65fb7131eb65fb7131eto68d27ea10a68d27ea10atoc68ace2558c68ace2558tocb53f075cccb53f075ccto4fdecc499c4fdecc499ctoc8f38c0843c8f38c0843to6e6aa368f86e6aa368f8to78732d6ff078732d6ff0to7dd9d8cf6e7dd9d8cf6etob7d2870b82b7d2870b82toc8ef1b11d1c8ef1b11d1to11743436171174343617to8e969142e78e969142e7to37f895915537f8959155toae82db9260ae82db9260to06d5830aea06d5830aeato3c1f3943e33c1f3943e3to193ebc8feb193ebc8febto0d3b6d2e510d3b6d2e51to0f2a7561960f2a756196todf1b91f061df1b91f061to0a64790b9a0a64790b9ato011771e02a011771e02ato92b51e1e6592b51e1e65to0a4811db540a4811db54to13f7a326e513f7a326e5to58cc78777d58cc78777dtoa161d30b28a161d30b28tob1e07eb275b1e07eb275to20579cf61220579cf612tocb60fe446ccb60fe446cto4f72ef1b4a4f72ef1b4atod0ae3b6f04d0ae3b6f04to2bee476d0d2bee476d0dto1de93a1fb21de93a1fb2to44545b7f9b44545b7f9btobc59febb0ebc59febb0eto2909d5960c2909d5960cto6015111fc86015111fc8tod1f32b496ed1f32b496eto0f464b88890f464b8889to12ae812edf12ae812edftofce088dfa8fce088dfa8to3c203b2d6d3c203b2d6dto31f3c7854731f3c78547to5e7c7c6c295e7c7c6c29to2c1f4aa8e42c1f4aa8e4to1e60d101231e60d10123tob2e7c84cbab2e7c84cbatoeb8cee2697eb8cee2697to8723fe80108723fe8010to5703244aff5703244affto1cd95c06631cd95c0663todd8f89099ddd8f89099dtocc66c4dc2acc66c4dc2ato461f74cac9461f74cac9tod38aa794f3d38aa794f3to169be1c4f7169be1c4f7tod1de2a8760d1de2a8760to8a83d4471b8a83d4471btod887e0b376d887e0b376to6f80d3d63c6f80d3d63cto060d36fb08060d36fb08toa1fdcae26fa1fdcae26fto41f7c13b2a41f7c13b2ato65b683b82aCheckout
From your project repository, check out a new branch and test the changes.