Hello @Sivadarshan , Try this
span.mobile-facets__open-label.button-label.small-hide,
.facet-filters__sort,
.facet-filters__field,
h2.product-count__text.text-body {
text-transform: uppercase;
}
Topic summary
Goal: Convert collection page filter and sort UI text to uppercase (and make the controls sticky).
What was tried:
- Multiple replies advised editing theme code: Online Store > Themes > Edit code > Assets > base.css.
- CSS added to apply text-transform: uppercase to filter/sort elements, including selectors such as .mobile-facets__open-label, .facet-filters__sort, .facet-filters__field, .select__select, and product count text.
- Screenshots were provided showing the uppercase result.
Outcome:
- Uppercasing works as confirmed by the requester.
Current issues / open items:
- Changing the font size does not affect the sort control; the requester reports only the sort section ignores the size change. No fix posted yet (may require a more specific selector or override, but not addressed in the thread).
- The “sticky” requirement mentioned initially was not covered by the provided solutions.
Status: Partially resolved (uppercase achieved). Font-size for sort and sticky behavior remain unresolved/awaiting further guidance.