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:
@@ -78,6 +78,29 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{!-- Story 5.2: Video widget width customization --}}
|
||||
<div class="directors-board__widget-width-bar" role="toolbar" aria-label="{{localize 'scrying-pool.directorsBoard.widgetWidth.label'}}">
|
||||
<span class="directors-board__widget-width-label">{{localize "scrying-pool.directorsBoard.widgetWidth.label"}}</span>
|
||||
<div class="directors-board__widget-width-group">
|
||||
<div class="directors-board__widget-width-row">
|
||||
<span>{{localize "scrying-pool.directorsBoard.widgetWidth.small"}}</span>
|
||||
<select class="directors-board__widget-width-select" data-action="set-widget-width-sm" data-selected="{{widgetWidthSm}}">
|
||||
{{#each widthOptions}}
|
||||
<option value="{{this.value}}">{{this.label}}</option>
|
||||
{{/each}}
|
||||
</select>
|
||||
</div>
|
||||
<div class="directors-board__widget-width-row">
|
||||
<span>{{localize "scrying-pool.directorsBoard.widgetWidth.large"}}</span>
|
||||
<select class="directors-board__widget-width-select" data-action="set-widget-width-md" data-selected="{{widgetWidthMd}}">
|
||||
{{#each widthOptions}}
|
||||
<option value="{{this.value}}">{{this.label}}</option>
|
||||
{{/each}}
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<footer class="directors-board__footer">
|
||||
<div class="directors-board__footer-group directors-board__footer-group--presets">
|
||||
<button type="button" class="directors-board__footer-btn" data-action="save-preset"
|
||||
|
||||
Reference in New Issue
Block a user