Maybe we can find a workaround for the time being, can you give me a better example of your workflow? in the simplest form:
- I click this
- then do this
- then do this
- Duplicate cloneable project which uses Client-First tokens with Craft variables
- Paste a component from Relume
Problem: new tokens are duplicated, not gaining the Craft variables
I think all is needed is a way to check if the token exists, if so use it and don't create a new one. I think this should be a default in Webstudio, if there was a way to clear unused tokens.
For a "quick" workaround, I'm currently manually converting the Relume library to a modified version of Craft
pasting component from relume? how are these supposed to work with craft, relume is a completely different library, external to webstudio, it doesn't know any css variables existing in webstudio
"Client-First tokens" what are projects which use client-first tokens with craft variables? where are you getting that?
Let me guess, because this isn't making any sense:
- you inserted craft library
- you pasted client-first section from relume
- then you modified relume sections to use craft variables
- now you are pasting relume sections and these insert new tokens and not reusing your modified tokens
Is this the flow?
Ok I just tried to reproduce what I described above and I can't.
I need precise step by step, super simple to repeat, not made up based on complex steps you had in mind from the project but literally, please go and do your steps on an empty project, then share the steps and share that project.
This is the part that matters
I get that, I was trying to understand the exact workflow
But to answer your question,
- I pasted the Relume style guide into Webstudio
- Replaced most styles with Craft variables
- Pasted in a section from Relume, and the styles from the classes overwrote the variables.
I think the reason is that relume's style guide, the classes don't match by id the classes from sections.
Maybe we can fix it by treating classes like ids, using class itself as a unique identifier and so when they match, pasted one doesn't get added
can you share some project that's already prepared, so I don't have to?
This is just the unedited Relume style guide and hundreds of unedited sections
@Oleg Isonen I just had a look at the project Seth shared. It is super slow to browse.
I will look how to improve performance
wow, is this thouthands of relume components pasted into one project?
I am super impressed we can even handle this many components on every single page. I don't think the product was even designed to do this stuff. Essentially you are trying to copy all relume components which has thouthands and cancel their subscription, which is understandable that you want this but I wouldn't expect us to support this in terms of performance.
I would love you to try this on webflow to see when their builder starts struggling hard 🙂
I have no need for such collections.
Then again, I would not call single pages with 50 components unreasonable. Such could be a long one-pager with complex, interactive storytelling.
Maybe Bogdan can use this as a benchmark project to load large pages incrementally.
we have a very big landing page with no perf issues, this project is taking it to the next level, we will look into what can be done quickly but won't spend engineering days.
webstudio.is website is quite big, including the landing page that's very long
It is not my collection and it's not a feature request. I only had a brief look at this shared project and wanted to make you aware of performance limits.
Yes totally understand, I am saying this to set expectations for everyone in the room, not responding directly to you 🙂
back to the original topic
Pasted in a section from Relume, and the styles from the classes overwrote the variables.
@Seth I don't understand how to reproduce this and giving up.
Go through your own steps and try to reproduce it from scratch on a clean project. Then you will see why I can't.
We match tokens by internal id, I assume you have a scenario where internal ids don't match, but I need a clear reproduction of the scenario with a specific workflow. Otherwise I won't dedicate resources fixing it.
I don't mind paying for their subscription! My plan is to slowly adapt their library to a modified version of Craft, so I can build better sites faster. Once each section is adapted, I plan to store the clipboard data in Baserow, create an interface similar to Relume, with buttons to copy the clipboard data with the proper mime type & json.
don't share it with public though, relume will consider it stealing if you share it with other users
@Oleg Isonen does this properly explain the issue?
Sorry, got distracted, will look again
Hey, I will follow this too. I would like to find a good workflow with Relume/Flowbase and Webstudio/Craft to speed up my website creation.
