Some inconsistencies in behavior and shadow on interactions not working

Hello Team, I just ran into some things, it looks like that shadow on hover is not working when I set the shadow to transparent on hover, nothing seems to change.

Also,

Some inconsistencies in links, I can’t seem to get two out of the 3 used icons to work proper on hover the cursor is not changing into the hand on some of the links.

I tried by copying and pasting the styles of the working div and icons but that also didn’t help.

Video that makes things clear.

1 Like

To add to this, there are some differences in styles how they look in the builder and on the front-end. (See screenshots) the transparency from the slides is not being output on the front-end

1 Like

I can confirm thattransparent is not working.

You can use rgba(0, 0, 0, 0) instead, for now.

3 Likes

@SchoonhovenOntwerpStudio, I have tested the situation outlined in your initial message regarding the use of transparent on interaction states for box-shadow and text-shadow controls and can confirm it’s not updating as appropriate. I have noted this down to be looked into.

With regards to your icon cursor issues and the transparency of your slides as you mentioned later on, I would need login credentials to your website to look into these as I cannot replicate these situations locally.

Thank you!

Just created the login in a secure note

Thank you!

@SchoonhovenOntwerpStudio, had a moment to look into this just now and I’ve got some feedback for you on the items you mentioned above.


#1 With regards to the color transparency not working, this is as I suspected. It appears you’re using a global color for those slides, and then using the alpha slider to bring in the transparency level you want. This is something I need to document more clearly, but at this time if you plan on using alpha transparency along with your global colors, the global color must be an rgba() value due to how the parser works to break apart these values. So if you simply go to your global color palette and change your “White” color from #ffffff to rgba(255, 255, 255, 1), you should find that this starts working as you would expect.


#2 With regards to your navigation links not having a cursor when you hover over the icons of the 2nd and 3rd link, this is because you have the <a> tag turned on for the wrapping Div Element around the Icon and Headline, but you do not have any links in them. Your first item has the <a> tag on the Div Element turned on and an href provided, which is why it works. Your 2nd and 3rd only have a link on the nested Headline Element, which is why their sister Icon Elements are not changing to a cursor on hover. If you add an href to the parent Div Element like the first link, then you will have the behavior you’re after.


Hopefully that helps! Cheers!

Oh no, looks like I need to look into the mirror to find the inconsistent behavior, sorry Kory and thanks for looking into it - Fixed for beta4

No worries!