Symmetry Theme Salt Yard Header Font Size

Store Design
, ,

Topic summary

A user needed to adjust font sizes in the Symmetry theme’s Salt Yard preset, where right-hand header links (Account, Search, Cart) displayed at a different size than left-hand navigation links.

Problem: The theme’s built-in typography settings didn’t provide controls for this specific element.

Solution provided:
Target the right-side header elements with CSS:

.logo-area__right .header-account-link__text,
.logo-area__right .show-search-link__text,
.logo-area__right .cart-link__label {
    font-size: 14px;
}

Outcome: The CSS successfully matched the font sizes without affecting other site elements. The issue was resolved and marked as solved.

Summarized with AI on October 31. AI used: claude-sonnet-4-5-20250929.
1

Hello.

I am using the Salt Yard preset within the Symmetry theme here:

https://themes.shopify.com/themes/symmetry/styles/salt-yard/preview

As you can see, the right-hand links are set to a different size than the left.

Store Our Story Magazine About Demos

Account Search Cart

Does anyone know which CSS to target to make the right-hand links the same size as the left-hand ones (without breaking anything else on the site)? or vice versa so I get them the same size.
The settings within the typography element of the theme editor do not cater for this.

Thanks for your help.

2

Hi @Alfonce ,

You can try this css:

.logo-area__right .header-account-link__text,
.logo-area__right .show-search-link__text,
.logo-area__right .cart-link__label {
    font-size: 14px;
}

It only affect to text, not anything else

1 Like
3

Hey this works.

Thanks for that :slightly_smiling_face:

I think it is scaling relatively from the root css and I guess based on a media screen calculation.

4

Hi @Alfonce , so great when hear it works. Let’s like and accept my solution to close question. Thank you :hugs: