Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Ability to have responsive .container padding #1398

Merged
merged 1 commit into from Apr 17, 2020
Merged

Ability to have responsive .container padding #1398

merged 1 commit into from Apr 17, 2020

Conversation

OwenMelbz
Copy link
Contributor

@OwenMelbz OwenMelbz commented Feb 26, 2020

Briefly mentioned via Twitter about this: https://twitter.com/OwenMelbz/status/1232404123041107975

This expands the ability of the padding option on the container plugin.

Before you had to option to set a global padding on the container via

theme: {
  container: {
    padding: '2rem',
  },
},

This allows you the option to provide an object of screen names which represent breakpoints and allows a different padding per breakpoint instead e.g.

theme: {
  container: {
    padding: {
      default: '1rem',
      sm: '2rem',
      lg: '4rem',
      xl: '5rem',
    },
  },
},

A side note around this, I'm not massively familiar with creating tailwind/postcss plugins so I appreciate that the way the logic has been written may not be what you'd consider as "best" for Tailwind, I may have even recreated the wheel for certain functionality - so more than happy for it to be refactored into a more satisfactory style.

Thanks!

@adamwathan adamwathan merged commit 3584791 into tailwindlabs:master Apr 17, 2020
@adamwathan
Copy link
Member

Thanks 👍🏻

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

2 participants