Skip to content

Commit e1e66e3

Browse files
adamwathanadamwathan
authored
Add isolation utilities (#3914)
1 parent b1aac51 commit e1e66e3

12 files changed

+219
-0
lines changed

‎__tests__/fixtures/tailwind-output-flagged.css

+48
Original file line numberDiff line numberDiff line change
@@ -25218,6 +25218,14 @@ video {
2521825218
z-index: auto;
2521925219
}
2522025220

25221+
.isolate {
25222+
isolation: isolate;
25223+
}
25224+
25225+
.isolation-auto {
25226+
isolation: auto;
25227+
}
25228+
2522125229
.gap-0 {
2522225230
gap: 0px;
2522325231
}
@@ -53809,6 +53817,14 @@ video {
5380953817
z-index: auto;
5381053818
}
5381153819

53820+
.sm\:isolate {
53821+
isolation: isolate;
53822+
}
53823+
53824+
.sm\:isolation-auto {
53825+
isolation: auto;
53826+
}
53827+
5381253828
.sm\:gap-0 {
5381353829
gap: 0px;
5381453830
}
@@ -82370,6 +82386,14 @@ video {
8237082386
z-index: auto;
8237182387
}
8237282388

82389+
.md\:isolate {
82390+
isolation: isolate;
82391+
}
82392+
82393+
.md\:isolation-auto {
82394+
isolation: auto;
82395+
}
82396+
8237382397
.md\:gap-0 {
8237482398
gap: 0px;
8237582399
}
@@ -110931,6 +110955,14 @@ video {
110931110955
z-index: auto;
110932110956
}
110933110957

110958+
.lg\:isolate {
110959+
isolation: isolate;
110960+
}
110961+
110962+
.lg\:isolation-auto {
110963+
isolation: auto;
110964+
}
110965+
110934110966
.lg\:gap-0 {
110935110967
gap: 0px;
110936110968
}
@@ -139492,6 +139524,14 @@ video {
139492139524
z-index: auto;
139493139525
}
139494139526

139527+
.xl\:isolate {
139528+
isolation: isolate;
139529+
}
139530+
139531+
.xl\:isolation-auto {
139532+
isolation: auto;
139533+
}
139534+
139495139535
.xl\:gap-0 {
139496139536
gap: 0px;
139497139537
}
@@ -168053,6 +168093,14 @@ video {
168053168093
z-index: auto;
168054168094
}
168055168095

168096+
.\32xl\:isolate {
168097+
isolation: isolate;
168098+
}
168099+
168100+
.\32xl\:isolation-auto {
168101+
isolation: auto;
168102+
}
168103+
168056168104
.\32xl\:gap-0 {
168057168105
gap: 0px;
168058168106
}

‎__tests__/fixtures/tailwind-output-important.css

+48
Original file line numberDiff line numberDiff line change
@@ -25218,6 +25218,14 @@ video {
2521825218
z-index: auto !important;
2521925219
}
2522025220

25221+
.isolate {
25222+
isolation: isolate !important;
25223+
}
25224+
25225+
.isolation-auto {
25226+
isolation: auto !important;
25227+
}
25228+
2522125229
.gap-0 {
2522225230
gap: 0px !important;
2522325231
}
@@ -53809,6 +53817,14 @@ video {
5380953817
z-index: auto !important;
5381053818
}
5381153819

53820+
.sm\:isolate {
53821+
isolation: isolate !important;
53822+
}
53823+
53824+
.sm\:isolation-auto {
53825+
isolation: auto !important;
53826+
}
53827+
5381253828
.sm\:gap-0 {
5381353829
gap: 0px !important;
5381453830
}
@@ -82370,6 +82386,14 @@ video {
8237082386
z-index: auto !important;
8237182387
}
8237282388

82389+
.md\:isolate {
82390+
isolation: isolate !important;
82391+
}
82392+
82393+
.md\:isolation-auto {
82394+
isolation: auto !important;
82395+
}
82396+
8237382397
.md\:gap-0 {
8237482398
gap: 0px !important;
8237582399
}
@@ -110931,6 +110955,14 @@ video {
110931110955
z-index: auto !important;
110932110956
}
110933110957

110958+
.lg\:isolate {
110959+
isolation: isolate !important;
110960+
}
110961+
110962+
.lg\:isolation-auto {
110963+
isolation: auto !important;
110964+
}
110965+
110934110966
.lg\:gap-0 {
110935110967
gap: 0px !important;
110936110968
}
@@ -139492,6 +139524,14 @@ video {
139492139524
z-index: auto !important;
139493139525
}
139494139526

139527+
.xl\:isolate {
139528+
isolation: isolate !important;
139529+
}
139530+
139531+
.xl\:isolation-auto {
139532+
isolation: auto !important;
139533+
}
139534+
139495139535
.xl\:gap-0 {
139496139536
gap: 0px !important;
139497139537
}
@@ -168053,6 +168093,14 @@ video {
168053168093
z-index: auto !important;
168054168094
}
168055168095

168096+
.\32xl\:isolate {
168097+
isolation: isolate !important;
168098+
}
168099+
168100+
.\32xl\:isolation-auto {
168101+
isolation: auto !important;
168102+
}
168103+
168056168104
.\32xl\:gap-0 {
168057168105
gap: 0px !important;
168058168106
}

‎__tests__/fixtures/tailwind-output-no-color-opacity.css

+48
Original file line numberDiff line numberDiff line change
@@ -22662,6 +22662,14 @@ video {
2266222662
z-index: auto;
2266322663
}
2266422664

22665+
.isolate {
22666+
isolation: isolate;
22667+
}
22668+
22669+
.isolation-auto {
22670+
isolation: auto;
22671+
}
22672+
2266522673
.gap-0 {
2266622674
gap: 0px;
2266722675
}
@@ -48697,6 +48705,14 @@ video {
4869748705
z-index: auto;
4869848706
}
4869948707

48708+
.sm\:isolate {
48709+
isolation: isolate;
48710+
}
48711+
48712+
.sm\:isolation-auto {
48713+
isolation: auto;
48714+
}
48715+
4870048716
.sm\:gap-0 {
4870148717
gap: 0px;
4870248718
}
@@ -74702,6 +74718,14 @@ video {
7470274718
z-index: auto;
7470374719
}
7470474720

74721+
.md\:isolate {
74722+
isolation: isolate;
74723+
}
74724+
74725+
.md\:isolation-auto {
74726+
isolation: auto;
74727+
}
74728+
7470574729
.md\:gap-0 {
7470674730
gap: 0px;
7470774731
}
@@ -100707,6 +100731,14 @@ video {
100707100731
z-index: auto;
100708100732
}
100709100733

100734+
.lg\:isolate {
100735+
isolation: isolate;
100736+
}
100737+
100738+
.lg\:isolation-auto {
100739+
isolation: auto;
100740+
}
100741+
100710100742
.lg\:gap-0 {
100711100743
gap: 0px;
100712100744
}
@@ -126712,6 +126744,14 @@ video {
126712126744
z-index: auto;
126713126745
}
126714126746

126747+
.xl\:isolate {
126748+
isolation: isolate;
126749+
}
126750+
126751+
.xl\:isolation-auto {
126752+
isolation: auto;
126753+
}
126754+
126715126755
.xl\:gap-0 {
126716126756
gap: 0px;
126717126757
}
@@ -152717,6 +152757,14 @@ video {
152717152757
z-index: auto;
152718152758
}
152719152759

152760+
.\32xl\:isolate {
152761+
isolation: isolate;
152762+
}
152763+
152764+
.\32xl\:isolation-auto {
152765+
isolation: auto;
152766+
}
152767+
152720152768
.\32xl\:gap-0 {
152721152769
gap: 0px;
152722152770
}

‎__tests__/fixtures/tailwind-output.css

+48
Original file line numberDiff line numberDiff line change
@@ -25218,6 +25218,14 @@ video {
2521825218
z-index: auto;
2521925219
}
2522025220

25221+
.isolate {
25222+
isolation: isolate;
25223+
}
25224+
25225+
.isolation-auto {
25226+
isolation: auto;
25227+
}
25228+
2522125229
.gap-0 {
2522225230
gap: 0px;
2522325231
}
@@ -53809,6 +53817,14 @@ video {
5380953817
z-index: auto;
5381053818
}
5381153819

53820+
.sm\:isolate {
53821+
isolation: isolate;
53822+
}
53823+
53824+
.sm\:isolation-auto {
53825+
isolation: auto;
53826+
}
53827+
5381253828
.sm\:gap-0 {
5381353829
gap: 0px;
5381453830
}
@@ -82370,6 +82386,14 @@ video {
8237082386
z-index: auto;
8237182387
}
8237282388

82389+
.md\:isolate {
82390+
isolation: isolate;
82391+
}
82392+
82393+
.md\:isolation-auto {
82394+
isolation: auto;
82395+
}
82396+
8237382397
.md\:gap-0 {
8237482398
gap: 0px;
8237582399
}
@@ -110931,6 +110955,14 @@ video {
110931110955
z-index: auto;
110932110956
}
110933110957

110958+
.lg\:isolate {
110959+
isolation: isolate;
110960+
}
110961+
110962+
.lg\:isolation-auto {
110963+
isolation: auto;
110964+
}
110965+
110934110966
.lg\:gap-0 {
110935110967
gap: 0px;
110936110968
}
@@ -139492,6 +139524,14 @@ video {
139492139524
z-index: auto;
139493139525
}
139494139526

139527+
.xl\:isolate {
139528+
isolation: isolate;
139529+
}
139530+
139531+
.xl\:isolation-auto {
139532+
isolation: auto;
139533+
}
139534+
139495139535
.xl\:gap-0 {
139496139536
gap: 0px;
139497139537
}
@@ -168053,6 +168093,14 @@ video {
168053168093
z-index: auto;
168054168094
}
168055168095

168096+
.\32xl\:isolate {
168097+
isolation: isolate;
168098+
}
168099+
168100+
.\32xl\:isolation-auto {
168101+
isolation: auto;
168102+
}
168103+
168056168104
.\32xl\:gap-0 {
168057168105
gap: 0px;
168058168106
}

‎jit/corePlugins/index.js

+1
Original file line numberDiff line numberDiff line change
@@ -165,6 +165,7 @@ module.exports = {
165165
visibility: require('./visibility'),
166166
position: require('./position'),
167167
inset: require('./inset'),
168+
isolation: require('./isolation'),
168169
zIndex: require('./zIndex'),
169170
order: require('./order'),
170171
gridColumn: require('./gridColumn'),

‎jit/corePlugins/isolation.js

+1
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
module.exports = require('../../lib/plugins/isolation').default()

‎jit/tests/basic-usage.test.css

+6
Original file line numberDiff line numberDiff line change
@@ -81,6 +81,12 @@
8181
.left-16 {
8282
left: 4rem;
8383
}
84+
.isolate {
85+
isolation: isolate;
86+
}
87+
.isolation-auto {
88+
isolation: auto;
89+
}
8490
.z-30 {
8591
z-index: 30;
8692
}

‎jit/tests/basic-usage.test.html

+1
Original file line numberDiff line numberDiff line change
@@ -72,6 +72,7 @@
7272
<div class="grid-rows-3"></div>
7373
<div class="h-16"></div>
7474
<div class="inset-0 inset-y-4 inset-x-2 top-6 right-8 bottom-12 left-16"></div>
75+
<div class="isolate isolation-auto"></div>
7576
<div class="justify-center"></div>
7677
<div class="justify-items-end"></div>
7778
<div class="justify-self-start"></div>

‎src/corePluginList.js

+1
Original file line numberDiff line numberDiff line change
@@ -96,6 +96,7 @@ export const corePluginList = [
9696
'wordBreak',
9797
'width',
9898
'zIndex',
99+
'isolation',
99100
'gap',
100101
'gridAutoFlow',
101102
'gridTemplateColumns',

0 commit comments

Comments
 (0)