30 行
950 B
JavaScript
30 行
950 B
JavaScript
import autoprefixer from 'autoprefixer'
|
|
import tailwindcss from 'tailwindcss'
|
|
|
|
// Apply the same breakpoints to handwritten CSS and Tailwind utilities.
|
|
export const inlineBreakpoints = {
|
|
postcssPlugin: 'inline-breakpoints',
|
|
OnceExit (root) {
|
|
const queries = []
|
|
root.walkAtRules ('media', query => {
|
|
if (/\b(?:min|max)-width\s*:/.test (query.params))
|
|
queries.push (query)
|
|
})
|
|
for (const query of queries) {
|
|
const vertical = query.cloneAfter ({
|
|
params: query.params.replace (/\b(min|max)-width(?=\s*:)/g, '$1-height') })
|
|
for (const [branch, scope] of [
|
|
[query, ':where(html:not(:lang(mn-Mong)))'],
|
|
[vertical, ':where(html:lang(mn-Mong))']]) {
|
|
branch.walkRules (rule => {
|
|
rule.selectors = rule.selectors.map (selector => `${scope} ${selector}`)
|
|
})
|
|
}
|
|
}
|
|
},
|
|
}
|
|
|
|
export default {
|
|
plugins: [tailwindcss (), inlineBreakpoints, autoprefixer ()],
|
|
}
|