Themeable Button Hover

[Bucky108]

Looking at the template "Future City" it has a neat feature using a sticky layer and themeable buttons which appear on the right side of the screen.
The buttons use a right side padding value of 48 so that only the left side of the button appears. Then "hover" triggers a transform transition which shows the entire button.

I'm missing how this happens. In the themeable button properties dialog there is no animations tab. I could find no additional HTML that was added in the button object or for the page. And there's no defined style that would also trigger the hover. And yet looking at the CSS file for the page, it's clearly there:

#ThemeableButton2:hover
{
transform: translate(-100px,0px) rotate(0deg) ;
transition: transform 500ms ease-out 0ms;
}

To test this further I created a completely new, blank website and copied and pasted just one of the buttons, with no other elements on the page. Same behavior.

What am I missing?

[Pablo]

This effect has been implemented using transitions and transforms.
https://www.wysiwygwebbuilder.com/transitions.html

[Bucky108]

Yes, I know that but as I mentioned themeable buttons do not have an animations tab.

[Bucky108]

Wow I just found out that the animations button is not displayed in the standard (not ribbon) interface.

I switched to the ribbon interface and saw it there.. Never mind!

[Pablo]

In the menubar interface, you can access animations via Menu -> Edit -> Animation and Transitions

Or via the Property Inspector

[Bucky108]

What threw me off is that there's no animations tab for the themeable button like there is, for example, for the regular button.

[Pablo]

I will investigate if this can be added in a future update.

[Bucky108]

That would be great, thanks.