Prepare v0.1.1 bugfix release

Update CHANGELOG.md with v0.1.1 entry (dark mode selects, notice
styling, product card overflow). Bump version in style.css. Document
CSS specificity learnings in CLAUDE.md. Update README release example.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
2026-02-28 19:32:34 +01:00
parent e234ba6449
commit d72bb388ea
4 changed files with 35 additions and 4 deletions

View File

@@ -2,6 +2,18 @@
All notable changes to this project will be documented in this file. All notable changes to this project will be documented in this file.
## [0.1.1] - 2026-02-28
### Fixed
- Dark mode: native `<select>` elements showing white background due to WooCommerce's `--wc-form-color-background` falling back to `#fff`
- Dark mode: SelectWoo/Select2 dropdowns (country/state pickers) rendering with hardcoded `#fff` backgrounds, text colors, and borders
- Dark mode: checkout form focus ring color for inputs, textareas, and selects
- WooCommerce notice borders not matching Bootstrap alert styles due to insufficient CSS specificity (bumped to `.woocommerce .woocommerce-*` at `0,2,0`)
- WooCommerce notice `border-top: 3px solid` and `background-color: #f6f5f8` overriding Bootstrap alert colors
- Double icons on WooCommerce notices (WooCommerce icon font `::before` conflicting with Bootstrap Icons)
- Product card images overlapping top rounded corners on catalog page (added `overflow-hidden` to card)
## [0.1.0] - 2026-02-28 ## [0.1.0] - 2026-02-28
### Added ### Added

View File

@@ -228,6 +228,9 @@ Recurring bugs and non-obvious behaviours discovered across sessions. **Read thi
- `overflow: visible !important` on `.wp-block-navigation__container` is essential for dropdowns inside block theme navigation. - `overflow: visible !important` on `.wp-block-navigation__container` is essential for dropdowns inside block theme navigation.
- **WooCommerce `shop_table` borders conflict with Bootstrap `.table`** -- reset with `.woocommerce table.shop_table { border: 0 }` and cell `border-left/right: 0`. - **WooCommerce `shop_table` borders conflict with Bootstrap `.table`** -- reset with `.woocommerce table.shop_table { border: 0 }` and cell `border-left/right: 0`.
- **WooCommerce gallery JS requires modifier classes** -- `--with-images`, `--without-images`, `--columns-N` on `.woocommerce-product-gallery` + `style="opacity: 0"` for fade-in. Without these, zoom and photoswipe won't initialize. - **WooCommerce gallery JS requires modifier classes** -- `--with-images`, `--without-images`, `--columns-N` on `.woocommerce-product-gallery` + `style="opacity: 0"` for fade-in. Without these, zoom and photoswipe won't initialize.
- **WooCommerce dark mode select backgrounds** -- `woocommerce.css` sets `select { background-color: var(--wc-form-color-background, #fff) }`. The custom property is never defined for dark mode, so it falls back to `#fff`. Override with `[data-bs-theme="dark"] .woocommerce select`.
- **Select2/SelectWoo dark mode** -- `select2.css` hardcodes `#fff` on selection containers and dropdowns. Needs overrides for `.select2-selection`, `.select2-dropdown`, `.select2-search__field`, and highlighted options.
- **WooCommerce notice CSS specificity** -- Uses `border-top: 3px solid`, `background-color: #f6f5f8`, and icon font `::before` at specificity `0,1,0`. Must use `.woocommerce .woocommerce-*` (specificity `0,2,0`) and explicitly reset `border-top` to override.
- **WooCommerce float layout fights Bootstrap grid** -- `div.product div.images/summary` have `float:left/right; width:48%` in `woocommerce-layout.css`. Override with `float: none; width: 100%`. - **WooCommerce float layout fights Bootstrap grid** -- `div.product div.images/summary` have `float:left/right; width:48%` in `woocommerce-layout.css`. Override with `float: none; width: 100%`.
- **Bootstrap `g-*` gutters add negative top margin** -- `g-4` sets both `--bs-gutter-x` and `--bs-gutter-y`; the `.row` gets `margin-top: calc(-1 * var(--bs-gutter-y))` pulling it upward. Use `gx-*` for horizontal-only gutters when vertical gap isn't desired. - **Bootstrap `g-*` gutters add negative top margin** -- `g-4` sets both `--bs-gutter-x` and `--bs-gutter-y`; the `.row` gets `margin-top: calc(-1 * var(--bs-gutter-y))` pulling it upward. Use `gx-*` for horizontal-only gutters when vertical gap isn't desired.
@@ -321,7 +324,7 @@ The child theme inherits from `wp-bootstrap` via WordPress `Template: wp-bootstr
## Version History ## Version History
Current version: **v0.1.0** Current version: **v0.1.1**
## Session History ## Session History
@@ -387,3 +390,19 @@ Current version: **v0.1.0**
**Files changed (1):** **Files changed (1):**
- `CHANGELOG.md` — Added `[0.1.0]` section documenting all features and fixes between v0.0.1 and v0.1.0 - `CHANGELOG.md` — Added `[0.1.0]` section documenting all features and fixes between v0.0.1 and v0.1.0
### 2026-02-28 — v0.1.1 Dark Mode & Notice CSS Bugfixes
**Scope:** Fixed dark mode select backgrounds, WooCommerce notice styling conflicts, and product card image overflow.
**Files changed (2):**
- `assets/css/wc-bootstrap.css` — Dark mode overrides for native `<select>` and Select2/SelectWoo widgets; bumped notice selectors to `.woocommerce .woocommerce-*` (specificity `0,2,0`) to beat `woocommerce.css`; suppressed WooCommerce icon font `::before` on notices; added checkout form focus color for dark mode
- `templates/content-product.html.twig` — Added `overflow-hidden` to product card `<article>` for border-radius clipping
**Key learnings:**
- WooCommerce CSS sets `select { background-color: var(--wc-form-color-background, #fff) }` — the custom property is never defined for dark mode, so it falls back to white. Override with `[data-bs-theme="dark"] .woocommerce select`.
- Select2/SelectWoo hardcodes `#fff` backgrounds in `select2.css` — needs comprehensive overrides for selection containers, dropdowns, search fields, and highlighted options.
- WooCommerce notice CSS uses `border-top: 3px solid`, `background-color: #f6f5f8`, and WooCommerce icon font `::before` at specificity `0,1,0`. Single-class overrides don't win — must use `.woocommerce .woocommerce-*` (specificity `0,2,0`) and explicitly reset `border-top`.
- Never set `background-image` without `background-repeat: no-repeat` / `background-size` / `background-position` — SVGs will tile.

View File

@@ -141,8 +141,8 @@ for po in languages/wc-bootstrap-*.po; do msgfmt -o "${po%.po}.mo" "$po"; done
Releases are automated via Gitea Actions. Push a tag matching `vX.X.X` to trigger a release build. Releases are automated via Gitea Actions. Push a tag matching `vX.X.X` to trigger a release build.
```bash ```bash
git tag -a v0.1.0 -m "Version 0.1.0 - Initial release" git tag -a v0.1.1 -m "Version 0.1.1 - Bugfix release"
git push origin v0.1.0 git push origin v0.1.1
``` ```
## License ## License

View File

@@ -7,7 +7,7 @@ Description: A Bootstrap 5 child theme for WP Bootstrap that overrides all WooCo
Requires at least: 6.7 Requires at least: 6.7
Tested up to: 6.7 Tested up to: 6.7
Requires PHP: 8.3 Requires PHP: 8.3
Version: 0.1.0 Version: 0.1.1
License: GNU General Public License v2 or later License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html License URI: http://www.gnu.org/licenses/gpl-2.0.html
Template: wp-bootstrap Template: wp-bootstrap