Inheritance menu w/ separate classes? Why are mine stacking? 🤔

[smallio (Will Small)]

Hey guys,

Rebuilding this at the moment - https://webflow.com/website/background-colour-transition

Here’s my link - https://preview.webflow.com/preview/socialeyes-js?preview=75b18c375996332f9e0dc28b8a1f0a73

When you view the classes of the Colour’s children you see one class, for example ‘col purple’ now go back to your layers and view the children again the the layers panel. There are 4 sections called ‘col’ each styled with their own colour class ‘col purple’ for example can only be edited if you click the inheritance menu.

Here is the problem I have - My classes appear as combo classes where as the example above that I’m copying from appear separate. I need to have all of the Colour sections called “col” for the fade to work but with a second class to dictate separate colours and styling for each. This is effecting my interactions as the second class I make won’t show up in ‘effect different element’ & therefore the transitions won’t work.

The example classes look like this:

My classes look like this

What am I doing wrong?

---

Here is my public share link: LINK
(how to access public share link)