Override alignwide class

[nikolailehbrink]

Hi Jeffrey, I have the following problem:
I want to switch the screen sizes in tailwind.config.js to the following:
screens: { xs: "480px", sm: "600px", md: "782px", lg: tailpress.theme("settings.layout.contentSize", theme), xl: "1280px", "2xl": tailpress.theme("settings.layout.wideSize", theme), },
2xl is 1440px large.
Inside the theme.json I changed:

"layout": { "contentSize": "960px", "wideSize": "1440px" },

Now I wondered, why the max-width of alignwide is still 1280px as in your default config, so I looked up into it and found that the align- classes are changed in the tailpress plugin. Now I would have to change it inside your plugins files:

const maxWidthUtilities = { '.max-w-wide': { maxWidth: ${screens['2xl']}, }, '.max-w-content': { maxWidth: ${screens['lg']}, } };

I would have to do that inside _node_modules which is obviously not what I want and that leads to various problems. Is there something I am missing here, or what way would be the best to do it? Would be nice, if you could implement an easier way to change that

[jeffreyvr]

You aren't missing something unfortunately :) We will have to think of a different way to do this. For now I would recommend to just overwrite the styling of the particular class in your css file.