jekyll-webawesome 0.10.0 → 0.13.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: bcbb1d451587bd1a304cd626162ded7ce7d2884cbb4f6e7093591df5f014003e
-  data.tar.gz: 98f5edfeb770b006b3e6bd7652bf5b320b7f9863c5c74d52b03851f7c41bad35
+  metadata.gz: b54cfbaeca69a4a2c50d6b5da23ba58ac0af58f03f9c812f10ea165cedf31d5c
+  data.tar.gz: ac81039d7f111315bc44919f6c482141d9f0ce02e4e28187a992178567d29c2c
 SHA512:
-  metadata.gz: b56fff6c208899e003fe4200976c735bd9241509ff60015c54bbc9f850753d98fb60cfcaadd15a0e25423b5f41120ad3e3649f800c092619a2054e5a20983d43
-  data.tar.gz: 938f30ca5b86a7da8036c919dd25ea7f65d3fefc32dbe7c383219d7361efb3f590eaf43c81b9fab3103fed9c2505aaf28fe9a71f5db481821dd3aa55a89083e3
+  metadata.gz: 430ee12ec78d0c67ba7a5ac0a21eb538f9f2aaf93c8d1cec7cd8beeb9c17b1ee6c19ad21b55c6bc91cfb36db1bee54ddc62c9202e7b2bc88d57638f761548062
+  data.tar.gz: 23f9ebd7d40036ead017b802360dc59e387257b58fea64fa9961d0f13c26c1d834d936be427ce36e77f0af5264ede260f4d770c2ca7af06d219fe1a6abadf687

data/CHANGELOG.md

@@ -4,6 +4,29 @@ All notable changes to this project will be documented in this file.
 
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.1.0/)
 
+## [0.13.0] - 2026-02-16
+
+### Added
+
+- **Icon sizes** — Append a size token to icons (`$$$settings:lg`, `$$$home:2x`) for predefined font-size scaling. Available sizes: `xs`, `sm`, `lg`, `xl`, `2x`, `3x`, `4x`
+- **Custom SVG icons** — Use a file path (`$$$/assets/icons/shoe.svg`) to render `<wa-icon src="...">` instead of a named icon. Sizes work with custom paths too
+- Icons section added to README and example site
+- Updated `markawesome` dependency to `~> 0.7`
+
+## [0.12.0] - 2026-02-14
+
+### Changed
+
+- **BREAKING: Card header syntax** — Card headers now use `**bold text**` instead of `# heading` via markawesome 0.6.0. The first bold-only line inside a card block becomes the header slot. This avoids markdownlint warnings (MD025, MD001) and better reflects that card titles are not semantic document headings.
+- Updated `markawesome` dependency to `~> 0.6`
+- Example site updated with new card header syntax
+
+## [0.11.0] - 2026-02-10
+
+### Added
+
+- Icon component and layout utilities table added to README
+
 ## [0.10.0] - 2026-02-10
 
 ### Added

data/README.md

@@ -23,6 +23,7 @@ This plugin focuses on the most commonly used Web Awesome components for Jekyll
 | **Copy Button** | `<<<placement? disabled? duration? labels?` | `:::wa-copy-button attributes?` | `<wa-copy-button value="content" tooltip-placement="right" disabled>` |
 | **Details** | `^^^appearance? icon-placement?` | `:::wa-details appearance? icon-placement?` | `<wa-details appearance="..." icon-placement="...">content</wa-details>` |
 | **Dialog** | `???params?` | `:::wa-dialog params?` | `<wa-dialog>` with trigger button and content |
+| **Icon** | `$$$icon-name` or `$$$icon-name:size` | `:::wa-icon name [size]` | `<wa-icon name="icon-name"></wa-icon>` |
 | **Tab Group** | `++++++` | `:::wa-tabs` | `<wa-tab-group><wa-tab>content</wa-tab></wa-tab-group>` |
 | **Tag** | `@@@brand` | `:::wa-tag brand` | `<wa-tag variant="brand">content</wa-tag>` |
 
@@ -30,6 +31,21 @@ Not all components will make sense to include here, to be included in the "prose
 
 Both syntax styles work identically and can be mixed within the same document.
 
+### Layout utilities
+
+Layout containers use `::::` (quadruple colon) syntax to wrap content in Web Awesome CSS layout utilities. Layouts compose with component syntax — use `:::` components inside `::::` layouts.
+
+| Layout | Primary Syntax | Key Attributes | Description |
+|--------|----------------|----------------|-------------|
+| **Grid** | `::::grid` | `min:SIZE`, `gap:SIZE` | Responsive auto-wrapping grid |
+| **Stack** | `::::stack` | `gap:SIZE` | Vertical spacing |
+| **Cluster** | `::::cluster` | `gap:SIZE`, `justify:VALUE` | Inline wrapping elements (tag clouds, button groups) |
+| **Split** | `::::split` | `gap:SIZE`, `row`/`column` | Even two-column/row distribution |
+| **Flank** | `::::flank` | `size:SIZE`, `content:SIZE`, `gap:SIZE` | Sidebar + main content |
+| **Frame** | `::::frame` | `landscape`/`portrait`/`square`, `radius:VALUE` | Aspect ratio containers |
+
+Common attributes across all layouts: `gap:SIZE`, `align:VALUE`, `justify:VALUE`. Alternative `::::wa-*` syntax is supported for all layout types.
+
 ## Installation
 
 Add this line to your application's Gemfile:
@@ -208,11 +224,11 @@ This is a basic card with just content.
 
 #### Cards with Headers
 
-The first heading (`#`) automatically becomes the card header:
+The first bold line (`**text**`) automatically becomes the card header:
 
 ```markdown
 ===
-# Card Title
+**Card Title**
 This is the card content that appears in the main area.
 ===
 ```
@@ -224,7 +240,7 @@ The first image automatically becomes the card media:
 ```markdown
 ===
 ![Alt text](image.jpg)
-# Featured Content
+**Featured Content**
 This card includes both an image and a title.
 ===
 ```
@@ -235,8 +251,8 @@ Links at the end of the card content automatically become footer buttons:
 
 ```markdown
 ===
-# Get Started
-Ready to begin your journey? 
+**Get Started**
+Ready to begin your journey?
 [Learn More](https://example.com)
 ===
 ```
@@ -248,7 +264,7 @@ You can combine all elements for rich content cards:
 ```markdown
 ===filled
 ![Hero Image](hero.jpg)
-# Complete Example
+**Complete Example**
 This card has media, header, content, and footer with a filled appearance.
 [Get Started](https://example.com)
 ===
@@ -260,22 +276,22 @@ You can specify different visual styles:
 
 ```markdown
 ===filled
-# Filled Card
+**Filled Card**
 This card uses the filled appearance.
 ===
 
 ===plain
-# Plain Card
+**Plain Card**
 This card uses the plain appearance.
 ===
 
 ===filled-outlined
-# Filled Outlined Card
+**Filled Outlined Card**
 This card uses the filled-outlined appearance.
 ===
 
 ===accent
-# Accent Card
+**Accent Card**
 This card uses the accent appearance for emphasis.
 ===
 ```
@@ -287,13 +303,13 @@ Cards can be displayed in horizontal layout for side-by-side presentation:
 ```markdown
 ===horizontal
 ![Feature Image](feature.jpg)
-# Horizontal Card
+**Horizontal Card**
 This card displays with a side-by-side layout where media appears on the left.
 ===
 
 ===filled horizontal
 ![Product Photo](product.jpg)
-# Combined Attributes
+**Combined Attributes**
 You can combine appearance and orientation in any order.
 ===
 ```
@@ -653,6 +669,45 @@ Status: @@@ warning Beta @@@ - testing in progress
 Combine inline @@@ pill small success Ready @@@ with attributes
 ```
 
+### Icons
+
+Insert icons inline using the `$$$` syntax:
+
+```markdown
+Click $$$settings to open settings.
+
+A larger icon: $$$home:2x
+
+Custom SVG: $$$/assets/icons/logo.svg
+```
+
+#### Icon Sizes
+
+Append a size token after `:` to control the icon size:
+
+```markdown
+$$$star:xs   Extra small (0.75em)
+$$$star:sm   Small (0.875em)
+$$$star      Default (inherits font size)
+$$$star:lg   Large (1.25em)
+$$$star:xl   Extra large (1.5em)
+$$$star:2x   2x (2em)
+$$$star:3x   3x (3em)
+$$$star:4x   4x (4em)
+```
+
+#### Custom SVG Icons
+
+Use a file path starting with `/` or `./` to render a custom SVG instead of a named icon:
+
+```markdown
+$$$/assets/icons/shoe.svg
+$$$/assets/icons/shoe.svg:2x
+$$$./icons/logo.svg:xl
+```
+
+This outputs `<wa-icon src="...">` instead of `<wa-icon name="...">`.
+
 ### Copy Buttons
 
 Create copy-to-clipboard buttons using the `<<<` syntax:
@@ -1394,7 +1449,7 @@ Cards support flexible attribute ordering using space-separated parameters:
 Cards automatically parse content into these slots:
 
 - **Media**: First image becomes media slot
-- **Header**: First `#` heading becomes header slot  
+- **Header**: First `**bold line**` becomes header slot
 - **Content**: Remaining content becomes main content
 - **Footer**: Trailing links become footer buttons
 

data/jekyll-webawesome.gemspec

@@ -33,7 +33,7 @@ Gem::Specification.new do |spec|
   spec.require_paths = ['lib']
 
   spec.add_dependency 'jekyll', '>= 3.7', '< 5.0'
-  spec.add_dependency 'markawesome', '~> 0.5'
+  spec.add_dependency 'markawesome', '~> 0.7'
 
   spec.add_development_dependency 'bundler', '~> 2.0'
   spec.add_development_dependency 'rake', '~> 13.0'

data/lib/jekyll/webawesome/version.rb

@@ -2,6 +2,6 @@
 
 module Jekyll
   module WebAwesome
-    VERSION = '0.10.0'
+    VERSION = '0.13.0'
   end
 end

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: jekyll-webawesome
 version: !ruby/object:Gem::Version
-  version: 0.10.0
+  version: 0.13.0
 platform: ruby
 authors:
 - Janne Waren
@@ -35,14 +35,14 @@ dependencies:
     requirements:
     - - "~>"
       - !ruby/object:Gem::Version
-        version: '0.5'
+        version: '0.7'
   type: :runtime
   prerelease: false
   version_requirements: !ruby/object:Gem::Requirement
     requirements:
     - - "~>"
       - !ruby/object:Gem::Version
-        version: '0.5'
+        version: '0.7'
 - !ruby/object:Gem::Dependency
   name: bundler
   requirement: !ruby/object:Gem::Requirement