Target all elements in container on hover

Hello,

I want to change the background color of a button and its icon in a container when hovering over this container (like here: https://postimg.cc/0McMgXJD).
I tried with Generateblocks Pro but the color only changes when you hover over the button, not the whole container. I found a way to do this with CSS classes, but I’m not sure I’m doing the right thing.

I added the hover-container CSS class to my container and 2 CSS classes to the button (hover-button hover-icon) and then added this code:

.hover-container:hover .hover-button {
  background-color: var(--global-color-9);
}
.hover-container:hover .hover-icon {
  color: white;
}

Is this the right way to do it? Or is there a way to do this without CSS classes in Generateblocks?

Thanks!