So is there currently any way to toggle a class based on if a switch is on or off. For example, I have the following
and when the switch is on in the record I want it to drop the opacity of the element but that means having a class toggle so is there a way to add a class to switched records?
No, but you can duplicate the element, edit its opacity, and use Conditional Visibility to display one or the other depending on the switch state.
When I use this technique, I make the element a symbol, I wrap it inside of a div, and duplicate this div instead. So if I edit the content of the element later, i don’t have to do it twice.
I’m just going off what Vincent said, I don’t believe I should need a symbol just going off the response.
The “cards” are using the CMS and the content from the table, example the image
All I’m trying to do here is to simply drop the opacity on coming soon items. At a pure code level. this wouldn’t be an issue, however, this project is in webflow.
It’s always helpful for the community to assist if you can share your read-only project link.
Without being able to look at your site structure, here is my suggestion.
Inside of the Collection Item, duplicate your card element. You will now see double or two cards inside each item. Add a combo class of coming-soon to one of the cards. On the combo class cardcoming-soon adjust the opacity or any of the other css in the styles panel. Now add conditional filtering to show/hide the appropriate card based on the switch.
card
condition: visible when “coming soon” switch is off
cardcoming-soon
condition: visible when “coming soon” switch is on
style: adjusted opacity
This method should work as long as you’re not using the cms item container as the card itself. If you need further instruction, it would be great to get a link to the project. Also below is a link to using conditions if you need it. Hope this helps.