Skip to content

Commit b3b06e8

Browse files
adamwathanadamwathan
committed
Add negative space utility support
1 parent 8df2cd5 commit b3b06e8

File tree

5 files changed

+461
-3
lines changed

5 files changed

+461
-3
lines changed

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

Lines changed: 216 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -834,6 +834,222 @@ video {
834834
margin-left: calc(1px * calc(1 - var(--space-y-reverse))) !important;
835835
}
836836

837+
.-space-y-1 > :not(template) ~ :not(template) {
838+
--space-y-reverse: 0 !important;
839+
margin-top: calc(-0.25rem * calc(1 - var(--space-y-reverse))) !important;
840+
margin-bottom: calc(-0.25rem * var(--space-y-reverse)) !important;
841+
}
842+
843+
.-space-x-1 > :not(template) ~ :not(template) {
844+
--space-x-reverse: 0 !important;
845+
margin-right: calc(-0.25rem * var(--space-y-reverse)) !important;
846+
margin-left: calc(-0.25rem * calc(1 - var(--space-y-reverse))) !important;
847+
}
848+
849+
.-space-y-2 > :not(template) ~ :not(template) {
850+
--space-y-reverse: 0 !important;
851+
margin-top: calc(-0.5rem * calc(1 - var(--space-y-reverse))) !important;
852+
margin-bottom: calc(-0.5rem * var(--space-y-reverse)) !important;
853+
}
854+
855+
.-space-x-2 > :not(template) ~ :not(template) {
856+
--space-x-reverse: 0 !important;
857+
margin-right: calc(-0.5rem * var(--space-y-reverse)) !important;
858+
margin-left: calc(-0.5rem * calc(1 - var(--space-y-reverse))) !important;
859+
}
860+
861+
.-space-y-3 > :not(template) ~ :not(template) {
862+
--space-y-reverse: 0 !important;
863+
margin-top: calc(-0.75rem * calc(1 - var(--space-y-reverse))) !important;
864+
margin-bottom: calc(-0.75rem * var(--space-y-reverse)) !important;
865+
}
866+
867+
.-space-x-3 > :not(template) ~ :not(template) {
868+
--space-x-reverse: 0 !important;
869+
margin-right: calc(-0.75rem * var(--space-y-reverse)) !important;
870+
margin-left: calc(-0.75rem * calc(1 - var(--space-y-reverse))) !important;
871+
}
872+
873+
.-space-y-4 > :not(template) ~ :not(template) {
874+
--space-y-reverse: 0 !important;
875+
margin-top: calc(-1rem * calc(1 - var(--space-y-reverse))) !important;
876+
margin-bottom: calc(-1rem * var(--space-y-reverse)) !important;
877+
}
878+
879+
.-space-x-4 > :not(template) ~ :not(template) {
880+
--space-x-reverse: 0 !important;
881+
margin-right: calc(-1rem * var(--space-y-reverse)) !important;
882+
margin-left: calc(-1rem * calc(1 - var(--space-y-reverse))) !important;
883+
}
884+
885+
.-space-y-5 > :not(template) ~ :not(template) {
886+
--space-y-reverse: 0 !important;
887+
margin-top: calc(-1.25rem * calc(1 - var(--space-y-reverse))) !important;
888+
margin-bottom: calc(-1.25rem * var(--space-y-reverse)) !important;
889+
}
890+
891+
.-space-x-5 > :not(template) ~ :not(template) {
892+
--space-x-reverse: 0 !important;
893+
margin-right: calc(-1.25rem * var(--space-y-reverse)) !important;
894+
margin-left: calc(-1.25rem * calc(1 - var(--space-y-reverse))) !important;
895+
}
896+
897+
.-space-y-6 > :not(template) ~ :not(template) {
898+
--space-y-reverse: 0 !important;
899+
margin-top: calc(-1.5rem * calc(1 - var(--space-y-reverse))) !important;
900+
margin-bottom: calc(-1.5rem * var(--space-y-reverse)) !important;
901+
}
902+
903+
.-space-x-6 > :not(template) ~ :not(template) {
904+
--space-x-reverse: 0 !important;
905+
margin-right: calc(-1.5rem * var(--space-y-reverse)) !important;
906+
margin-left: calc(-1.5rem * calc(1 - var(--space-y-reverse))) !important;
907+
}
908+
909+
.-space-y-8 > :not(template) ~ :not(template) {
910+
--space-y-reverse: 0 !important;
911+
margin-top: calc(-2rem * calc(1 - var(--space-y-reverse))) !important;
912+
margin-bottom: calc(-2rem * var(--space-y-reverse)) !important;
913+
}
914+
915+
.-space-x-8 > :not(template) ~ :not(template) {
916+
--space-x-reverse: 0 !important;
917+
margin-right: calc(-2rem * var(--space-y-reverse)) !important;
918+
margin-left: calc(-2rem * calc(1 - var(--space-y-reverse))) !important;
919+
}
920+
921+
.-space-y-10 > :not(template) ~ :not(template) {
922+
--space-y-reverse: 0 !important;
923+
margin-top: calc(-2.5rem * calc(1 - var(--space-y-reverse))) !important;
924+
margin-bottom: calc(-2.5rem * var(--space-y-reverse)) !important;
925+
}
926+
927+
.-space-x-10 > :not(template) ~ :not(template) {
928+
--space-x-reverse: 0 !important;
929+
margin-right: calc(-2.5rem * var(--space-y-reverse)) !important;
930+
margin-left: calc(-2.5rem * calc(1 - var(--space-y-reverse))) !important;
931+
}
932+
933+
.-space-y-12 > :not(template) ~ :not(template) {
934+
--space-y-reverse: 0 !important;
935+
margin-top: calc(-3rem * calc(1 - var(--space-y-reverse))) !important;
936+
margin-bottom: calc(-3rem * var(--space-y-reverse)) !important;
937+
}
938+
939+
.-space-x-12 > :not(template) ~ :not(template) {
940+
--space-x-reverse: 0 !important;
941+
margin-right: calc(-3rem * var(--space-y-reverse)) !important;
942+
margin-left: calc(-3rem * calc(1 - var(--space-y-reverse))) !important;
943+
}
944+
945+
.-space-y-16 > :not(template) ~ :not(template) {
946+
--space-y-reverse: 0 !important;
947+
margin-top: calc(-4rem * calc(1 - var(--space-y-reverse))) !important;
948+
margin-bottom: calc(-4rem * var(--space-y-reverse)) !important;
949+
}
950+
951+
.-space-x-16 > :not(template) ~ :not(template) {
952+
--space-x-reverse: 0 !important;
953+
margin-right: calc(-4rem * var(--space-y-reverse)) !important;
954+
margin-left: calc(-4rem * calc(1 - var(--space-y-reverse))) !important;
955+
}
956+
957+
.-space-y-20 > :not(template) ~ :not(template) {
958+
--space-y-reverse: 0 !important;
959+
margin-top: calc(-5rem * calc(1 - var(--space-y-reverse))) !important;
960+
margin-bottom: calc(-5rem * var(--space-y-reverse)) !important;
961+
}
962+
963+
.-space-x-20 > :not(template) ~ :not(template) {
964+
--space-x-reverse: 0 !important;
965+
margin-right: calc(-5rem * var(--space-y-reverse)) !important;
966+
margin-left: calc(-5rem * calc(1 - var(--space-y-reverse))) !important;
967+
}
968+
969+
.-space-y-24 > :not(template) ~ :not(template) {
970+
--space-y-reverse: 0 !important;
971+
margin-top: calc(-6rem * calc(1 - var(--space-y-reverse))) !important;
972+
margin-bottom: calc(-6rem * var(--space-y-reverse)) !important;
973+
}
974+
975+
.-space-x-24 > :not(template) ~ :not(template) {
976+
--space-x-reverse: 0 !important;
977+
margin-right: calc(-6rem * var(--space-y-reverse)) !important;
978+
margin-left: calc(-6rem * calc(1 - var(--space-y-reverse))) !important;
979+
}
980+
981+
.-space-y-32 > :not(template) ~ :not(template) {
982+
--space-y-reverse: 0 !important;
983+
margin-top: calc(-8rem * calc(1 - var(--space-y-reverse))) !important;
984+
margin-bottom: calc(-8rem * var(--space-y-reverse)) !important;
985+
}
986+
987+
.-space-x-32 > :not(template) ~ :not(template) {
988+
--space-x-reverse: 0 !important;
989+
margin-right: calc(-8rem * var(--space-y-reverse)) !important;
990+
margin-left: calc(-8rem * calc(1 - var(--space-y-reverse))) !important;
991+
}
992+
993+
.-space-y-40 > :not(template) ~ :not(template) {
994+
--space-y-reverse: 0 !important;
995+
margin-top: calc(-10rem * calc(1 - var(--space-y-reverse))) !important;
996+
margin-bottom: calc(-10rem * var(--space-y-reverse)) !important;
997+
}
998+
999+
.-space-x-40 > :not(template) ~ :not(template) {
1000+
--space-x-reverse: 0 !important;
1001+
margin-right: calc(-10rem * var(--space-y-reverse)) !important;
1002+
margin-left: calc(-10rem * calc(1 - var(--space-y-reverse))) !important;
1003+
}
1004+
1005+
.-space-y-48 > :not(template) ~ :not(template) {
1006+
--space-y-reverse: 0 !important;
1007+
margin-top: calc(-12rem * calc(1 - var(--space-y-reverse))) !important;
1008+
margin-bottom: calc(-12rem * var(--space-y-reverse)) !important;
1009+
}
1010+
1011+
.-space-x-48 > :not(template) ~ :not(template) {
1012+
--space-x-reverse: 0 !important;
1013+
margin-right: calc(-12rem * var(--space-y-reverse)) !important;
1014+
margin-left: calc(-12rem * calc(1 - var(--space-y-reverse))) !important;
1015+
}
1016+
1017+
.-space-y-56 > :not(template) ~ :not(template) {
1018+
--space-y-reverse: 0 !important;
1019+
margin-top: calc(-14rem * calc(1 - var(--space-y-reverse))) !important;
1020+
margin-bottom: calc(-14rem * var(--space-y-reverse)) !important;
1021+
}
1022+
1023+
.-space-x-56 > :not(template) ~ :not(template) {
1024+
--space-x-reverse: 0 !important;
1025+
margin-right: calc(-14rem * var(--space-y-reverse)) !important;
1026+
margin-left: calc(-14rem * calc(1 - var(--space-y-reverse))) !important;
1027+
}
1028+
1029+
.-space-y-64 > :not(template) ~ :not(template) {
1030+
--space-y-reverse: 0 !important;
1031+
margin-top: calc(-16rem * calc(1 - var(--space-y-reverse))) !important;
1032+
margin-bottom: calc(-16rem * var(--space-y-reverse)) !important;
1033+
}
1034+
1035+
.-space-x-64 > :not(template) ~ :not(template) {
1036+
--space-x-reverse: 0 !important;
1037+
margin-right: calc(-16rem * var(--space-y-reverse)) !important;
1038+
margin-left: calc(-16rem * calc(1 - var(--space-y-reverse))) !important;
1039+
}
1040+
1041+
.-space-y-px > :not(template) ~ :not(template) {
1042+
--space-y-reverse: 0 !important;
1043+
margin-top: calc(-1px * calc(1 - var(--space-y-reverse))) !important;
1044+
margin-bottom: calc(-1px * var(--space-y-reverse)) !important;
1045+
}
1046+
1047+
.-space-x-px > :not(template) ~ :not(template) {
1048+
--space-x-reverse: 0 !important;
1049+
margin-right: calc(-1px * var(--space-y-reverse)) !important;
1050+
margin-left: calc(-1px * calc(1 - var(--space-y-reverse))) !important;
1051+
}
1052+
8371053
.space-y-reverse > :not(template) ~ :not(template) {
8381054
--space-y-reverse: 1 !important;
8391055
}

0 commit comments

Comments
 (0)