Problem/Motivation

Much of the styles in main.css are for typography, and we also have a large blob of Tailwind classes on the text component to style the standard elements.

Ideally we can refactor to use https://v1.tailwindcss.com/docs/typography-plugin instead, and remove all of the custom styles.

CommentFileSizeAuthor
#2 2026-03-05T102315.jpg3.12 MBsimon_who

Comments

pameeela created an issue. See original summary.

simon_who’s picture

simon_who
Location Canberra
commented
StatusFileSize
new 2026-03-05T102315.jpg3.12 MB

Hello @pameela, just a couple of thoughts before we proceed: though using the @tailwindcss/typography plugin may sound very quick and clean, it may slow people down as they try to diverge from the default styling, as the styling are no longer clearly written from the src/main.css . Please correct me if I'm wrong, but from the look of it (by just installing @tailwindcss/typography and a index.html and inspecting over the heading 1 component), overriding the styling of @tailwindcss/typography seems to involves very long classname and potentially complicated specificity resolving in some cases (see screenshot below)

Please let me know how you think about this.
I'd also be happy to work on this issue if you want to proceed

pameeela’s picture

pameeela commented

@simon_who funny timing, I actually looked at this yesterday for the Haven theme. I had Cursor do a pass at a refactor and my conclusion was that I am not sure it's worth it! The styling works well as it is and this would not only cause regressions but would require a bunch more custom stying, as you pointed out.

I'll discuss with the team and see what they think. Thank you for your input!

simon_who’s picture

simon_who
Location Canberra
commented

Sure is haha, I may not even see this issue anymore if I'm too late to the party I assume 😆
I’ll hold off for now and wait to hear what the rest of the team thinks !