Make container plugin a core plugin, configured in theme
This commit is contained in:
parent
adda3e6df9
commit
c6449f8fa8
6 changed files with 48 additions and 88 deletions
|
|
@ -1,4 +1,5 @@
|
|||
import preflight from './plugins/preflight'
|
||||
import container from './plugins/container'
|
||||
import appearance from './plugins/appearance'
|
||||
import backgroundAttachment from './plugins/backgroundAttachment'
|
||||
import backgroundColor from './plugins/backgroundColor'
|
||||
|
|
@ -67,6 +68,7 @@ import configurePlugins from './util/configurePlugins'
|
|||
export default function({ corePlugins: corePluginConfig }) {
|
||||
return configurePlugins(corePluginConfig, {
|
||||
preflight,
|
||||
container,
|
||||
appearance,
|
||||
backgroundAttachment,
|
||||
backgroundColor,
|
||||
|
|
|
|||
|
|
@ -22,11 +22,9 @@ function extractMinWidths(breakpoints) {
|
|||
})
|
||||
}
|
||||
|
||||
module.exports = function(options) {
|
||||
module.exports = function() {
|
||||
return function({ addComponents, config }) {
|
||||
const screens = _.get(options, 'screens', config('theme.screens'))
|
||||
|
||||
const minWidths = extractMinWidths(screens)
|
||||
const minWidths = extractMinWidths(config('theme.screens'))
|
||||
|
||||
const atRules = _.map(minWidths, minWidth => {
|
||||
return {
|
||||
|
|
@ -42,9 +40,14 @@ module.exports = function(options) {
|
|||
{
|
||||
'.container': Object.assign(
|
||||
{ width: '100%' },
|
||||
_.get(options, 'center', false) ? { marginRight: 'auto', marginLeft: 'auto' } : {},
|
||||
_.has(options, 'padding')
|
||||
? { paddingRight: options.padding, paddingLeft: options.padding }
|
||||
config('theme.container.center', false)
|
||||
? { marginRight: 'auto', marginLeft: 'auto' }
|
||||
: {},
|
||||
_.has(config('theme.container', {}), 'padding')
|
||||
? {
|
||||
paddingRight: config('theme.container.padding'),
|
||||
paddingLeft: config('theme.container.padding'),
|
||||
}
|
||||
: {}
|
||||
),
|
||||
},
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue