Debut Theme: Making parent links in dropdown menu bold

Solved
rbelle
Tourist
31 0 14

Hi! 

I'm using Debut, and this is what my dropdown menu currently looks like. 

rbelle_0-1618912212837.png

I'm looking to make the top-level (tops, dresses, bottoms, outerwear, jumpsuits) links in bold.

Here are the current styles I've applied to the header menu according to other posts in the community.

 .site-nav .site-nav__label {
     font-family: aileron, sans-serif !important;
     font-style: normal;
     font-weight: 300;
     font-size: 1.1em;
}
.h5 a.site-nav__dropdown-link.site-nav__dropdown-link--top-level {
     font-size: 1.4em;
     letter-spacing: 0.1em;
     font-weight: 700;
}

The second block above does not seem to work. I've also tried applying it to .site-nav__child-link--parent but it does not show up either.

Still new to this, can someone please help? Thank you!

dmwwebartisan
Shopify Partner
5731 1309 1683

@rbelle 

Please share your website URL and password if any. I will check and provide a solution here.

Thanks!

If helpful then please Like and Accept Solution.
Email: dmw.webartisan@gmail.com | Instagram: @dmw.webartisan
Advanced Shopify Page Builder to customize your pages - check here PageFly App
0 Likes
rbelle
Tourist
31 0 14

Hi!

Store: https://rachel-belle-singapore.myshopify.com/

Password: rachbelle

Thank you.

dmwwebartisan
Shopify Partner
5731 1309 1683

@rbelle 

I checked your website menu. It is already in bold. Please check the screenshot below.

already-bold.jpg

If helpful then please Like and Accept Solution.
Email: dmw.webartisan@gmail.com | Instagram: @dmw.webartisan
Advanced Shopify Page Builder to customize your pages - check here PageFly App
0 Likes
rbelle
Tourist
31 0 14

It still isn't bold on my side, could it be because I'm using a different font (Aileron)?

Seems like the font that is loading for you is Montserrat. Will this be a problem for other users who do not have the font?

dmwwebartisan
Shopify Partner
5731 1309 1683

@rbelle 

Yes, it is loading the "Montserrat" font for me from body text.

If helpful then please Like and Accept Solution.
Email: dmw.webartisan@gmail.com | Instagram: @dmw.webartisan
Advanced Shopify Page Builder to customize your pages - check here PageFly App
0 Likes
rbelle
Tourist
31 0 14

I see.. sorry, but is there any way I could fix this?

 

0 Likes
rbelle
Tourist
31 0 14

Hi, sorry to bother you again!

It was previously loading Montserrat with the working font style as the theme I'm developing is not the one you were viewing.

Here's the preview of the theme where the parent links are not bold:

https://q9hy8aknp98lpoa5-55306092726.shopifypreview.com/

I've edited the CSS a little according to the working styles on my footer but I'm still unable to fix this issue.

 .site-nav .site-nav__label {
     font-family: aileron, sans-serif !important;
     font-style: normal;
     font-weight: 300;
     font-size: 1.1em;
}

.site-nav__child-link--parent{
  font-family: aileron, sans-serif;
  font-weight: var(--font-weight-header);
  font-style: var(--font-style-header);
}

Would you know what is the problem behind this and how can I bold the parent links? Thank you!

0 Likes
Pallavi
Shopify Expert
1269 174 209

Hello @rbelle
I checked your website menu. It is already in bold. Please check the screenshot below.

Screenshot :- https://prnt.sc/11wrbsl

Want to modify or develop new app, Hire us.
If helpful then please Like and Accept Solution .
Email: support@zestard.com
Shopify Apps URL :- https://apps.shopify.com/partners/zestard-technologies
Custom Modifications Into Shopify Theme | Shopify Private App | SEO & Digital Marketing
0 Likes
rbelle
Tourist
31 0 14

Hi there,

I have just published the theme that has the issue, could you kindly check it again?

https://rachel-belle-singapore.myshopify.com/

So sorry for the trouble and confusion!