Change font AND font color of navigation - theme brooklyn

Store Design
1

Hi there,

I am trying to change the font and font color of my navigation, I have looked at other messages in the community and applied the suggested changes, but nothing works. May I ask someone to help me troubleshoot? My website is yuvaliving.com.

Very appreciated :slightly_smiling_face:

Kind regards,

Eda

2

@Eda90 - can you please share your website link?

3

Hi Eda,
I am Sandeep and I am trying to help you.
You can change font color with this CSS

.site-header .site-nav__link { color: white !important; }

paste this code in header.liquid file and change color as per your requierment.

.site-nav__link {
font-size: 16px;

}
paste this code in theme.scss file and change font as per your requierment.
if you want to change font-family then use css font-family.

Thanks & Regards
Sandeep

4

Hi @suyash1 , thank you, that is www.yuvaliving.com.

Kind regards,

Eda

5

Hi Sandeep,

Thank you for your message, I have done what you proposed for the font color, adding the code to my header.liquid folder, and while it indeed changed the color, it broke the entire page, please see before and after screenshots. May I ask you to take a look what is causing this?

Kind regards,

Eda

Before.png
Before.png2548×1178 286 KB

After.png
After.png2656×1210 96 KB

6

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

.header-wrapper .site-nav__dropdown-link, .site-nav--has-dropdown:hover .site-nav__dropdown .site-nav__dropdown-link{color: #000;}

suyash1_0-1682260938807.png
suyash1_0-1682260938807.png1366×768 53.4 KB

7

Hi Eda,
I think there are some mistakes in the code.
Can you share the screenshot where you pasted the code?

Regards
Sandeep

8

Hi Sandeep,

Please see screenshot:

Screenshot 2023-04-23 at 15.45.40.png
Screenshot 2023-04-23 at 15.45.40.png2630×1342 340 KB

Kind regards,

Eda

9

Hi @suyash1 , I have added the code you proposed, but nothing changes. Is there another solution or can there be code that is overriding it?

Kind regards,

Eda

10

Hi Eda,
have closed tag,
paste CSS inside

This tag.

If you did same then paste entier css code with style tage befor {% schema %}

Regards
Sandeep

11

Hi @Sandeep81 , not sure I understand what you mean, would it be possible for you to send me a copy of the code instead?

Kind regards,
Eda

12

@Eda90 - I think you changed the theme

13

Hi @suyash1 , what do you mean? how can I undo that change?

14

@Eda90 - no sorry my mistake, it is clear now

15

Hi @suyash1 , I don’t understand. Your provided solution didn’t help. Would you be able to help out?

16

Hi Eda,

I have to check your code to Fix your issue.
If you trust me, you can take my help

Sandeep81_0-1682262058277.png
Sandeep81_0-1682262058277.png868×577 20.9 KB

Regards
Sandeep

17

@Eda90 - right now menu is white, what color do you want?

18

Hi @suyash1 , I need it to be black, and I also need to change the font, so 2 changes:

  • Change color from white to black

  • Change font (I want to check out different options, therefore it would be great if you can show me where to adjust it so that I can do it)

19

Hi Sandeep, yes please, how can I give you permission to do that?

20

I believe you have set it to white from customize settings, if you can
change it from there it will work better