Troubleshooting Class Conflicts in Webflow After Relume Transfer

Alex S. · 2024-03-11T15:42:00.128Z

Hi there. I just transferred my first relume page to webflow and the relume style guide. I made changes to the colors of my buttons, text, etc. but when I copy/paste another page from relume, Webflow says that it renamed 9 classes to avoid conflict, and the new page doesn't show changes applied to some elements. My expectations it that the text, buttons, etc on the second page, would look like on the first page I brought from relume, after I applies my branding. What's wrong about my workflow?

Troubleshooting Class Conflicts in Webflow After Relume Transfer | Relume Community

6 comments

· Sorted by Oldest

Alexander R.
·
you can download the relume extension & turn class-sync on. Cool improvement would be to have this set on default - often I start working & the first copy / paste renames all classes because of this
Alex S.
·
Thanks. It solved most of the issues, but I'm still getting one related to the button. Is this normal?
Matt J.
·
Alex S. you'll have to clean your project of all duplicate classes before you can avoid creating new ones. You can clean them up via the style manager (hit G on your keyboard) and use the UI within that panel to navigate to the various places. Otherwise, if you have literally just started, I would delete all sections, hit G on your keyboard and then hit the little broom icon top right of that panel to clean up the classes, and try again.
Alex S.
·
Thanks for your help. Just tried it, and the 'button' class from relume pages/components keeps getting renamed to 'button 2'. It's very weird, as I expect Webflow to simply apply my styles to 'button''s from relume without any issues. Why is this the only class that is problematic? It's quite frustrating.
Matt J.
·
Alex S. I was running into this issue as well and was set to record the bug for the engineering team when it suddenly started working again. I am still actively trying to reproduce what causes this. As you can maybe imagine, class sync is extremely technical - its actually not Webflow that manages this. Its our custom chrome extension. Something to try:
1.
Turn class sync on
2.
save (cmd + s)
3.
refresh
4.
turn class sync off
5.
save
6.
refresh
Then try pasting in a component to see if the button class duplicates again. As mentioned before though, you have to make absolute sure that your project is clean of any duplicate classes - its like a disease - it will not go away until you have gotten rid of it entirely. If none of this works, please let me know. Share a read-only link as well as component names that you are trying to paste - and we'll investigate it even more.
Alex S.
·
Thanks, Matt. Appreciate your help. I'll try again and let you know in case it happens again.

Alexander R.
·
you can download the relume extension & turn class-sync on. Cool improvement would be to have this set on default - often I start working & the first copy / paste renames all classes because of this
Alex S.
·
Thanks. It solved most of the issues, but I'm still getting one related to the button. Is this normal?
Matt J.
·
Alex S. you'll have to clean your project of all duplicate classes before you can avoid creating new ones. You can clean them up via the style manager (hit G on your keyboard) and use the UI within that panel to navigate to the various places. Otherwise, if you have literally just started, I would delete all sections, hit G on your keyboard and then hit the little broom icon top right of that panel to clean up the classes, and try again.
Alex S.
·
Thanks for your help. Just tried it, and the 'button' class from relume pages/components keeps getting renamed to 'button 2'. It's very weird, as I expect Webflow to simply apply my styles to 'button''s from relume without any issues. Why is this the only class that is problematic? It's quite frustrating.
Matt J.
·
Alex S. I was running into this issue as well and was set to record the bug for the engineering team when it suddenly started working again. I am still actively trying to reproduce what causes this. As you can maybe imagine, class sync is extremely technical - its actually not Webflow that manages this. Its our custom chrome extension. Something to try:
1.
Turn class sync on
2.
save (cmd + s)
3.
refresh
4.
turn class sync off
5.
save
6.
refresh
Then try pasting in a component to see if the button class duplicates again. As mentioned before though, you have to make absolute sure that your project is clean of any duplicate classes - its like a disease - it will not go away until you have gotten rid of it entirely. If none of this works, please let me know. Share a read-only link as well as component names that you are trying to paste - and we'll investigate it even more.
Alex S.
·
Thanks, Matt. Appreciate your help. I'll try again and let you know in case it happens again.