isaaccladandCursor
1037cd6ee6
Deploy Ladill Meet / deploy (push) Successful in 37s
Speakers get a full-screen spotlight with overlapping audience avatars; hosts can configure panels in the green room and switch layouts live. Co-authored-by: Cursor <cursoragent@cursor.com>
53 lines
2.1 KiB
PHP
53 lines
2.1 KiB
PHP
@props([
|
|
'show',
|
|
'title' => null,
|
|
])
|
|
|
|
<aside x-show="{{ $show }}" x-cloak
|
|
class="meet-room-panel"
|
|
@keydown.escape.window="{{ $show }} = false">
|
|
<div x-show="{{ $show }}"
|
|
x-transition:enter="transition-opacity ease-out duration-200"
|
|
x-transition:enter-start="opacity-0"
|
|
x-transition:enter-end="opacity-100"
|
|
x-transition:leave="transition-opacity ease-in duration-150"
|
|
x-transition:leave-start="opacity-100"
|
|
x-transition:leave-end="opacity-0"
|
|
class="meet-room-panel__backdrop"
|
|
@click="{{ $show }} = false"
|
|
aria-hidden="true"></div>
|
|
|
|
<div x-show="{{ $show }}"
|
|
x-transition:enter="transition ease-out duration-300"
|
|
x-transition:enter-start="translate-y-full sm:translate-y-0"
|
|
x-transition:enter-end="translate-y-0"
|
|
x-transition:leave="transition ease-in duration-200"
|
|
x-transition:leave-start="translate-y-0"
|
|
x-transition:leave-end="translate-y-full sm:translate-y-0"
|
|
class="meet-room-panel__sheet">
|
|
<div class="meet-room-panel__handle" aria-hidden="true"><span></span></div>
|
|
|
|
<div class="meet-room-panel__header">
|
|
<div class="min-w-0">
|
|
@isset($header)
|
|
{{ $header }}
|
|
@elseif ($title)
|
|
<h2 class="text-sm font-semibold text-white">{{ $title }}</h2>
|
|
@endif
|
|
@isset($subtitle)
|
|
<div class="text-xs text-slate-400">{{ $subtitle }}</div>
|
|
@endisset
|
|
</div>
|
|
<button @click="{{ $show }} = false" type="button"
|
|
class="shrink-0 rounded-lg p-2 text-slate-400 transition-colors hover:bg-slate-800 hover:text-white"
|
|
title="Close">
|
|
<svg class="h-5 w-5" fill="none" stroke="currentColor" stroke-width="1.5" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" d="M6 18 18 6M6 6l12 12"/></svg>
|
|
</button>
|
|
</div>
|
|
|
|
<div class="meet-room-panel__body">
|
|
{{ $slot }}
|
|
</div>
|
|
</div>
|
|
</aside>
|