How to Bold Text in Turbo Mega Menu

blh76820
Tourist
10 0 3

Hi,  I have the Turbo theme from Out of the Sandbox. I am trying to figure out how to only bold the Menu titles in each column, and leave the sections under the menus normal text weight.

Example, hover your mouse over the main menu, on the menu item (Trending) should appear in bold, and then the style categories below it (Summer Fashion, Tie-Dye, Prints, etc) would be normal weight. Can anyone please assist? Thank you in advance. 

mega menu.PNG

dmwwebartisan
Shopify Partner
8442 1978 2658

@blh76820 

Please share your store URL.

If helpful then please Like and Accept Solution | Email: dmw.webartisan@gmail.com | Instagram: @dmw.webartisan
Check here PageFly App to customize your pages | Bag is a cart drawer that maximizes your sales. View app →
0 Likes
dmwwebartisan
Shopify Partner
8442 1978 2658

@blh76820 

Please add the following code at the bottom of your assets/styles.scss.liquid file.

 

#mobile_nav ul li a:hover, #nav ul li a:focus, #nav ul li a:hover, #nav ul li:focus a, #nav ul li:focus a.sub-menu--link, .slicknav_btn{
font-weight: bold !important;
}

 

Hope this works.

Thanks!

If helpful then please Like and Accept Solution | Email: dmw.webartisan@gmail.com | Instagram: @dmw.webartisan
Check here PageFly App to customize your pages | Bag is a cart drawer that maximizes your sales. View app →
0 Likes
blh76820
Tourist
10 0 3

I added the code in assets/styles.scss.liquid at the bottom, but unfortunately it didn't change the text style to bold.

0 Likes
blh76820
Tourist
10 0 3

I added the code in assets/styles.scss.liquid at the bottom, but unfortunately it didn't change the text style to bold

dmwwebartisan
Shopify Partner
8442 1978 2658

@blh76820 

Can you try to add this again?

#mobile_nav ul li a:hover, #nav ul li a:focus, #nav ul li a:hover, #nav ul li:focus a, #nav ul li:focus a.sub-menu--link, .slicknav_btn{
font-weight: bold !important;
}

  

If helpful then please Like and Accept Solution | Email: dmw.webartisan@gmail.com | Instagram: @dmw.webartisan
Check here PageFly App to customize your pages | Bag is a cart drawer that maximizes your sales. View app →
0 Likes
blh76820
Tourist
10 0 3

Unfortunately that didn't work either. I did change the code a tiny bit when it didn't make any changes, and now the horizontal menu section bold when highlighted, but I'm needing the sections in the Mega Menu to be permanently bold. Here is the code so far, with the small changes I made. 

blh76820_0-1626929443981.png

 

0 Likes
dmwwebartisan
Shopify Partner
8442 1978 2658

@blh76820 

Please add the following code at the bottom of your assets/styles.scss.liquid file.

 #mobile_nav ul li a, #mobile_nav ul li a:active, #mobile_nav ul li a:visited, #nav ul li a, #nav ul li a:active, #nav ul li a:visited, .mobile_currency select, a.slicknav_btn {
    font-weight: bold !important;
}

Thanks!

If helpful then please Like and Accept Solution | Email: dmw.webartisan@gmail.com | Instagram: @dmw.webartisan
Check here PageFly App to customize your pages | Bag is a cart drawer that maximizes your sales. View app →
0 Likes
blh76820
Tourist
10 0 3

That made everything bold in menu outside of the Mega Menu. I need the menu titles inside the mega menu bold, but not the menu items. 

0 Likes