Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Tailwind negate responsive breakpoints
<div class="flex !md:flex-col items-center !md:space-y-6 md:space-x-6">
<button>Menu button 1</button>
<button>Menu button 2</button>
<button>Menu button 3</button>
</div>
const defaultTheme = require('tailwindcss/defaultTheme')
module.exports = {
theme: {
extend: {
screens: Object.keys(defaultTheme.screens).reduce((obj, key) => {
const [rawMin] = defaultTheme.screens[key].split('px')
const max = parseInt(rawMin) - 1
obj[`!${key}`] = { max: `${max}px` }
return obj
}, {}),
},
},
}
@Tahul

This comment has been minimized.

Copy link

@Tahul Tahul commented Jan 6, 2021

Thanks 👍

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment