Venture Theme - change links in the header menu

Store Design
1

Hi,

Please can someone assist me.

In the Venture theme, the links in the menu in the header are grey and when the mouse hovers over the link becomes white. If the link is selected then it stays white and there is a blue bar underneath.

I would like to make the following changes:

  1. All links are white (before hover).

  2. If mouse hovers on a link then the link stays white but there is a blue bar underneath the link.

  3. If the link is selected then it stays white and there is a blue bar underneath (no change needed for this).

Thanks in advance.

My site is www.electricrideco.com

2

@guyv - please add this css to the very end of your theme.scss file and check

.site-nav__link {color: rgba(255, 255, 255, 1);}

.site-nav__item:hover .site-nav__link:after {
    content: '';    position: absolute;    bottom: 0;    left: 20px;
    right: 20px;    height: 3px;    background-color: #006eff;
}
1 Like
3

@suyash1

That’s perfect! Thanks a lot!

One more question if you don’t mind - what do I need to add to the code to make the font for the links bold?

4

@guyv - font is already bold

5

@suyash1

It was bold previously but after adding the new code it is not bold.

Before:

Screen Shot 2022-02-21 at 4.42.47 PM.png
Screen Shot 2022-02-21 at 4.42.47 PM.png1277×214 49.4 KB

After:

Screen Shot 2022-02-21 at 4.42.22 PM.png
Screen Shot 2022-02-21 at 4.42.22 PM.png1280×226 16.7 KB

6

@guyv - the code I give you can not change font-weight, I checked site too , it is looking fine and bold

but try by adding this too

.site-nav__link {font-weight: bold !important;}
1 Like
7

@suyash1

Thanks! I noticed that the difference is between Firefox and Chrome. In Firefox the font is clearly bold but in Chrome it is not very bold. Must be a browser setting. Thanks again for your help.