Question: How can I make sure that once the icon is hovered, a clickable element appears on the right side, next to the icon? Just like how the bubble tool box is placed next to the icons on the sidebar menu.
Create a group focus item, which will hold the appearing items
Create an icon
Create a group with background colour set to none and no elements inside and set border to none so it is effectively invisible to the user and uncheck its “Visible on page load” option so it is not even shown on first loading.
Then set the group´s condition to be visible when Icon is hovered, OR groupfocus is hovered.
Then create a workflow that triggers when a condition is true: as shown in the below image first section(5th menu item) and set the condition to be when group is visible then trigger… and as an action make the groupfocus show (or as I did, animateIN)
Then create a second workflow that HIDES (or animatesout) the group focus which action is triggered when the group is NOT visible.
@decntdefalt This is one of those tricky Bubble things you only learn over time. What you’re trying to do is use the conditions on the Icon itself, which makes sense at first. You’re trying to say, “When this thing is hovered, do this other thing.” The way Bubble works, however, is in reverse.
You’ll actually go to the group you want to show/hide, and use the conditional panel to say, “When that other icon is hovered, then make changes to me.” This is exactly what @chris7 is describing in his example, so follow those steps and it should work!