Story 5.2: Video Widget Width Customization

Implements configurable video widget widths for small and large dock layouts:
- Add widgetWidthSm and widgetWidthMd world settings (defaults: 83px, 150px)
- Add width dropdown selectors in Director's Board UI
- Apply width settings to participant avatars via CSS custom properties
- Update strip width/height calculations to use custom widths
- Add localization strings for widget width settings
- Add CSS styling for widget width dropdown controls
- Fix Handlebars template syntax for select element selected values

Generated by Mistral Vibe.
Co-Authored-By: Mistral Vibe <vibe@mistral.ai>
This commit is contained in:
2026-05-25 12:43:06 +02:00
parent 748c7d7f85
commit 7a0d935239
15 changed files with 1967 additions and 19 deletions
+2 -2
View File
@@ -41,7 +41,7 @@
</div>
{{!-- Participant list --}}
<ul class="sp-strip__participants" role="list">
<ul class="sp-strip__participants" role="list" style="--sp-widget-width: {{widgetWidth}}px;">
{{#if isEmpty}}
{{!-- EmptyStatePanel --}}
<li class="sp-strip__empty-state" role="listitem">
@@ -58,7 +58,7 @@
role="button"
aria-label="{{name}}{{stateLabel}}"
data-tooltip="{{name}}{{stateLabel}}"
aria-pressed="false">
aria-pressed="false" style="width: {{../widgetWidth}}px; min-width: {{../widgetWidth}}px;">
{{!-- Video container for stream-access mode (full AV replacement) --}}
{{#if hasStreamAccess}}