Mobile Responsiveness Issues with Relume Components in Webflow

·Apr 07, 2024 12:17 PM

Hi team, got a few issues with Relume components in Webflow for mobile responsiveness. In the webflow editor, I can see my navbar hamburger menu has an icon, but when accessing the site through the domain on my phone it's invisible? I'm using navbar 5. Also, with layout 416, the cards border is there, but on the actual site it's not. Can someone please help me out? I can't figure out why these issues are happening. Read only link

11 comments

· Sorted by Oldest

Maria
·
I’m seeing this issue as well. The menu icon also doesn’t look right - it’s not showing one of the lines. Matt J.
Maria
·
I’m using the Relume Style Guide, so that shouldn’t be the issue. Seems like others have had this problem recently as well.
Maria
·
I was actually just able to fix this. Seems like the issue was with variables. The background color for each menu icon line was empty, so I reset it and applied a variable.
🙌1
Matt J.
·
Maria I know you said you resolved it but would you mind sharing a read only link?
Matt J.
·
Dom N. where did you copy navbar 5 component from? Site Builder, Library, Extension or Webflow app?
Dom N.
·
Matt J. from the Library
Matt J.
·
Dom N. ah it appears its the same issue that Maria pointed out - you are missing the variables. In this case its because you've renamed the variables I believe. You'll need to reset the background color and set one of your variables.
Maria
·
Dom N. Matt J. This was exactly the issue I discovered. It was fixed once I reset and applied a variable. I’ve seen “missing” variables (e.g., an empty color) in other components previously and was confused by it, but now it makes sense.
Matt J.
·
Maria okay so you had renamed some of the base brand color variables you are saying yeah? If so, yeah that may cause an issue - but only if you are renaming the black/white colors which is what we use - we don't define or use any other colors (intentionally).
Maria
·
Matt J. Yes, I think something like that happened. I think I moved the white and black to a different group. They are now in ‘Base Color - Neutral’ instead of ‘Base Color - Brand’. Or, I just deleted them altogether before adding them back. Don’t remember exactly as that was last week, but glad I figured out the problem
🙌1
Dom N.
·
Matt J. Maria Ahhh okay makes sense. Thanks for your help guys, much appreciated. And I assume it'd be the same issue for the layout 416 card borders?

Mobile Responsiveness Issues with Relume Components in Webflow | Relume Community