v1.0.1 - Integrate Bootstrap Icons web font

Add bootstrap-icons npm package with SCSS import and font file copy
build step. All 2,000+ icons available via CSS classes (bi bi-*) in
both frontend and block editor.

Co-Authored-By: Claude <noreply@anthropic.com>

CHANGELOG.md

@@ -2,6 +2,14 @@
 
 All notable changes to this project will be documented in this file.
 
+## [1.0.1] - 2026-02-09
+
+### Added
+
+- Bootstrap Icons web font integration — all 2,000+ icons available via `<i class="bi bi-*"></i>` CSS classes
+- `copy:icons` build step to copy icon font files (`.woff`, `.woff2`) from `node_modules` to `assets/fonts/`
+- Bootstrap Icons SCSS imported in both frontend and editor stylesheets for icon support in templates and block editor
+
 ## [1.0.0] - 2026-02-08
 
 ### Added

CLAUDE.md

@@ -34,7 +34,7 @@ This project is proudly **"vibe-coded"** using Claude.AI - the entire codebase w
 
 **Note for AI Assistants:** Clean this section after the specific features are done or new releases are made. Effective changes are tracked in `CHANGELOG.md`. Do not add completed versions here - document them in the Session History section at the end of this file.
 
-Current version is **v1.0.0** - Release. See `PLAN.md` for details.
+Current version is **v1.0.1**. See `PLAN.md` for details.
 
 ## Technical Stack
 
@@ -193,6 +193,24 @@ Build steps (in order):
 
 ## Session History
 
+### Session 9 — v1.0.1 Bootstrap Icons (2026-02-09)
+
+**Completed:** Bootstrap Icons web font integration via SCSS build pipeline.
+
+**What was built:**
+
+- Added `bootstrap-icons` npm dependency (v1.13.1)
+- Imported Bootstrap Icons SCSS in both `style.scss` and `editor-style.scss`
+- Added `$bootstrap-icons-font-src` variable override in `_variables.scss` to point `@font-face` at `assets/fonts/`
+- Added `copy:icons` npm script to copy `.woff`/`.woff2` font files from `node_modules` to `assets/fonts/`
+- Updated `build` script to include `copy:icons` step
+
+**Key learnings:**
+
+- Bootstrap Icons SCSS uses `$bootstrap-icons-font-src` to allow overriding the `@font-face` `src` declaration — set it before the import to control font file paths
+- The existing `--load-path=node_modules` Sass flag resolves `@import "bootstrap-icons/font/bootstrap-icons"` without any extra configuration
+- Font files (`.woff2` at 131KB, `.woff` at 176KB) are small enough to serve as web fonts without performance concern
+
 ### Session 8 — v1.0.0 Release (2026-02-08)
 
 **Completed:** Sidebar widget area registration, Twig widget rendering with fallback, documentation refresh, v1.0.0 release.

README.md

@@ -9,6 +9,7 @@ A modern WordPress Block Theme built from scratch with Bootstrap 5. Features res
 - **Full Site Editing** -- Compatible with the WordPress Site Editor for admin editing
 - **Style Variations** -- 15 color schemes (7 light, 7 dark, plus default) with live Design Editor customization
 - **Block Patterns** -- 41 patterns across 11 categories (hero, features, CTA, testimonials, pricing, contact, text, layout, components, navigation, pages)
+- **Bootstrap Icons** -- 2,000+ icons available via CSS classes (`bi bi-*`)
 - **Block Styles** -- 17 custom styles mapping Bootstrap components to WordPress blocks
 - **Custom Templates** -- Landing (no header/footer), full-width, hero, sidebar page templates
 - **Header/Footer Variations** -- Default, centered, transparent headers; default, minimal, multi-column footers
@@ -69,9 +70,10 @@ Activate the theme in **Appearance > Themes** in the WordPress admin.
 
 1. `copy:js` -- Copy Bootstrap JS bundle from `node_modules` to `assets/js/`
 2. `copy:theme-js` -- Copy theme JS (dark-mode.js) from `src/js/` to `assets/js/`
-3. `scss` -- Compile SCSS (`src/scss/`) to CSS (`assets/css/`)
-4. `scss:rtl` -- Compile RTL stylesheet (`assets/css/rtl.css`)
-5. `postcss` -- Autoprefixer + cssnano minification to `assets/css/style.min.css`
+3. `copy:icons` -- Copy Bootstrap Icons font files (`.woff`, `.woff2`) to `assets/fonts/`
+4. `scss` -- Compile SCSS (`src/scss/`) to CSS (`assets/css/`)
+5. `scss:rtl` -- Compile RTL stylesheet (`assets/css/rtl.css`)
+6. `postcss` -- Autoprefixer + cssnano minification to `assets/css/style.min.css`
 
 ## Architecture
 

package-lock.json

@@ -1,16 +1,17 @@
 {
     "name": "wp-bootstrap",
-    "version": "0.1.0",
+    "version": "1.0.0",
     "lockfileVersion": 3,
     "requires": true,
     "packages": {
         "": {
             "name": "wp-bootstrap",
-            "version": "0.1.0",
+            "version": "1.0.0",
             "license": "GPL-2.0-or-later",
             "dependencies": {
                 "@popperjs/core": "^2.11",
-                "bootstrap": "^5.3"
+                "bootstrap": "^5.3",
+                "bootstrap-icons": "^1.13.1"
             },
             "devDependencies": {
                 "autoprefixer": "^10.4",
@@ -259,6 +260,22 @@
                 "@popperjs/core": "^2.11.8"
             }
         },
+        "node_modules/bootstrap-icons": {
+            "version": "1.13.1",
+            "resolved": "https://registry.npmjs.org/bootstrap-icons/-/bootstrap-icons-1.13.1.tgz",
+            "integrity": "sha512-ijombt4v6bv5CLeXvRWKy7CuM3TRTuPEuGaGKvTV5cz65rQSY8RQ2JcHt6b90cBBAC7s8fsf2EkQDldzCoXUjw==",
+            "funding": [
+                {
+                    "type": "github",
+                    "url": "https://github.com/sponsors/twbs"
+                },
+                {
+                    "type": "opencollective",
+                    "url": "https://opencollective.com/bootstrap"
+                }
+            ],
+            "license": "MIT"
+        },
         "node_modules/brace-expansion": {
             "version": "1.1.12",
             "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.12.tgz",

package.json

@@ -1,6 +1,6 @@
 {
     "name": "wp-bootstrap",
-    "version": "1.0.0",
+    "version": "1.0.1",
     "description": "WordPress Theme built with Bootstrap 5",
     "author": "Marco Graetsch <magdev3.0@gmail.com>",
     "license": "GPL-2.0-or-later",
@@ -13,16 +13,17 @@
         "node": ">=20.0.0"
     },
     "dependencies": {
+        "@popperjs/core": "^2.11",
         "bootstrap": "^5.3",
-        "@popperjs/core": "^2.11"
+        "bootstrap-icons": "^1.13.1"
     },
     "devDependencies": {
-        "sass": "^1.97",
+        "autoprefixer": "^10.4",
+        "copyfiles": "^2.4",
+        "cssnano": "^7.1",
         "postcss": "^8.5",
         "postcss-cli": "^11",
-        "autoprefixer": "^10.4",
-        "cssnano": "^7.1",
-        "copyfiles": "^2.4"
+        "sass": "^1.97"
     },
     "scripts": {
         "scss": "sass src/scss/style.scss:assets/css/style.css src/scss/editor-style.scss:assets/css/editor-style.css --load-path=node_modules",
@@ -31,7 +32,8 @@
         "postcss": "postcss assets/css/style.css --use autoprefixer cssnano -o assets/css/style.min.css --no-map",
         "copy:js": "copyfiles -f node_modules/bootstrap/dist/js/bootstrap.bundle.min.js node_modules/bootstrap/dist/js/bootstrap.bundle.min.js.map assets/js/",
         "copy:theme-js": "copyfiles -f src/js/dark-mode.js assets/js/",
-        "build": "npm run copy:js && npm run copy:theme-js && npm run scss && npm run scss:rtl && npm run postcss",
+        "copy:icons": "copyfiles -f node_modules/bootstrap-icons/font/fonts/bootstrap-icons.woff node_modules/bootstrap-icons/font/fonts/bootstrap-icons.woff2 assets/fonts/",
+        "build": "npm run copy:js && npm run copy:theme-js && npm run copy:icons && npm run scss && npm run scss:rtl && npm run postcss",
         "watch": "npm run copy:js && npm run scss:watch",
         "dev": "npm run watch"
     }

src/scss/_variables.scss

@@ -44,3 +44,7 @@ $enable-dark-mode: true;
 
 // Enable reduced motion
 $enable-reduced-motion: true;
+
+// Bootstrap Icons font path (points to copied files in assets/fonts/)
+$bootstrap-icons-font-src: url("../fonts/bootstrap-icons.woff2") format("woff2"),
+                           url("../fonts/bootstrap-icons.woff") format("woff");

src/scss/editor-style.scss

@@ -15,8 +15,11 @@
 // 4. WordPress block compatibility
 @import "wordpress";
 
-// 5. Custom styles (dark mode overrides, block styles, etc.)
+// 5. Bootstrap Icons
+@import "bootstrap-icons/font/bootstrap-icons";
+
+// 6. Custom styles (dark mode overrides, block styles, etc.)
 @import "custom";
 
-// 6. Editor-specific overrides
+// 7. Editor-specific overrides
 @import "editor-overrides";

src/scss/style.scss

@@ -15,5 +15,8 @@
 // 4. WordPress block compatibility
 @import "wordpress";
 
-// 5. Custom styles
+// 5. Bootstrap Icons
+@import "bootstrap-icons/font/bootstrap-icons";
+
+// 6. Custom styles
 @import "custom";

style.css

@@ -7,7 +7,7 @@ Description: A modern WordPress Block Theme built from scratch with Bootstrap 5.
 Requires at least: 6.7
 Tested up to: 6.7
 Requires PHP: 8.3
-Version: 1.0.0
+Version: 1.0.1
 License: GNU General Public License v2 or later
 License URI: http://www.gnu.org/licenses/gpl-2.0.html
 Text Domain: wp-bootstrap