Configuring Relume React Components with Astro

At a glance

The community member is trying to use Relume React components with Astro, and is facing some configuration challenges. They find the Tailwind color configuration confusing, with the primary button background being set to an alternative color, and the border being set to the primary color. They also feel that some options like button and image border radius, and shadow, are missing. To set up the components, they need to modify the code each time, create a subclass or component, which is a pain. The community member would prefer if almost everything could be configured from the Tailwind config, so that when they copy a component from the library, they only need to change the text, not the style.

Other community members express similar frustrations, wishing the HTML version included interactions using CSS and vanilla JS, and finding the custom Tailwind config complicated to modify. They suggest that it might be possible for the library to add at least some of the missing settings, which would require using custom Tailwind classes in the components, but would still require changes.

ŁŁukasz Miłoś

✌ Oh, hello!
I am trying now to use Relume React components with astro - if i can html only, if some of interactions required - react. I love the library, but honestly I am just a little bit confused with a configuration. Colors are hard to understand - there are a lot of variables in tailwind config - for primary button background is alternative, but border is primary, why? In my opinion there are also missing some options like button and image border radius, shadow, etc. Now If I wanna to set this up need to change it each time, create a subclass or component - but in every situation i need to modify the code. I would love if almost everything could be configured from tailwind config and if I copy component from library - just need to changed the text, not style too. Any suggestions?

2 comments

DDhondup Lama

😮 I am exactly in the same boat! I wish the HTML version also included the interactions using CSS and vanilla JS.

The custom tailwind config made it a bit more complicated to modify anything. Modifying code is a pain.

ŁŁukasz Miłoś

Do you think it's possible for them to add at least some of these settings? That would require custom tailwind classes to be used in the components, which is apparently not difficult, but requires changes.

Add a reply

Community forum for knowledge and support

Configuring Relume React Components with Astro