Skip to main content
jared2095
Contributor ⭐️⭐️⭐️
May 28, 2020
Released

Button hover color

  • May 28, 2020
  • 4 replies
  • 211 views

I’d like the option in Engagements to edit the hover state for buttons. Specifically, edit the background color, border color, and font/text color.

4 replies

kate_green
Helper ⭐️⭐️
May 28, 2020

Hi Jared - You can change the styling of the hover state for buttons using the CSS selector as shown below: 

In the screenshot I have hovered my cursor over the End Tour button, and it changes the color as indicated in the styling written above.

I used the flag !important in the CSS styling document to override the default settings.  You can see I also used the !important flag in the border-radius attribute of the buttons, which is why they look more rounded.

 

Let me know if you have other questions about this process.  There will be some detailed documentation on CSS styling coming soon.  

 

jared2095
jared2095Author
Contributor ⭐️⭐️⭐️
May 28, 2020

Is it possible to do this when the engagement type is a survey? when i edit the CSS there’s no section for /* step button */ but i do have a single button for advancing to the next step

kate_green
Helper ⭐️⭐️
May 28, 2020

The button class name for survey buttons is .submit-button and you can add that into the bottom of the existing CSS document:

 

.submit-button{
  background-color: #bd28ef !important;
}

.submit-button:hover{
  background-color: #ed6028 !important;
}
 

 

 

broghanzwack
Contributor ⭐️⭐️⭐️⭐️⭐️
January 10, 2024
New Idea→Released