You've already forked wc-bootstrap
Switch from custom link classes to Bootstrap's native list-group-item-action pattern. Replace bold primary-colored active background with subtle tertiary background, left accent border, and semibold text. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
33 lines
1.1 KiB
Twig
33 lines
1.1 KiB
Twig
{#
|
|
# Product Category Tree (Bootstrap 5)
|
|
#
|
|
# Renders a hierarchical product category navigation using Bootstrap
|
|
# list-group with nested sub-lists and action links.
|
|
#
|
|
# Expected context:
|
|
# categories - Hierarchical array from wc_bootstrap_get_category_tree()
|
|
# shop_url - URL to the main shop page
|
|
# current_cat - Term ID of the currently viewed category (0 = shop page)
|
|
#
|
|
# @package WcBootstrap
|
|
# @since 0.1.7
|
|
#}
|
|
|
|
{% if categories is not empty %}
|
|
<nav aria-label="{{ __('Product categories', 'wc-bootstrap') }}">
|
|
<h3 class="sidebar-heading h6 text-uppercase fw-semibold">
|
|
{{ __('Categories', 'wc-bootstrap') }}
|
|
</h3>
|
|
|
|
<div class="list-group list-group-flush category-tree">
|
|
<a href="{{ shop_url }}"
|
|
class="list-group-item list-group-item-action border-0 px-2 py-1{% if current_cat == 0 %} active{% endif %}">
|
|
{{ __('All products', 'wc-bootstrap') }}
|
|
</a>
|
|
{% for cat in categories %}
|
|
{% include 'global/category-tree-node.html.twig' with { node: cat, level: 1 } only %}
|
|
{% endfor %}
|
|
</div>
|
|
</nav>
|
|
{% endif %}
|