Category page layout is a page containing product list, category details, and product list actions
<aside> ℹ️ Usually, styling this element takes from-to: 3-5h
</aside>
Element is visible on all Category Pages.
<aside> ➡️ If designs have a layout switcher, both layout variants should be represented.
</aside>
Theme the CategoryPage
route.
Mainly only element placement and gaps between elements have to be adjusted in scope of this ticket.
These elements includes the breadcrumbs. The breadcrumbs are already styled by another ticket, so just check their placement and display. Also, check if it is necessary to add breadcrumbs to the mobile page. By default, the category page breadcrumbs are hidden on mobile.
<aside> ➡️ Additionally, adjustments for smaller elements may be needed.
</aside>
To style a component, override its .style.scss
file. You can also customize how it is rendered by overriding the .component.js
file.
How to override JavaScript classes?