Skip to content

Commit 8df2cd5

Browse files
adamwathanadamwathan
committed
Merge branch 'stack-divide-utilities'
2 parents 1743c23 + a14ea02 commit 8df2cd5

File tree

4 files changed

+56
-56
lines changed

4 files changed

+56
-56
lines changed

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

Lines changed: 20 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -844,62 +844,62 @@ video {
844844

845845
.divide-y-0 > :not(template) ~ :not(template) {
846846
--divide-y-reverse: 0 !important;
847-
border-top: calc(0 * calc(1 - var(--divide-y-reverse))) !important;
848-
border-bottom: calc(0 * var(--divide-y-reverse)) !important;
847+
border-top-width: calc(0 * calc(1 - var(--divide-y-reverse))) !important;
848+
border-bottom-width: calc(0 * var(--divide-y-reverse)) !important;
849849
}
850850

851851
.divide-x-0 > :not(template) ~ :not(template) {
852852
--divide-x-reverse: 0 !important;
853-
border-right: calc(0 * var(--divide-y-reverse)) !important;
854-
border-left: calc(0 * calc(1 - var(--divide-y-reverse))) !important;
853+
border-right-width: calc(0 * var(--divide-y-reverse)) !important;
854+
border-left-width: calc(0 * calc(1 - var(--divide-y-reverse))) !important;
855855
}
856856

857857
.divide-y-2 > :not(template) ~ :not(template) {
858858
--divide-y-reverse: 0 !important;
859-
border-top: calc(2px * calc(1 - var(--divide-y-reverse))) !important;
860-
border-bottom: calc(2px * var(--divide-y-reverse)) !important;
859+
border-top-width: calc(2px * calc(1 - var(--divide-y-reverse))) !important;
860+
border-bottom-width: calc(2px * var(--divide-y-reverse)) !important;
861861
}
862862

863863
.divide-x-2 > :not(template) ~ :not(template) {
864864
--divide-x-reverse: 0 !important;
865-
border-right: calc(2px * var(--divide-y-reverse)) !important;
866-
border-left: calc(2px * calc(1 - var(--divide-y-reverse))) !important;
865+
border-right-width: calc(2px * var(--divide-y-reverse)) !important;
866+
border-left-width: calc(2px * calc(1 - var(--divide-y-reverse))) !important;
867867
}
868868

869869
.divide-y-4 > :not(template) ~ :not(template) {
870870
--divide-y-reverse: 0 !important;
871-
border-top: calc(4px * calc(1 - var(--divide-y-reverse))) !important;
872-
border-bottom: calc(4px * var(--divide-y-reverse)) !important;
871+
border-top-width: calc(4px * calc(1 - var(--divide-y-reverse))) !important;
872+
border-bottom-width: calc(4px * var(--divide-y-reverse)) !important;
873873
}
874874

875875
.divide-x-4 > :not(template) ~ :not(template) {
876876
--divide-x-reverse: 0 !important;
877-
border-right: calc(4px * var(--divide-y-reverse)) !important;
878-
border-left: calc(4px * calc(1 - var(--divide-y-reverse))) !important;
877+
border-right-width: calc(4px * var(--divide-y-reverse)) !important;
878+
border-left-width: calc(4px * calc(1 - var(--divide-y-reverse))) !important;
879879
}
880880

881881
.divide-y-8 > :not(template) ~ :not(template) {
882882
--divide-y-reverse: 0 !important;
883-
border-top: calc(8px * calc(1 - var(--divide-y-reverse))) !important;
884-
border-bottom: calc(8px * var(--divide-y-reverse)) !important;
883+
border-top-width: calc(8px * calc(1 - var(--divide-y-reverse))) !important;
884+
border-bottom-width: calc(8px * var(--divide-y-reverse)) !important;
885885
}
886886

887887
.divide-x-8 > :not(template) ~ :not(template) {
888888
--divide-x-reverse: 0 !important;
889-
border-right: calc(8px * var(--divide-y-reverse)) !important;
890-
border-left: calc(8px * calc(1 - var(--divide-y-reverse))) !important;
889+
border-right-width: calc(8px * var(--divide-y-reverse)) !important;
890+
border-left-width: calc(8px * calc(1 - var(--divide-y-reverse))) !important;
891891
}
892892

893893
.divide-y > :not(template) ~ :not(template) {
894894
--divide-y-reverse: 0 !important;
895-
border-top: calc(1px * calc(1 - var(--divide-y-reverse))) !important;
896-
border-bottom: calc(1px * var(--divide-y-reverse)) !important;
895+
border-top-width: calc(1px * calc(1 - var(--divide-y-reverse))) !important;
896+
border-bottom-width: calc(1px * var(--divide-y-reverse)) !important;
897897
}
898898

899899
.divide-x > :not(template) ~ :not(template) {
900900
--divide-x-reverse: 0 !important;
901-
border-right: calc(1px * var(--divide-y-reverse)) !important;
902-
border-left: calc(1px * calc(1 - var(--divide-y-reverse))) !important;
901+
border-right-width: calc(1px * var(--divide-y-reverse)) !important;
902+
border-left-width: calc(1px * calc(1 - var(--divide-y-reverse))) !important;
903903
}
904904

905905
.divide-y-reverse > :not(template) ~ :not(template) {

‎__tests__/fixtures/tailwind-output.css

Lines changed: 20 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -844,62 +844,62 @@ video {
844844

845845
.divide-y-0 > :not(template) ~ :not(template) {
846846
--divide-y-reverse: 0;
847-
border-top: calc(0 * calc(1 - var(--divide-y-reverse)));
848-
border-bottom: calc(0 * var(--divide-y-reverse));
847+
border-top-width: calc(0 * calc(1 - var(--divide-y-reverse)));
848+
border-bottom-width: calc(0 * var(--divide-y-reverse));
849849
}
850850

851851
.divide-x-0 > :not(template) ~ :not(template) {
852852
--divide-x-reverse: 0;
853-
border-right: calc(0 * var(--divide-y-reverse));
854-
border-left: calc(0 * calc(1 - var(--divide-y-reverse)));
853+
border-right-width: calc(0 * var(--divide-y-reverse));
854+
border-left-width: calc(0 * calc(1 - var(--divide-y-reverse)));
855855
}
856856

857857
.divide-y-2 > :not(template) ~ :not(template) {
858858
--divide-y-reverse: 0;
859-
border-top: calc(2px * calc(1 - var(--divide-y-reverse)));
860-
border-bottom: calc(2px * var(--divide-y-reverse));
859+
border-top-width: calc(2px * calc(1 - var(--divide-y-reverse)));
860+
border-bottom-width: calc(2px * var(--divide-y-reverse));
861861
}
862862

863863
.divide-x-2 > :not(template) ~ :not(template) {
864864
--divide-x-reverse: 0;
865-
border-right: calc(2px * var(--divide-y-reverse));
866-
border-left: calc(2px * calc(1 - var(--divide-y-reverse)));
865+
border-right-width: calc(2px * var(--divide-y-reverse));
866+
border-left-width: calc(2px * calc(1 - var(--divide-y-reverse)));
867867
}
868868

869869
.divide-y-4 > :not(template) ~ :not(template) {
870870
--divide-y-reverse: 0;
871-
border-top: calc(4px * calc(1 - var(--divide-y-reverse)));
872-
border-bottom: calc(4px * var(--divide-y-reverse));
871+
border-top-width: calc(4px * calc(1 - var(--divide-y-reverse)));
872+
border-bottom-width: calc(4px * var(--divide-y-reverse));
873873
}
874874

875875
.divide-x-4 > :not(template) ~ :not(template) {
876876
--divide-x-reverse: 0;
877-
border-right: calc(4px * var(--divide-y-reverse));
878-
border-left: calc(4px * calc(1 - var(--divide-y-reverse)));
877+
border-right-width: calc(4px * var(--divide-y-reverse));
878+
border-left-width: calc(4px * calc(1 - var(--divide-y-reverse)));
879879
}
880880

881881
.divide-y-8 > :not(template) ~ :not(template) {
882882
--divide-y-reverse: 0;
883-
border-top: calc(8px * calc(1 - var(--divide-y-reverse)));
884-
border-bottom: calc(8px * var(--divide-y-reverse));
883+
border-top-width: calc(8px * calc(1 - var(--divide-y-reverse)));
884+
border-bottom-width: calc(8px * var(--divide-y-reverse));
885885
}
886886

887887
.divide-x-8 > :not(template) ~ :not(template) {
888888
--divide-x-reverse: 0;
889-
border-right: calc(8px * var(--divide-y-reverse));
890-
border-left: calc(8px * calc(1 - var(--divide-y-reverse)));
889+
border-right-width: calc(8px * var(--divide-y-reverse));
890+
border-left-width: calc(8px * calc(1 - var(--divide-y-reverse)));
891891
}
892892

893893
.divide-y > :not(template) ~ :not(template) {
894894
--divide-y-reverse: 0;
895-
border-top: calc(1px * calc(1 - var(--divide-y-reverse)));
896-
border-bottom: calc(1px * var(--divide-y-reverse));
895+
border-top-width: calc(1px * calc(1 - var(--divide-y-reverse)));
896+
border-bottom-width: calc(1px * var(--divide-y-reverse));
897897
}
898898

899899
.divide-x > :not(template) ~ :not(template) {
900900
--divide-x-reverse: 0;
901-
border-right: calc(1px * var(--divide-y-reverse));
902-
border-left: calc(1px * calc(1 - var(--divide-y-reverse)));
901+
border-right-width: calc(1px * var(--divide-y-reverse));
902+
border-left-width: calc(1px * calc(1 - var(--divide-y-reverse)));
903903
}
904904

905905
.divide-y-reverse > :not(template) ~ :not(template) {

‎__tests__/plugins/divideWidth.test.js

Lines changed: 12 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -22,33 +22,33 @@ test('generating divide width utilities', () => {
2222
{
2323
'.divide-y > :not(template) ~ :not(template)': {
2424
'--divide-y-reverse': '0',
25-
'border-top': 'calc(1px * calc(1 - var(--divide-y-reverse)))',
26-
'border-bottom': 'calc(1px * var(--divide-y-reverse))',
25+
'border-top-width': 'calc(1px * calc(1 - var(--divide-y-reverse)))',
26+
'border-bottom-width': 'calc(1px * var(--divide-y-reverse))',
2727
},
2828
'.divide-x > :not(template) ~ :not(template)': {
2929
'--divide-x-reverse': '0',
30-
'border-right': 'calc(1px * var(--divide-y-reverse))',
31-
'border-left': 'calc(1px * calc(1 - var(--divide-y-reverse)))',
30+
'border-right-width': 'calc(1px * var(--divide-y-reverse))',
31+
'border-left-width': 'calc(1px * calc(1 - var(--divide-y-reverse)))',
3232
},
3333
'.divide-y-2 > :not(template) ~ :not(template)': {
3434
'--divide-y-reverse': '0',
35-
'border-top': 'calc(2px * calc(1 - var(--divide-y-reverse)))',
36-
'border-bottom': 'calc(2px * var(--divide-y-reverse))',
35+
'border-top-width': 'calc(2px * calc(1 - var(--divide-y-reverse)))',
36+
'border-bottom-width': 'calc(2px * var(--divide-y-reverse))',
3737
},
3838
'.divide-x-2 > :not(template) ~ :not(template)': {
3939
'--divide-x-reverse': '0',
40-
'border-right': 'calc(2px * var(--divide-y-reverse))',
41-
'border-left': 'calc(2px * calc(1 - var(--divide-y-reverse)))',
40+
'border-right-width': 'calc(2px * var(--divide-y-reverse))',
41+
'border-left-width': 'calc(2px * calc(1 - var(--divide-y-reverse)))',
4242
},
4343
'.divide-y-4 > :not(template) ~ :not(template)': {
4444
'--divide-y-reverse': '0',
45-
'border-top': 'calc(4px * calc(1 - var(--divide-y-reverse)))',
46-
'border-bottom': 'calc(4px * var(--divide-y-reverse))',
45+
'border-top-width': 'calc(4px * calc(1 - var(--divide-y-reverse)))',
46+
'border-bottom-width': 'calc(4px * var(--divide-y-reverse))',
4747
},
4848
'.divide-x-4 > :not(template) ~ :not(template)': {
4949
'--divide-x-reverse': '0',
50-
'border-right': 'calc(4px * var(--divide-y-reverse))',
51-
'border-left': 'calc(4px * calc(1 - var(--divide-y-reverse)))',
50+
'border-right-width': 'calc(4px * var(--divide-y-reverse))',
51+
'border-left-width': 'calc(4px * calc(1 - var(--divide-y-reverse)))',
5252
},
5353
'.divide-y-reverse > :not(template) ~ :not(template)': {
5454
'--divide-y-reverse': '1',

‎src/plugins/divideWidth.js

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -6,13 +6,13 @@ export default function() {
66
(size, modifier) => ({
77
[`.${e(`divide-y${modifier}`)} > :not(template) ~ :not(template)`]: {
88
'--divide-y-reverse': '0',
9-
'border-top': `calc(${size} * calc(1 - var(--divide-y-reverse)))`,
10-
'border-bottom': `calc(${size} * var(--divide-y-reverse))`,
9+
'border-top-width': `calc(${size} * calc(1 - var(--divide-y-reverse)))`,
10+
'border-bottom-width': `calc(${size} * var(--divide-y-reverse))`,
1111
},
1212
[`.${e(`divide-x${modifier}`)} > :not(template) ~ :not(template)`]: {
1313
'--divide-x-reverse': '0',
14-
'border-right': `calc(${size} * var(--divide-y-reverse))`,
15-
'border-left': `calc(${size} * calc(1 - var(--divide-y-reverse)))`,
14+
'border-right-width': `calc(${size} * var(--divide-y-reverse))`,
15+
'border-left-width': `calc(${size} * calc(1 - var(--divide-y-reverse)))`,
1616
},
1717
}),
1818
]

0 commit comments

Comments
 (0)