Add PostCSS position utilities

This commit is contained in:
Adam Wathan 2017-08-26 23:35:18 -04:00
parent 2759872ce0
commit 3b93b0e655
5 changed files with 254 additions and 1 deletions

235
dist/tailwind.css vendored
View File

@ -491,6 +491,53 @@ body {
border-color: #fdf2f5;
}
.fixed {
position: fixed;
}
.absolute {
position: absolute;
}
.relative {
position: relative;
}
.pin-t {
top: 0;
}
.pin-r {
right: 0;
}
.pin-b {
bottom: 0;
}
.pin-l {
left: 0;
}
.pin-y {
top: 0;
bottom: 0;
}
.pin-x {
right: 0;
left: 0;
}
.pin {
top: 0;
right: 0;
bottom: 0;
left: 0;
width: 100%;
height: 100%;
}
.constrain-xs {
max-width: 20rem;
}
@ -1164,6 +1211,53 @@ body {
border-color: #fdf2f5;
}
.sm\:fixed {
position: fixed;
}
.sm\:absolute {
position: absolute;
}
.sm\:relative {
position: relative;
}
.sm\:pin-t {
top: 0;
}
.sm\:pin-r {
right: 0;
}
.sm\:pin-b {
bottom: 0;
}
.sm\:pin-l {
left: 0;
}
.sm\:pin-y {
top: 0;
bottom: 0;
}
.sm\:pin-x {
right: 0;
left: 0;
}
.sm\:pin {
top: 0;
right: 0;
bottom: 0;
left: 0;
width: 100%;
height: 100%;
}
.sm\:constrain-xs {
max-width: 20rem;
}
@ -1838,6 +1932,53 @@ body {
border-color: #fdf2f5;
}
.md\:fixed {
position: fixed;
}
.md\:absolute {
position: absolute;
}
.md\:relative {
position: relative;
}
.md\:pin-t {
top: 0;
}
.md\:pin-r {
right: 0;
}
.md\:pin-b {
bottom: 0;
}
.md\:pin-l {
left: 0;
}
.md\:pin-y {
top: 0;
bottom: 0;
}
.md\:pin-x {
right: 0;
left: 0;
}
.md\:pin {
top: 0;
right: 0;
bottom: 0;
left: 0;
width: 100%;
height: 100%;
}
.md\:constrain-xs {
max-width: 20rem;
}
@ -2512,6 +2653,53 @@ body {
border-color: #fdf2f5;
}
.lg\:fixed {
position: fixed;
}
.lg\:absolute {
position: absolute;
}
.lg\:relative {
position: relative;
}
.lg\:pin-t {
top: 0;
}
.lg\:pin-r {
right: 0;
}
.lg\:pin-b {
bottom: 0;
}
.lg\:pin-l {
left: 0;
}
.lg\:pin-y {
top: 0;
bottom: 0;
}
.lg\:pin-x {
right: 0;
left: 0;
}
.lg\:pin {
top: 0;
right: 0;
bottom: 0;
left: 0;
width: 100%;
height: 100%;
}
.lg\:constrain-xs {
max-width: 20rem;
}
@ -3186,6 +3374,53 @@ body {
border-color: #fdf2f5;
}
.xl\:fixed {
position: fixed;
}
.xl\:absolute {
position: absolute;
}
.xl\:relative {
position: relative;
}
.xl\:pin-t {
top: 0;
}
.xl\:pin-r {
right: 0;
}
.xl\:pin-b {
bottom: 0;
}
.xl\:pin-l {
left: 0;
}
.xl\:pin-y {
top: 0;
bottom: 0;
}
.xl\:pin-x {
right: 0;
left: 0;
}
.xl\:pin {
top: 0;
right: 0;
bottom: 0;
left: 0;
width: 100%;
height: 100%;
}
.xl\:constrain-xs {
max-width: 20rem;
}

File diff suppressed because one or more lines are too long

View File

@ -0,0 +1,16 @@
import defineClasses from '../util/defineClasses'
export default function() {
return defineClasses({
'fixed': { position: 'fixed' },
'absolute': { position: 'absolute' },
'relative': { position: 'relative' },
'pin-t': { top: 0 },
'pin-r': { right: 0 },
'pin-b': { bottom: 0 },
'pin-l': { left: 0 },
'pin-y': { top: 0, bottom: 0 },
'pin-x': { right: 0, left: 0 },
'pin': { top: 0, right: 0, bottom: 0, left: 0, width: '100%', height: '100%' },
})
}

View File

@ -4,6 +4,7 @@ import backgroundColors from '../generators/backgroundColors'
import backgroundSize from '../generators/backgroundSize'
import borderWidths from '../generators/borderWidths'
import borderColors from '../generators/borderColors'
import position from '../generators/position'
import constrain from '../generators/constrain'
import shadows from '../generators/shadows'
import flex from '../generators/flex'
@ -17,6 +18,7 @@ export default function(options) {
backgroundSize(options),
borderWidths(options),
borderColors(options),
position(options),
constrain(options),
shadows(options),
flex(options),