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

Merge pull request #35 from adamwathan/rename_layout_to_constrain

Browse source 
Improvements to contrain utilities
This commit is contained in:
Adam Wathan 2017-08-01 16:16:39 -04:00 • committed by GitHub
commit 483010e5c6
3 changed files with 32 additions and 16 deletions
Download patch file Download diff file Expand all files Collapse all files

2
src/utilities.less
View file

@ -2,11 +2,11 @@
@import "utilities/backgrounds";
@import "utilities/borders";
@import "utilities/constrain";
@import "utilities/display";
@import "utilities/flex";
@import "utilities/grid";
@import "utilities/images";
@import "utilities/layout";
@import "utilities/misc";
@import "utilities/position";
@import "utilities/spacing";

31
src/utilities/constrain.less Normal file
View file

@ -0,0 +1,31 @@
@constrain-xs: 20rem;
@constrain-sm: 30rem;
@constrain-md: 40rem;
@constrain-lg: 50rem;
@constrain-xl: 60rem;
@constrain-2xl: 70rem;
@constrain-3xl: 80rem;
@constrain-4xl: 90rem;
@constrain-5xl: 100rem;
.constrain-xs { max-width: @constrain-xs; flex-basis: @constrain-xs; }
.constrain-sm { max-width: @constrain-sm; flex-basis: @constrain-sm; }
.constrain-md { max-width: @constrain-md; flex-basis: @constrain-md; }
.constrain-lg { max-width: @constrain-lg; flex-basis: @constrain-lg; }
.constrain-xl { max-width: @constrain-xl; flex-basis: @constrain-xl; }
.constrain-2xl { max-width: @constrain-2xl; flex-basis: @constrain-2xl; }
.constrain-3xl { max-width: @constrain-3xl; flex-basis: @constrain-3xl; }
.constrain-4xl { max-width: @constrain-4xl; flex-basis: @constrain-4xl; }
.constrain-5xl { max-width: @constrain-5xl; flex-basis: @constrain-5xl; }
.responsive({
&constrain-xs { .constrain-xs; }
&constrain-sm { .constrain-sm; }
&constrain-md { .constrain-md; }
&constrain-lg { .constrain-lg; }
&constrain-xl { .constrain-xl; }
&constrain-2xl { .constrain-2xl; }
&constrain-3xl { .constrain-3xl; }
&constrain-4xl { .constrain-4xl; }
&constrain-5xl { .constrain-5xl; }
});

15
src/utilities/layout.less
View file

@ -1,15 +0,0 @@
.constrain-xs { max-width: 22rem; flex-basis: 22rem; }
.constrain-sm { max-width: 26rem; flex-basis: 26rem; }
.constrain-md { max-width: 32rem; flex-basis: 32rem; }
.constrain-lg { max-width: 40rem; flex-basis: 40rem; }
.constrain-xl { max-width: 48rem; flex-basis: 48rem; }
.constrain-xxl { max-width: 52rem; flex-basis: 52rem; }
.responsive({
&constrain-xs { .constrain-xs; }
&constrain-sm { .constrain-sm; }
&constrain-md { .constrain-md; }
&constrain-lg { .constrain-lg; }
&constrain-xl { .constrain-xl; }
&constrain-xxl { .constrain-xxl; }
});