Implement Phase 1: global templates and notices (Bootstrap 5)

Add 9 Twig template overrides for WooCommerce's global and notice templates:
- global/wrapper-start, wrapper-end: conditional container with _theme_wrapped
- global/breadcrumb: Bootstrap breadcrumb component with aria-current
- global/sidebar: offcanvas-lg for mobile, standard aside for desktop
- global/quantity-input: input-group with +/- buttons
- global/form-login: responsive form with form-control, form-check
- notices/notice, error, success: Bootstrap alert-dismissible with icons

Supporting changes:
- assets/js/quantity.js: +/- button handler respecting min/max/step
- assets/css/wc-bootstrap.css: WooCommerce notice fallback styles, spinner removal
- functions.php: register quantity.js script

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
2026-02-28 10:19:10 +01:00
parent 9592b8cae5
commit 01b807a769
14 changed files with 477 additions and 16 deletions

View File

@@ -0,0 +1,34 @@
{#
# Error Notice (Bootstrap 5 Override)
#
# Displays WooCommerce error notices as a Bootstrap 5 danger alert.
# Multiple errors are shown as a list within a single alert.
#
# Expected context:
# notices - Array of notice objects, each with:
# notice - Notice HTML content (pre-sanitized via wc_kses_notice)
# data - Optional data attributes string
#
# WooCommerce PHP equivalent: notices/error.php
#
# @package WcBootstrap
# @since 0.1.0
#}
{% if notices is defined and notices|length > 0 %}
<div class="alert alert-danger alert-dismissible fade show woocommerce-error" role="alert">
<i class="bi bi-exclamation-triangle me-2" aria-hidden="true"></i>
{% if notices|length == 1 %}
{{ notices[0].notice|raw }}
{% else %}
<ul class="mb-0 ps-3">
{% for notice in notices %}
<li {{ notice.data|default('')|raw }}>
{{ notice.notice|raw }}
</li>
{% endfor %}
</ul>
{% endif %}
<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="{{ __('Close') }}"></button>
</div>
{% endif %}

View File

@@ -0,0 +1,27 @@
{#
# Info Notice (Bootstrap 5 Override)
#
# Displays WooCommerce info/neutral notices as Bootstrap 5 alerts.
#
# Expected context:
# notices - Array of notice objects, each with:
# notice - Notice HTML content (pre-sanitized via wc_kses_notice)
# data - Optional data attributes string
#
# WooCommerce PHP equivalent: notices/notice.php
#
# @package WcBootstrap
# @since 0.1.0
#}
{% if notices is defined and notices|length > 0 %}
{% for notice in notices %}
<div class="alert alert-info alert-dismissible fade show woocommerce-info"
{{ notice.data|default('')|raw }}
role="status">
<i class="bi bi-info-circle me-2" aria-hidden="true"></i>
{{ notice.notice|raw }}
<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="{{ __('Close') }}"></button>
</div>
{% endfor %}
{% endif %}

View File

@@ -0,0 +1,27 @@
{#
# Success Notice (Bootstrap 5 Override)
#
# Displays WooCommerce success notices as Bootstrap 5 success alerts.
#
# Expected context:
# notices - Array of notice objects, each with:
# notice - Notice HTML content (pre-sanitized via wc_kses_notice)
# data - Optional data attributes string
#
# WooCommerce PHP equivalent: notices/success.php
#
# @package WcBootstrap
# @since 0.1.0
#}
{% if notices is defined and notices|length > 0 %}
{% for notice in notices %}
<div class="alert alert-success alert-dismissible fade show woocommerce-message"
{{ notice.data|default('')|raw }}
role="alert">
<i class="bi bi-check-circle me-2" aria-hidden="true"></i>
{{ notice.notice|raw }}
<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="{{ __('Close') }}"></button>
</div>
{% endfor %}
{% endif %}