Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search

Adding Hover Actions to Nav Bar in 7.1


Recommended Posts

I'm currently using the template Barbosa in 7.1. I want to add hover actions to the nav bar so that when you hover over the pages the nav text turns from gray to pink. I also want this to happen with the all of the buttons on the page. I have not changed any styling on the page besides adding the following custom CSS.

Working CSS:

a:hover {
    color: rgb(254,64,230);
}

a#site-title:hover {
   color: rgb(254,64,230);
}

 

This css works in changing the color of the title of the page and of the hyperlinks. I thought that the a would work for the nav bar as well but apparently not. 

Thanks,

Cecelia

Link to comment
  • Replies 2
  • Created
  • Last Reply

Top Posters In This Topic

Popular Days

Top Posters In This Topic

I got the nav bar working with this code:

.tweak-transparent-header:not(.header--menu-open) .header-announcement-bar-wrapper .header-nav-wrapper a:hover {
   backgroud-color:rgb(254,64,230)!important;
}

and the body buttons working with this code:
 

.primary-button-style-solid .sqs-block-image .design-layout-card .image-button a:hover {
  background-color:rgb(254,64,230)!important;
}

Just still trying to figure out the button in the header.

 

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment


×
×
  • Create New...