Add PostCSS font family utilities

This commit is contained in:
Adam Wathan 2017-08-27 13:26:04 -04:00
parent 58d435ae82
commit c9e4652065
6 changed files with 78 additions and 11 deletions

60
dist/tailwind.css vendored
View file

@ -67,6 +67,18 @@ body {
font-weight: 700;
}
.sans {
font-family: system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue;
}
.serif {
font-family: Constantia, "Lucida Bright", Lucidabright, "Lucida Serif", Lucida, "DejaVu Serif", "Bitstream Vera Serif", "Liberation Serif", Georgia, serif;
}
.mono {
font-family: Consolas, "Andale Mono WT", "Andale Mono", "Lucida Console", "Lucida Sans Typewriter", "DejaVu Sans Mono", "Bitstream Vera Sans Mono", "Liberation Mono", "Nimbus Mono L", Monaco, "Courier New", Courier, monospace;
}
.bg-light {
background-color: #ffffff;
}
@ -1001,6 +1013,18 @@ body {
font-weight: 700;
}
.sm\:sans {
font-family: system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue;
}
.sm\:serif {
font-family: Constantia, "Lucida Bright", Lucidabright, "Lucida Serif", Lucida, "DejaVu Serif", "Bitstream Vera Serif", "Liberation Serif", Georgia, serif;
}
.sm\:mono {
font-family: Consolas, "Andale Mono WT", "Andale Mono", "Lucida Console", "Lucida Sans Typewriter", "DejaVu Sans Mono", "Bitstream Vera Sans Mono", "Liberation Mono", "Nimbus Mono L", Monaco, "Courier New", Courier, monospace;
}
.sm\:bg-light {
background-color: #ffffff;
}
@ -1936,6 +1960,18 @@ body {
font-weight: 700;
}
.md\:sans {
font-family: system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue;
}
.md\:serif {
font-family: Constantia, "Lucida Bright", Lucidabright, "Lucida Serif", Lucida, "DejaVu Serif", "Bitstream Vera Serif", "Liberation Serif", Georgia, serif;
}
.md\:mono {
font-family: Consolas, "Andale Mono WT", "Andale Mono", "Lucida Console", "Lucida Sans Typewriter", "DejaVu Sans Mono", "Bitstream Vera Sans Mono", "Liberation Mono", "Nimbus Mono L", Monaco, "Courier New", Courier, monospace;
}
.md\:bg-light {
background-color: #ffffff;
}
@ -2871,6 +2907,18 @@ body {
font-weight: 700;
}
.lg\:sans {
font-family: system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue;
}
.lg\:serif {
font-family: Constantia, "Lucida Bright", Lucidabright, "Lucida Serif", Lucida, "DejaVu Serif", "Bitstream Vera Serif", "Liberation Serif", Georgia, serif;
}
.lg\:mono {
font-family: Consolas, "Andale Mono WT", "Andale Mono", "Lucida Console", "Lucida Sans Typewriter", "DejaVu Sans Mono", "Bitstream Vera Sans Mono", "Liberation Mono", "Nimbus Mono L", Monaco, "Courier New", Courier, monospace;
}
.lg\:bg-light {
background-color: #ffffff;
}
@ -3806,6 +3854,18 @@ body {
font-weight: 700;
}
.xl\:sans {
font-family: system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue;
}
.xl\:serif {
font-family: Constantia, "Lucida Bright", Lucidabright, "Lucida Serif", Lucida, "DejaVu Serif", "Bitstream Vera Serif", "Liberation Serif", Georgia, serif;
}
.xl\:mono {
font-family: Consolas, "Andale Mono WT", "Andale Mono", "Lucida Console", "Lucida Sans Typewriter", "DejaVu Sans Mono", "Bitstream Vera Sans Mono", "Liberation Mono", "Nimbus Mono L", Monaco, "Courier New", Courier, monospace;
}
.xl\:bg-light {
background-color: #ffffff;
}

File diff suppressed because one or more lines are too long

View file

@ -1,13 +1,3 @@
// Font family
@font-family-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", Arial, sans-serif;
@font-family-serif: Constantia, "Lucida Bright", Lucidabright, "Lucida Serif", Lucida, "DejaVu Serif", "Bitstream Vera Serif", "Liberation Serif", Georgia, serif;
@font-family-mono: Consolas, "Andale Mono WT", "Andale Mono", "Lucida Console", "Lucida Sans Typewriter", "DejaVu Sans Mono", "Bitstream Vera Sans Mono", "Liberation Mono", "Nimbus Mono L", Monaco, "Courier New", Courier, monospace;
@font-family-base: @font-family-sans;
.sans { font-family: @font-family-sans; }
.serif { font-family: @font-family-serif; }
.mono { font-family: @font-family-mono; }
// Default line height
@line-height: 1.5;

View file

@ -54,6 +54,11 @@ export default {
'pink-lightest': '#fdf2f5',
},
text: {
fonts: {
'sans': 'system-ui',
'serif': 'Constantia, "Lucida Bright", Lucidabright, "Lucida Serif", Lucida, "DejaVu Serif", "Bitstream Vera Serif", "Liberation Serif", Georgia, serif',
'mono': 'Consolas, "Andale Mono WT", "Andale Mono", "Lucida Console", "Lucida Sans Typewriter", "DejaVu Sans Mono", "Bitstream Vera Sans Mono", "Liberation Mono", "Nimbus Mono L", Monaco, "Courier New", Courier, monospace',
},
sizes: {
'xs': '.75rem', // 12px
'sm': '.875rem', // 14px

View file

@ -0,0 +1,10 @@
import _ from 'lodash'
import defineClass from '../util/defineClass'
export default function ({ text }) {
return _.map(text.fonts, (families, font) => {
return defineClass(`${font}`, {
'font-family': `${families}`,
})
})
}

View file

@ -2,6 +2,7 @@ import _ from 'lodash'
import responsive from '../util/responsive'
import textSizes from '../generators/textSizes'
import textWeights from '../generators/textWeights'
import textFonts from '../generators/textFonts'
import backgroundColors from '../generators/backgroundColors'
import backgroundSize from '../generators/backgroundSize'
import borderWidths from '../generators/borderWidths'
@ -22,6 +23,7 @@ export default function(options) {
const utilities = _.flatten([
textSizes(options),
textWeights(options),
textFonts(options),
backgroundColors(options),
backgroundSize(options),
borderWidths(options),