wrapper/tailwindcss
1
0
Fork 0
Code Issues Pull requests Projects Releases 1 Packages Wiki Activity Actions

Use minmax to ensure default grid columns are always equal width

Browse source
This commit is contained in:
Adam Wathan 2019-12-25 13:04:34 -05:00
parent a552eb185b
commit d075773c67
3 changed files with 132 additions and 132 deletions
Download patch file Download diff file Expand all files Collapse all files

120
__tests__/fixtures/tailwind-output-important.css
View file

@ -8443,51 +8443,51 @@ video {
}
.grid-cols-1 {
grid-template-columns: repeat(1, 1fr) !important;
grid-template-columns: repeat(1, minmax(0, 1fr)) !important;
}
.grid-cols-2 {
grid-template-columns: repeat(2, 1fr) !important;
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}
.grid-cols-3 {
grid-template-columns: repeat(3, 1fr) !important;
grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}
.grid-cols-4 {
grid-template-columns: repeat(4, 1fr) !important;
grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
}
.grid-cols-5 {
grid-template-columns: repeat(5, 1fr) !important;
grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
}
.grid-cols-6 {
grid-template-columns: repeat(6, 1fr) !important;
grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
}
.grid-cols-7 {
grid-template-columns: repeat(7, 1fr) !important;
grid-template-columns: repeat(7, minmax(0, 1fr)) !important;
}
.grid-cols-8 {
grid-template-columns: repeat(8, 1fr) !important;
grid-template-columns: repeat(8, minmax(0, 1fr)) !important;
}
.grid-cols-9 {
grid-template-columns: repeat(9, 1fr) !important;
grid-template-columns: repeat(9, minmax(0, 1fr)) !important;
}
.grid-cols-10 {
grid-template-columns: repeat(10, 1fr) !important;
grid-template-columns: repeat(10, minmax(0, 1fr)) !important;
}
.grid-cols-11 {
grid-template-columns: repeat(11, 1fr) !important;
grid-template-columns: repeat(11, minmax(0, 1fr)) !important;
}
.grid-cols-12 {
grid-template-columns: repeat(12, 1fr) !important;
grid-template-columns: repeat(12, minmax(0, 1fr)) !important;
}
.col-span-1 {
@ -17993,51 +17993,51 @@ video {
}
.sm\:grid-cols-1 {
grid-template-columns: repeat(1, 1fr) !important;
grid-template-columns: repeat(1, minmax(0, 1fr)) !important;
}
.sm\:grid-cols-2 {
grid-template-columns: repeat(2, 1fr) !important;
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}
.sm\:grid-cols-3 {
grid-template-columns: repeat(3, 1fr) !important;
grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}
.sm\:grid-cols-4 {
grid-template-columns: repeat(4, 1fr) !important;
grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
}
.sm\:grid-cols-5 {
grid-template-columns: repeat(5, 1fr) !important;
grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
}
.sm\:grid-cols-6 {
grid-template-columns: repeat(6, 1fr) !important;
grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
}
.sm\:grid-cols-7 {
grid-template-columns: repeat(7, 1fr) !important;
grid-template-columns: repeat(7, minmax(0, 1fr)) !important;
}
.sm\:grid-cols-8 {
grid-template-columns: repeat(8, 1fr) !important;
grid-template-columns: repeat(8, minmax(0, 1fr)) !important;
}
.sm\:grid-cols-9 {
grid-template-columns: repeat(9, 1fr) !important;
grid-template-columns: repeat(9, minmax(0, 1fr)) !important;
}
.sm\:grid-cols-10 {
grid-template-columns: repeat(10, 1fr) !important;
grid-template-columns: repeat(10, minmax(0, 1fr)) !important;
}
.sm\:grid-cols-11 {
grid-template-columns: repeat(11, 1fr) !important;
grid-template-columns: repeat(11, minmax(0, 1fr)) !important;
}
.sm\:grid-cols-12 {
grid-template-columns: repeat(12, 1fr) !important;
grid-template-columns: repeat(12, minmax(0, 1fr)) !important;
}
.sm\:col-span-1 {
@ -27544,51 +27544,51 @@ video {
}
.md\:grid-cols-1 {
grid-template-columns: repeat(1, 1fr) !important;
grid-template-columns: repeat(1, minmax(0, 1fr)) !important;
}
.md\:grid-cols-2 {
grid-template-columns: repeat(2, 1fr) !important;
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}
.md\:grid-cols-3 {
grid-template-columns: repeat(3, 1fr) !important;
grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}
.md\:grid-cols-4 {
grid-template-columns: repeat(4, 1fr) !important;
grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
}
.md\:grid-cols-5 {
grid-template-columns: repeat(5, 1fr) !important;
grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
}
.md\:grid-cols-6 {
grid-template-columns: repeat(6, 1fr) !important;
grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
}
.md\:grid-cols-7 {
grid-template-columns: repeat(7, 1fr) !important;
grid-template-columns: repeat(7, minmax(0, 1fr)) !important;
}
.md\:grid-cols-8 {
grid-template-columns: repeat(8, 1fr) !important;
grid-template-columns: repeat(8, minmax(0, 1fr)) !important;
}
.md\:grid-cols-9 {
grid-template-columns: repeat(9, 1fr) !important;
grid-template-columns: repeat(9, minmax(0, 1fr)) !important;
}
.md\:grid-cols-10 {
grid-template-columns: repeat(10, 1fr) !important;
grid-template-columns: repeat(10, minmax(0, 1fr)) !important;
}
.md\:grid-cols-11 {
grid-template-columns: repeat(11, 1fr) !important;
grid-template-columns: repeat(11, minmax(0, 1fr)) !important;
}
.md\:grid-cols-12 {
grid-template-columns: repeat(12, 1fr) !important;
grid-template-columns: repeat(12, minmax(0, 1fr)) !important;
}
.md\:col-span-1 {
@ -37095,51 +37095,51 @@ video {
}
.lg\:grid-cols-1 {
grid-template-columns: repeat(1, 1fr) !important;
grid-template-columns: repeat(1, minmax(0, 1fr)) !important;
}
.lg\:grid-cols-2 {
grid-template-columns: repeat(2, 1fr) !important;
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}
.lg\:grid-cols-3 {
grid-template-columns: repeat(3, 1fr) !important;
grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}
.lg\:grid-cols-4 {
grid-template-columns: repeat(4, 1fr) !important;
grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
}
.lg\:grid-cols-5 {
grid-template-columns: repeat(5, 1fr) !important;
grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
}
.lg\:grid-cols-6 {
grid-template-columns: repeat(6, 1fr) !important;
grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
}
.lg\:grid-cols-7 {
grid-template-columns: repeat(7, 1fr) !important;
grid-template-columns: repeat(7, minmax(0, 1fr)) !important;
}
.lg\:grid-cols-8 {
grid-template-columns: repeat(8, 1fr) !important;
grid-template-columns: repeat(8, minmax(0, 1fr)) !important;
}
.lg\:grid-cols-9 {
grid-template-columns: repeat(9, 1fr) !important;
grid-template-columns: repeat(9, minmax(0, 1fr)) !important;
}
.lg\:grid-cols-10 {
grid-template-columns: repeat(10, 1fr) !important;
grid-template-columns: repeat(10, minmax(0, 1fr)) !important;
}
.lg\:grid-cols-11 {
grid-template-columns: repeat(11, 1fr) !important;
grid-template-columns: repeat(11, minmax(0, 1fr)) !important;
}
.lg\:grid-cols-12 {
grid-template-columns: repeat(12, 1fr) !important;
grid-template-columns: repeat(12, minmax(0, 1fr)) !important;
}
.lg\:col-span-1 {
@ -46646,51 +46646,51 @@ video {
}
.xl\:grid-cols-1 {
grid-template-columns: repeat(1, 1fr) !important;
grid-template-columns: repeat(1, minmax(0, 1fr)) !important;
}
.xl\:grid-cols-2 {
grid-template-columns: repeat(2, 1fr) !important;
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}
.xl\:grid-cols-3 {
grid-template-columns: repeat(3, 1fr) !important;
grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}
.xl\:grid-cols-4 {
grid-template-columns: repeat(4, 1fr) !important;
grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
}
.xl\:grid-cols-5 {
grid-template-columns: repeat(5, 1fr) !important;
grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
}
.xl\:grid-cols-6 {
grid-template-columns: repeat(6, 1fr) !important;
grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
}
.xl\:grid-cols-7 {
grid-template-columns: repeat(7, 1fr) !important;
grid-template-columns: repeat(7, minmax(0, 1fr)) !important;
}
.xl\:grid-cols-8 {
grid-template-columns: repeat(8, 1fr) !important;
grid-template-columns: repeat(8, minmax(0, 1fr)) !important;
}
.xl\:grid-cols-9 {
grid-template-columns: repeat(9, 1fr) !important;
grid-template-columns: repeat(9, minmax(0, 1fr)) !important;
}
.xl\:grid-cols-10 {
grid-template-columns: repeat(10, 1fr) !important;
grid-template-columns: repeat(10, minmax(0, 1fr)) !important;
}
.xl\:grid-cols-11 {
grid-template-columns: repeat(11, 1fr) !important;
grid-template-columns: repeat(11, minmax(0, 1fr)) !important;
}
.xl\:grid-cols-12 {
grid-template-columns: repeat(12, 1fr) !important;
grid-template-columns: repeat(12, minmax(0, 1fr)) !important;
}
.xl\:col-span-1 {

120
__tests__/fixtures/tailwind-output.css
View file

@ -8443,51 +8443,51 @@ video {
}
.grid-cols-1 {
grid-template-columns: repeat(1, 1fr);
grid-template-columns: repeat(1, minmax(0, 1fr));
}
.grid-cols-2 {
grid-template-columns: repeat(2, 1fr);
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.grid-cols-3 {
grid-template-columns: repeat(3, 1fr);
grid-template-columns: repeat(3, minmax(0, 1fr));
}
.grid-cols-4 {
grid-template-columns: repeat(4, 1fr);
grid-template-columns: repeat(4, minmax(0, 1fr));
}
.grid-cols-5 {
grid-template-columns: repeat(5, 1fr);
grid-template-columns: repeat(5, minmax(0, 1fr));
}
.grid-cols-6 {
grid-template-columns: repeat(6, 1fr);
grid-template-columns: repeat(6, minmax(0, 1fr));
}
.grid-cols-7 {
grid-template-columns: repeat(7, 1fr);
grid-template-columns: repeat(7, minmax(0, 1fr));
}
.grid-cols-8 {
grid-template-columns: repeat(8, 1fr);
grid-template-columns: repeat(8, minmax(0, 1fr));
}
.grid-cols-9 {
grid-template-columns: repeat(9, 1fr);
grid-template-columns: repeat(9, minmax(0, 1fr));
}
.grid-cols-10 {
grid-template-columns: repeat(10, 1fr);
grid-template-columns: repeat(10, minmax(0, 1fr));
}
.grid-cols-11 {
grid-template-columns: repeat(11, 1fr);
grid-template-columns: repeat(11, minmax(0, 1fr));
}
.grid-cols-12 {
grid-template-columns: repeat(12, 1fr);
grid-template-columns: repeat(12, minmax(0, 1fr));
}
.col-span-1 {
@ -17993,51 +17993,51 @@ video {
}
.sm\:grid-cols-1 {
grid-template-columns: repeat(1, 1fr);
grid-template-columns: repeat(1, minmax(0, 1fr));
}
.sm\:grid-cols-2 {
grid-template-columns: repeat(2, 1fr);
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.sm\:grid-cols-3 {
grid-template-columns: repeat(3, 1fr);
grid-template-columns: repeat(3, minmax(0, 1fr));
}
.sm\:grid-cols-4 {
grid-template-columns: repeat(4, 1fr);
grid-template-columns: repeat(4, minmax(0, 1fr));
}
.sm\:grid-cols-5 {
grid-template-columns: repeat(5, 1fr);
grid-template-columns: repeat(5, minmax(0, 1fr));
}
.sm\:grid-cols-6 {
grid-template-columns: repeat(6, 1fr);
grid-template-columns: repeat(6, minmax(0, 1fr));
}
.sm\:grid-cols-7 {
grid-template-columns: repeat(7, 1fr);
grid-template-columns: repeat(7, minmax(0, 1fr));
}
.sm\:grid-cols-8 {
grid-template-columns: repeat(8, 1fr);
grid-template-columns: repeat(8, minmax(0, 1fr));
}
.sm\:grid-cols-9 {
grid-template-columns: repeat(9, 1fr);
grid-template-columns: repeat(9, minmax(0, 1fr));
}
.sm\:grid-cols-10 {
grid-template-columns: repeat(10, 1fr);
grid-template-columns: repeat(10, minmax(0, 1fr));
}
.sm\:grid-cols-11 {
grid-template-columns: repeat(11, 1fr);
grid-template-columns: repeat(11, minmax(0, 1fr));
}
.sm\:grid-cols-12 {
grid-template-columns: repeat(12, 1fr);
grid-template-columns: repeat(12, minmax(0, 1fr));
}
.sm\:col-span-1 {
@ -27544,51 +27544,51 @@ video {
}
.md\:grid-cols-1 {
grid-template-columns: repeat(1, 1fr);
grid-template-columns: repeat(1, minmax(0, 1fr));
}
.md\:grid-cols-2 {
grid-template-columns: repeat(2, 1fr);
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.md\:grid-cols-3 {
grid-template-columns: repeat(3, 1fr);
grid-template-columns: repeat(3, minmax(0, 1fr));
}
.md\:grid-cols-4 {
grid-template-columns: repeat(4, 1fr);
grid-template-columns: repeat(4, minmax(0, 1fr));
}
.md\:grid-cols-5 {
grid-template-columns: repeat(5, 1fr);
grid-template-columns: repeat(5, minmax(0, 1fr));
}
.md\:grid-cols-6 {
grid-template-columns: repeat(6, 1fr);
grid-template-columns: repeat(6, minmax(0, 1fr));
}
.md\:grid-cols-7 {
grid-template-columns: repeat(7, 1fr);
grid-template-columns: repeat(7, minmax(0, 1fr));
}
.md\:grid-cols-8 {
grid-template-columns: repeat(8, 1fr);
grid-template-columns: repeat(8, minmax(0, 1fr));
}
.md\:grid-cols-9 {
grid-template-columns: repeat(9, 1fr);
grid-template-columns: repeat(9, minmax(0, 1fr));
}
.md\:grid-cols-10 {
grid-template-columns: repeat(10, 1fr);
grid-template-columns: repeat(10, minmax(0, 1fr));
}
.md\:grid-cols-11 {
grid-template-columns: repeat(11, 1fr);
grid-template-columns: repeat(11, minmax(0, 1fr));
}
.md\:grid-cols-12 {
grid-template-columns: repeat(12, 1fr);
grid-template-columns: repeat(12, minmax(0, 1fr));
}
.md\:col-span-1 {
@ -37095,51 +37095,51 @@ video {
}
.lg\:grid-cols-1 {
grid-template-columns: repeat(1, 1fr);
grid-template-columns: repeat(1, minmax(0, 1fr));
}
.lg\:grid-cols-2 {
grid-template-columns: repeat(2, 1fr);
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.lg\:grid-cols-3 {
grid-template-columns: repeat(3, 1fr);
grid-template-columns: repeat(3, minmax(0, 1fr));
}
.lg\:grid-cols-4 {
grid-template-columns: repeat(4, 1fr);
grid-template-columns: repeat(4, minmax(0, 1fr));
}
.lg\:grid-cols-5 {
grid-template-columns: repeat(5, 1fr);
grid-template-columns: repeat(5, minmax(0, 1fr));
}
.lg\:grid-cols-6 {
grid-template-columns: repeat(6, 1fr);
grid-template-columns: repeat(6, minmax(0, 1fr));
}
.lg\:grid-cols-7 {
grid-template-columns: repeat(7, 1fr);
grid-template-columns: repeat(7, minmax(0, 1fr));
}
.lg\:grid-cols-8 {
grid-template-columns: repeat(8, 1fr);
grid-template-columns: repeat(8, minmax(0, 1fr));
}
.lg\:grid-cols-9 {
grid-template-columns: repeat(9, 1fr);
grid-template-columns: repeat(9, minmax(0, 1fr));
}
.lg\:grid-cols-10 {
grid-template-columns: repeat(10, 1fr);
grid-template-columns: repeat(10, minmax(0, 1fr));
}
.lg\:grid-cols-11 {
grid-template-columns: repeat(11, 1fr);
grid-template-columns: repeat(11, minmax(0, 1fr));
}
.lg\:grid-cols-12 {
grid-template-columns: repeat(12, 1fr);
grid-template-columns: repeat(12, minmax(0, 1fr));
}
.lg\:col-span-1 {
@ -46646,51 +46646,51 @@ video {
}
.xl\:grid-cols-1 {
grid-template-columns: repeat(1, 1fr);
grid-template-columns: repeat(1, minmax(0, 1fr));
}
.xl\:grid-cols-2 {
grid-template-columns: repeat(2, 1fr);
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.xl\:grid-cols-3 {
grid-template-columns: repeat(3, 1fr);
grid-template-columns: repeat(3, minmax(0, 1fr));
}
.xl\:grid-cols-4 {
grid-template-columns: repeat(4, 1fr);
grid-template-columns: repeat(4, minmax(0, 1fr));
}
.xl\:grid-cols-5 {
grid-template-columns: repeat(5, 1fr);
grid-template-columns: repeat(5, minmax(0, 1fr));
}
.xl\:grid-cols-6 {
grid-template-columns: repeat(6, 1fr);
grid-template-columns: repeat(6, minmax(0, 1fr));
}
.xl\:grid-cols-7 {
grid-template-columns: repeat(7, 1fr);
grid-template-columns: repeat(7, minmax(0, 1fr));
}
.xl\:grid-cols-8 {
grid-template-columns: repeat(8, 1fr);
grid-template-columns: repeat(8, minmax(0, 1fr));
}
.xl\:grid-cols-9 {
grid-template-columns: repeat(9, 1fr);
grid-template-columns: repeat(9, minmax(0, 1fr));
}
.xl\:grid-cols-10 {
grid-template-columns: repeat(10, 1fr);
grid-template-columns: repeat(10, minmax(0, 1fr));
}
.xl\:grid-cols-11 {
grid-template-columns: repeat(11, 1fr);
grid-template-columns: repeat(11, minmax(0, 1fr));
}
.xl\:grid-cols-12 {
grid-template-columns: repeat(12, 1fr);
grid-template-columns: repeat(12, minmax(0, 1fr));
}
.xl\:col-span-1 {

24
stubs/defaultConfig.stub.js
View file

@ -407,18 +407,18 @@ module.exports = {
},
gridGap: theme => theme('spacing'),
gridTemplateColumns: {
'1': 'repeat(1, 1fr)',
'2': 'repeat(2, 1fr)',
'3': 'repeat(3, 1fr)',
'4': 'repeat(4, 1fr)',
'5': 'repeat(5, 1fr)',
'6': 'repeat(6, 1fr)',
'7': 'repeat(7, 1fr)',
'8': 'repeat(8, 1fr)',
'9': 'repeat(9, 1fr)',
'10': 'repeat(10, 1fr)',
'11': 'repeat(11, 1fr)',
'12': 'repeat(12, 1fr)',
'1': 'repeat(1, minmax(0, 1fr))',
'2': 'repeat(2, minmax(0, 1fr))',
'3': 'repeat(3, minmax(0, 1fr))',
'4': 'repeat(4, minmax(0, 1fr))',
'5': 'repeat(5, minmax(0, 1fr))',
'6': 'repeat(6, minmax(0, 1fr))',
'7': 'repeat(7, minmax(0, 1fr))',
'8': 'repeat(8, minmax(0, 1fr))',
'9': 'repeat(9, minmax(0, 1fr))',
'10': 'repeat(10, minmax(0, 1fr))',
'11': 'repeat(11, minmax(0, 1fr))',
'12': 'repeat(12, minmax(0, 1fr))',
},
gridColumnGap: {},
gridColumn: {