# Changelog

All notable changes to BW Video Text are documented here.

The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.1.0/),
and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).

## [Unreleased]

## [0.1.55] - 2026-06-09

### Fixed
- Editor preview now correctly mirrors frontend row alignment per layout. Layout 2 row uses `align-items: center` (text col is content-height, shorter than video — matches frontend). Layout 3 row uses `align-items: stretch` (both cols fill the same height — matches frontend). Previously layout 2 incorrectly used `stretch` (same height as layout 3).

## [0.1.54] - 2026-06-09

### Fixed
- YouTube and MP4 thumbnail previews in editor were squished/flat. Root cause: `editor.css` overrode `.bw-vt-thumbnail` to `position: relative` which conflicts with the frontend's `padding-bottom: 56.25%; height: 0` aspect-ratio trick (that trick requires children to be `position: absolute`). Fixed by switching the editor wrapper to `aspect-ratio: 16/9` with `height: auto !important` and restoring the thumbnail to `position: absolute` to fill it correctly.

## [0.1.53] - 2026-06-09

### Fixed
- MP4 editor preview was invisible. The `<video>` element was a direct child of `.bw-vt-video-wrapper` which uses `height:0; padding-bottom:56.25%` — so `height:100%` resolved to 0. Fixed by wrapping the video in `.bw-vt-video-player` (which is `position:absolute; top:0; left:0; width:100%; height:100%`) so it fills the wrapper correctly.

## [0.1.52] - 2026-06-09

### Fixed
- Editor preview for MP4 videos now shows the actual `<video>` element instead of just the thumbnail image.
- YouTube editor preview no longer shows error 153. YouTube blocks iframe embeds on non-whitelisted domains (e.g. WordPress admin). Replaced iframe with a YouTube thumbnail image (`img.youtube.com/vi/{id}/hqdefault.jpg`) + play button overlay — same visual style as the MP4 thumbnail preview.

## [0.1.51] - 2026-06-09

### Fixed
- Editor preview for Layout 4 now shows correct 65%/35% proportions. `editor.css` had a separate copy of layout proportions that was not updated when `style.css` changed.

## [0.1.50] - 2026-06-09

### Changed
- Layout selector in editor sidebar now shows plain labels ("Layout 1", "Layout 2", etc.) without percentage descriptions.

## [0.1.49] - 2026-06-09

### Changed
- Layout 4 proportions corrected to 65% video / 35% text.

## [0.1.48] - 2026-06-09

### Changed
- Layout 4 proportions changed from 50%/50% to 60% video / 40% text.

## [0.1.47] - 2026-06-09

### Fixed
- CTA text link and Play Video link now stack vertically (one per line). Both used `display: inline-flex` which caused them to render side-by-side; changed to `display: flex` (block-level) in CSS and PHP inline style.

## [0.1.46] - 2026-06-09

### Fixed
- CTA text link now renders above the "Play Video" link and below the body text, in both the editor preview and frontend output.

## [0.1.45] - 2026-06-09

### Added
- **CTA text link with chevron**: toggle "Show text link with chevron" in the Play Link & Extras panel to add a styled anchor link below the body content. Settings: link text, URL, open in new tab, and color (via Colors panel). Renders as `<a class="bw-vt-cta-link">Text <svg chevron-right /></a>` with hover opacity transition. New attributes: `showCta`, `ctaText`, `ctaUrl`, `ctaColor`, `ctaNewTab`.

## [0.1.44] - 2026-06-09

### Added
- **Highlight Color** inline format (`bw/highlight`): select any text in the heading or body, click the "A" icon in the floating format toolbar, pick a colour from the spectrum picker or theme palette. Renders as `<span class="bw-highlight" style="color:…">` — preserved by `wp_kses_post`. Includes a "Remove color" button to clear the format from the selection.

## [0.1.43] - 2026-06-09

### Fixed
- Layout 3 text block shadow was invisible. Root cause: `.bw-video-text` has `overflow: hidden` which clips all shadow from `.bw-vt-text-col` on every side. Fix: override to `overflow: visible` for layout 3, and move the shadow to `.bw-vt-text-inner` (the inner content div) so it is scoped to the text block element specifically.

## [0.1.42] - 2026-06-09

### Changed
- Layout 3 text block now has an explicit card-style box shadow (`0 4px 24px rgba(0,0,0,0.10)`) to match the intended design reference.

### Reverted
- 0.1.41 incorrectly removed the box shadow. This release restores and explicitly defines it.

## [0.1.41] - 2026-06-09

### Fixed
- Unwanted box shadow on text block (layout 3) caused by Kadence theme automatically applying a card shadow to elements with a background-color. Added `box-shadow: none !important` to `.bw-vt-text-col` and `.bw-vt-text-inner`.

## [0.1.40] - 2026-06-09

### Changed
- Layout 3 MP4 video now behaves identically to layout 2: autoplay on page load (muted, looping) with full custom controls bar.

## [0.1.39] - 2026-06-09

### Changed
- Layout 3 proportions changed from 35%/65% to 30% text / 70% video (matching layout 2).

## [0.1.38] - 2026-06-09

### Fixed
- Theme palette colors (from Kadence customizer) not applying to text block background in the editor. Root cause: `ColorPalette` was used without an explicit `colors` prop, so the component fell back to auto-populated swatches whose `onChange` could return CSS variable strings (`var(--global-palette1)`) rather than hex values. Fix: read theme palette colors from `wp.data.select('core/block-editor').getSettings().colors` and pass them explicitly to `ColorPalette`, ensuring hex values are returned on click.
- Added `bw_vt_sanitize_color()` helper in `block-render-helpers.php` to replace `sanitize_hex_color()` for all color attributes in `render.php`. The new sanitizer accepts both hex colours and CSS custom property references (`var(--…)`), so theme palette colours stored as CSS variables survive PHP sanitization and render correctly on the front end.

## [0.1.37] - 2026-06-09

### Fixed
- Layout 3 text block background colour was not visible (appeared as a thin floating strip). Root cause: layout 2 and 3 shared an `align-items: center` rule, which made the text col only as tall as its content. Separated the rules — layout 3 now uses `align-items: stretch` so the text col fills the full row height (matching the 16:9 video col), making the background colour fill the entire column. Text content remains vertically centred via `justify-content: center` on the text col.

## [0.1.36] - 2026-06-09

### Changed
- Layout 2 autoplay video now loops continuously so it never stops.

## [0.1.35] - 2026-06-09

### Added
- Layout 2 MP4 videos now autoplay on page load (muted, as required by browser autoplay policy). The volume/mute button in the controls bar reflects the muted state immediately, so visitors can unmute with one click. No change to layout 1, 3, or 4.

## [0.1.34] - 2026-06-08

### Fixed
- Fullscreen button in layout 2 (MP4 source) now toggles: clicking while already in fullscreen exits fullscreen instead of silently doing nothing. Added `fullscreenchange` / `webkitfullscreenchange` event listeners to update the button icon between the enter-fullscreen and exit-fullscreen icons.

## [0.1.33] - 2026-06-08

### Fixed
- `editor.js` was not being cache-busted on change. WordPress registers the block's `editorScript` (from `block.json`) without a `filemtime` version, so the browser served the old script indefinitely. Fixed by pre-registering the `bw-video-text-editor-script` handle with `filemtime()` before `register_block_type()` is called — same technique already applied to CSS and frontend.js in 0.1.15.

## [0.1.32] - 2026-06-08

### Added
- Separate typography controls for heading vs body text. Heading now has its own Font Size, Font Weight, Font Style (in addition to existing Tag and Color). Body Text font settings now apply only to the body paragraph, not the entire text column. Both sections appear under "Text Settings" in the sidebar with a visual divider. New attributes: `headingFontSize`, `headingFontWeight`, `headingFontStyle`.

### Changed
- `fontSize`, `fontWeight`, `fontStyle` now apply inline to the `.bw-vt-body` div instead of the text column wrapper, so they no longer affect the heading.

## [0.1.31] - 2026-06-08

### Fixed
- Color picker: replaced `PanelColorSettings` (deprecated in WP 6.x, was silently returning null and falling back to native OS `<input type="color">`) with a custom `ColorField` functional component using `wp.element.useState`. Each color row shows a label + swatch; clicking expands inline to `wp.components.ColorPicker` (spectrum/hue/hex/RGB/A) + `wp.blockEditor.ColorPalette` (theme swatches). Play Link and Bottom Border colors remain conditionally visible in the Colors panel.

## [0.1.30] - 2026-06-08

### Changed
- Color controls in the editor sidebar now use `wp.blockEditor.PanelColorSettings` instead of `<input type="color">`. This gives the full Gutenberg color picker: color spectrum, hue slider, hex/R/G/B/A inputs, and theme palette swatches from the customizer — matching the Kadence color picker experience. Play Link and Bottom Border colors moved into the Colors panel (conditionally shown when their toggles are on). Removed old `.bw-vt-color-row` / `.bw-vt-color-input` CSS.

## [0.1.29] - 2026-06-08

### Changed
- Layout 2 & 3: row uses `align-items: center` — text column (content height, shorter) is vertically centred against the taller 16:9 video column. Gray background covers only the text content area, positioned in the middle of the row height.

## [0.1.28] - 2026-06-08

### Changed
- Layout 2 & 3: row uses `align-items: stretch !important` so the text column fills the full video column height and the gray background covers the entire left side. Text content is vertically centred within that column via the existing `justify-content: center` on `.bw-vt-text-col`. Video wrapper keeps the `padding-bottom: 56.25%` 16:9 ratio introduced in 0.1.27.

## [0.1.27] - 2026-06-08

### Fixed
- Layout 2 & 3 height: reverted the equal-height approach (0.1.26 was wrong). The correct design is text col at content height (shorter) and video col taller at 16:9 aspect ratio — same as layout 1 & 4. Row changed to `align-items: flex-start`; video wrapper now uses `padding-bottom: 56.25%; height: 0` instead of `position: absolute`. Mobile reset simplified (padding-bottom approach is the same on both desktop and mobile now).

## [0.1.26] - 2026-06-08

### Fixed
- Layout 2 & 3 equal height: root cause confirmed — Kadence theme overrides `align-items: stretch` on the row, causing the text column to collapse to its content height instead of stretching to match the video column. Fix: added `align-items: stretch !important` on the layout 2 & 3 rows, and `align-self: stretch !important; min-height: 320px` on the text columns (the min-height is the final fallback if both align properties are somehow still overridden). Reset `min-height: 0` on text col for mobile.

## [0.1.25] - 2026-06-08

### Fixed
- Layout 2 & 3 equal height: video col now has `overflow: hidden` so custom controls can never visually extend below the column's bottom edge, even if inner overflow rules are overridden by the theme. Added `position: absolute !important` + `bottom/left/right: 0 !important` to `.bw-vt-controls` to prevent theme CSS from rendering the controls in-flow. Added `overflow: hidden` and `width/height: 100% !important` to `.bw-vt-video-player` to contain the video element.

## [0.1.24] - 2026-06-08

### Fixed
- Layout 2 & 3 equal-height fix: replaced the flex approach (`display:flex; flex:1` on wrapper) with a simpler and more reliable `position: absolute` approach. The video wrapper is now absolutely positioned (top/left/width/height 100%) inside the video column; the column itself has `min-height: 320px` and stretches to match the text column via `align-items: stretch` on the row. No `height: 100%` propagation issues.
- Mobile responsive override for layouts 2 & 3: wrapper reverts to `position: relative` + `padding-bottom: 56.25%` for 16:9 ratio when stacked.

## [0.1.23] - 2026-06-08

### Added
- Custom video controls for MP4/file-source videos: play/pause, time display (current / total), seek bar (red fill, white thumb), mute/unmute, and fullscreen — all styled with red `#cc0000` button boxes matching the reference design. Native browser `controls` attribute removed; controls are overlaid at the bottom of the video player.
- `object-fit: cover` for layouts 2 & 3 video elements so the video fills the container without letterbox bars.

### Fixed
- Layout 2 & 3: video column now uses `display: flex; flex-direction: column` so the video wrapper can reliably use `flex: 1` to fill the column height. Previously `height: 100%` inside a flex item was not propagating correctly, causing the video block to be taller than the text block. Both columns are now equal height via flex `align-items: stretch` on the row.

## [0.1.22] - 2026-06-08

### Changed
- YouTube videos now use native YouTube embed (no autoplay) instead of a custom thumbnail overlay. YouTube renders its own thumbnail with channel name (top-left), native play button (bottom-left), and "Watch on YouTube" link (bottom-right) — no custom thumbnail HTML for YouTube source. File-source videos retain the custom thumbnail + click-to-play approach.
- `frontend.js` `playVideo()`: for YouTube (player never hidden), sends `playVideo` postMessage to the existing iframe; for file source, creates `<video>` element dynamically on first click.
- Removed `.bw-vt-thumbnail-bar` and `.bw-vt-watch-on-yt` CSS (no longer rendered).

## [0.1.21] - 2026-06-08

### Changed
- "Watch on YouTube" button: larger (font 13px, icon 18px, padding 7px 11px), button-style with `border-radius: 5px` and `rgba(0,0,0,0.65)` semi-transparent background (was small pill with no padding).

## [0.1.20] - 2026-06-08

### Changed
- Center play button: replaced red circle + white triangle SVG with the YouTube logo SVG icon (68px, fill=`playButtonColor`). The YouTube SVG path uses the evenodd winding rule so the play triangle renders transparent against the thumbnail. Button background is now transparent; `drop-shadow` filter provides depth. `BW_VT_PLAY_ICON_SVG` constant removed.
- "Watch on YouTube" link: moved from a standalone absolute pill into a `.bw-vt-thumbnail-bar` div that spans the full width of the thumbnail with a bottom-up dark gradient (`linear-gradient(transparent, rgba(0,0,0,0.72))`), matching the reference image bar style. Link is right-aligned inside the bar.

## [0.1.19] - 2026-06-08

### Added
- "Watch on YouTube" link overlay on the video thumbnail (YouTube source only). Positioned bottom-right of the thumbnail with semi-transparent dark background, YouTube icon, and "Watch on YouTube" text. Opens the original YouTube URL in a new tab (`target="_blank" rel="noopener noreferrer"`). Automatically hidden when the video is playing (thumbnail is hidden). Not shown for file-source videos.

## [0.1.18] - 2026-06-08

### Fixed
- YouTube icons acted as "stop" (clearing iframe, restarting from beginning) instead of "pause". Root cause: `pauseVideo()` was emptying `player.innerHTML`. Fix: YouTube iframes are now paused via `postMessage` with `pauseVideo` command (requires `enablejsapi=1` added to embed URL); HTML5 video uses `video.pause()`. A new `resumeVideo()` function sends `playVideo` postMessage or calls `video.play()`. Toggle now has three states: stopped→play, playing→pause, paused→resume. State tracked via `player.dataset.state`.
- `frontend.js` now registered with `filemtime()` version for cache-busting (same fix applied to CSS in 0.1.15).

## [0.1.17] - 2026-06-08

### Fixed
- Video disappeared after clicking play: root cause was `.bw-vt-thumbnail` providing the wrapper's height via `padding-bottom: 56.25%`. When JS hid the thumbnail with `display:none`, the wrapper collapsed to 0 height, and the absolutely-positioned iframe had no space to render. Fix: moved `padding-bottom: 56.25%; height: 0` to `.bw-vt-video-wrapper` for layouts 1 & 4, and made `.bw-vt-thumbnail` `position: absolute` (filling the wrapper). Now wrapper height is wrapper-owned and persists when thumbnail is hidden.
- YouTube icon aspect ratio reverted to original 576:512 (from the 16:9 change in 0.1.16).

## [0.1.16] - 2026-06-08

### Changed
- YouTube icon aspect ratio changed from 576:512 (~9:8) to 16:9. Gray heading icon: 36×20px; red play link icon: 20×11px. The SVG viewBox (576×512) is unchanged — the icon is scaled/letterboxed to fill the 16:9 display dimensions.

## [0.1.15] - 2026-06-08

### Fixed
- CSS cache-busting broken: `register_block_type()` from `block.json` registers styles with `ver=""` (empty), so Cloudflare CDN and browsers cached the CSS URL indefinitely and never served updated files. Fixed by pre-registering both `bw-video-text-style` and `bw-video-text-editor-style` handles with `filemtime()` as the version before `register_block_type()` is called — WordPress reuses the pre-registered handle and the `?ver=<timestamp>` query parameter now forces cache invalidation on every file change. All CSS changes from 0.1.12–0.1.14 (hover removal, entry-content-wrap padding) are now visible.

## [0.1.14] - 2026-06-08

### Fixed
- Hover effects still visible: root cause was `opacity:0.85` + `transition:opacity 0.2s` on both icons — theme hover CSS caused them to animate. Fix: merged normal + all pseudo-class states (`:hover`, `:focus`, `:focus-visible`, `:active`) into a single rule with `opacity:1!important; transition:none!important; outline:none!important; background:none!important` for both `.bw-vt-heading-yt-btn` and `.bw-vt-play-link`.
- `entry-content-wrap` padding: strengthened selector to `html body .entry-content-wrap, body .entry-content-wrap, .entry-content-wrap` and listed all four padding sub-properties explicitly with `!important`.

## [0.1.13] - 2026-06-08

### Changed
- Both YouTube icons (gray heading + red play link) now toggle play/pause: clicking while video is playing stops it and restores the thumbnail; clicking again replays. The thumbnail play button still plays-only (it is hidden while video is playing).
- Removed hover/focus-visible effect from red "Play Video" link (`.bw-vt-play-link`).
- Dash SVG `margin-top` reverted to 12px (was 24px).
- Container restarted to flush PHP/CSS cache.

## [0.1.12] - 2026-06-08

### Changed
- Removed hover/focus-visible effect from gray YouTube icon (`.bw-vt-heading-yt-btn`).
- Added `.entry-content-wrap { padding: 0 !important }` override in block stylesheet to remove Kadence theme padding that was constraining the block width.

## [0.1.11] - 2026-06-08

### Changed
- Gray YouTube icon: size increased 30px → 36px (height 27 → 32px).
- Gray YouTube icon: color softened `#9CA3AF` (gray-400) → `#D1D5DB` (gray-300).
- Gray YouTube icon: shifted right by 16px via `margin-right: -16px` on icon column, placing it in the text block's right padding zone for a tighter corner position.

## [0.1.10] - 2026-06-08

### Fixed
- Heading row still stacking vertically: theme CSS was overriding `display:flex` even with `!important` in the stylesheet (higher-specificity theme rule). Fix: moved `display:flex; flex-direction:row; align-items:flex-start; gap:8px` into the HTML `style` attribute directly on `.bw-vt-heading-row`, and `flex:1`/`flex-shrink:0` onto the column wrapper divs. Inline `style` with `!important` has the absolute highest CSS priority; nothing can override it. Applied in PHP render and editor.js.

## [0.1.9] - 2026-06-08

### Fixed
- Gray YouTube icon still falling below heading: root cause was Kadence theme applying `h2 { width: 100% }`, making the heading a full-width flex item that wraps the icon to the next row. Fix: wrap heading in `.bw-vt-heading-col` (flex:1) and icon in `.bw-vt-icon-col` (flex-shrink:0). The divs are the flex children, not the raw h2/span, so the theme's h2 width rule is scoped inside the column div and no longer affects the row layout. Applied in PHP, editor.js, style.css, and editor.css.

## [0.1.8] - 2026-06-08

### Fixed
- Gray YouTube icon: reverted absolute positioning; restored `.bw-vt-heading-row` flex structure with `display:flex!important; flex-direction:row!important; align-items:flex-start!important` so icon stays horizontally aligned with the heading text on the right side.
- Heading `flex:1!important` and icon `flex-shrink:0!important` ensure heading takes all available width and icon is never pushed below.
- Dash spacing: added `margin-top:24px!important` directly to the dash SVG's inline style attribute, bypassing any theme `svg { margin:0 }` override that was making the gap invisible.

## [0.1.7] - 2026-06-08

### Changed
- Gray YouTube icon repositioned: removed from heading flex-row; now `position: absolute; top: 32px; right: 0` within `.bw-vt-text-inner` (which gained `position: relative`). The icon floats at the top-right corner of the text block, clear of body content, matching the brentwood.ca reference layout.
- Play Video link: added `flex-direction: row !important; align-items: center !important; display: inline-flex !important` both in CSS and as inline `!important` style on the PHP span, so theme CSS cannot stack the icon above the text.
- Dash spacing: increased `margin-top` on `.bw-vt-dash-svg` and `.bw-vt-text-dash` from 12px to 24px to add visible breathing room between the Play Video link and the decorative dash.
- `editor.js`: removed `bw-vt-heading-row` wrapper; heading icon rendered as absolutely-positioned span with correct gray `fill="#9CA3AF"` (was erroneously using `playLinkColor`). Play link icon class fixed from `bw-vt-yt-icon--link` to `bw-vt-yt-icon`; both editor SVGs use explicit `width`/`height` props.

## [0.1.6] - 2026-06-08

### Fixed
- YouTube icon SVG was rendering at full container width (~300px) instead of the intended 30px (heading) and 20px (play link). Root cause: Kadence theme CSS (`svg { width: 100% }` or similar with `!important`) overrode the block stylesheet rules. Fix: replaced the `BW_VT_YT_SVG` constant with a `bw_vt_yt_icon( $px, $fill )` function that embeds inline `style` with `!important` directly on the SVG element — inline `!important` cannot be overridden by any external stylesheet.
- Heading icon color was not rendering as gray `#9CA3AF` — it was inheriting the page text color via `fill="currentColor"` because the CSS `color` rule wasn't applying. Fix: pass `fill="#9CA3AF"` directly into the SVG `fill` attribute (no longer relies on CSS cascade for colour).
- Play link icon colour now also passed directly into `fill` attribute from `$play_link_color`, making it independent of CSS `currentColor` inheritance.
- Dash SVG (`BW_VT_DASH_SVG` constant) similarly protected with inline `style="width:64px!important;height:4px!important"` to prevent theme from stretching it.

## [0.1.5] - 2026-06-08

### Fixed
- Heading YouTube icon: removed dynamic colour (was inheriting `playLinkColor` red); now hardcoded `#9CA3AF` (gray-400) to match reference. Opacity raised to 0.85 (was 0.25 which looked invisible against page background). Size adjusted to 30×27px.
- Play Video YouTube icon: size increased to 20×18px (was 18×16px) to match reference proportions.
- Editor CSS for both icons updated to match.

## [0.1.4] - 2026-06-08

### Fixed
- Replaced `<button>` with `<span role="button" tabindex="0">` for `.bw-vt-play-link` and `.bw-vt-heading-yt-btn`. WP themes target `button` elements with high-specificity or `!important` CSS that cannot be overridden from within the block stylesheet; using `<span>` sidesteps the conflict entirely.
- `frontend.js`: added `addClickAndKey()` helper so span role=button elements fire on keyboard Enter/Space (accessibility).
- Cleaned up the `!important` overload added in 0.1.3 — no longer needed.

## [0.1.3] - 2026-06-08

### Fixed
- WordPress theme button styles (background colour, padding, min-height) were overriding `.bw-vt-play-link` and `.bw-vt-heading-yt-btn`, causing the play link to render as a large styled button and the heading icon to render as a solid blue square. Added `!important` resets for `background`, `background-color`, `border`, `border-radius`, `box-shadow`, `padding`, `width`, `height`, `min-height`, `line-height`, `letter-spacing`, `text-transform` on both buttons.
- YouTube icon SVG dimensions now use `!important` (`max-width`/`max-height` guards added) to prevent theme `svg { width: 100% }` or similar rules from blowing up the icon size.
- Same resets applied to `.bw-vt-play-btn` (circle play button on thumbnail).
- Editor CSS updated to match.

## [0.1.2] - 2026-06-08

### Fixed
- Layout 1: reversed overlap direction — video col now extends 2rem into text area (`margin-right: -2rem`) so the video thumbnail visually crosses into the text column (matching user reference). Previous approach had text overlapping video.
- YouTube icon in heading: height corrected to 25px (from 28px) to match the 576:512 aspect ratio.
- YouTube icon in "Play Video" link: resized from 20×20px to 18×16px to match reference image proportions.
- Decorative dash: replaced CSS-generated div with inline SVG from `assets/images/dash.svg` (64×4 px, `#9CA3AF` grey) — exact colour and dimensions from the asset file.
- `BW_VT_DASH_SVG` constant added; `block-render-helpers.php` now outputs SVG element for dash instead of a plain div.

## [0.1.1] - 2026-06-08

### Added
- Layout 1 extras: YouTube icon button next to heading (triggers video play).
- Layout 1 extras: "Play Video" link with YouTube icon below body text.
- Decorative dash element below play link (toggle).
- Bottom border on text block (toggle + colour picker).
- Layout 1: text column now overlaps video column by 2 rem (brentwood.ca reference design), with extra left padding so text content clears the overlap area.
- `frontend.js` handles clicks on play link and heading icon in addition to thumbnail button.
- New attributes (`showHeadingVideoIcon`, `showPlayLink`, `showTextDash`, `showTextBottomBorder`) default to `true` for out-of-the-box Layout 1 look.

### Fixed
- Layout 1 & 4 row uses `align-items: center` so video stays at 16:9 and does not stretch to match text column height.
- YouTube icon inside `.bw-vt-play-link` was not sized (CSS selector had wrong class name `bw-vt-yt-icon--link`; corrected to `bw-vt-yt-icon`).

## [0.1.0] - 2026-06-08

### Added
- `bw/video-text` Gutenberg block — video + text side by side with 4 layout options.
- Layout 1: Video 60% left, Text 40% right (YouTube-style thumbnail with play button).
- Layout 2: Text 30% left with optional background colour, Video 70% right (fills column height).
- Layout 3: Text 35% left, Video 65% right (fills column height).
- Layout 4: Video 50% left, Text 50% right (compact thumbnail + play button).
- Video source: YouTube URL (auto-extracts ID and thumbnail) or media-library MP4 upload.
- Click-to-play: thumbnail replaced by iframe / HTML5 video with autoplay on click.
- Inline text editing via Gutenberg RichText for heading and body.
- Sidebar controls: heading tag (H1–H6), font size, font weight, font style.
- Colour controls: play button, heading, body text, text block background.
- Responsive: stacks to single column on ≤768 px; video always first on mobile.