add media stuff

This commit is contained in:
Benjamin Takats
2022-12-03 19:44:41 +01:00
parent 3749c3653b
commit a8fa8ecc5b
16 changed files with 219 additions and 24 deletions

View File

@@ -1,6 +1,6 @@
@props(['id' => null, 'maxWidth' => null])
@props(['id' => null, 'maxWidth' => null, 'bg' => 'bg-white'])
<x-jet-modal :id="$id" :maxWidth="$maxWidth" {{ $attributes }}>
<x-jet-modal :id="$id" :maxWidth="$maxWidth" :bg="$bg" {{ $attributes }}>
<div class="px-6 py-4">
<div class="text-lg">
{{ $title }}
@@ -11,7 +11,7 @@
</div>
</div>
<div class="flex flex-row justify-end px-6 py-4 bg-gray-100 text-right">
<div class="flex flex-row justify-end px-6 py-4 {{ $bg }} text-right">
{{ $footer }}
</div>
</x-jet-modal>

View File

@@ -1,4 +1,4 @@
@props(['id', 'maxWidth'])
@props(['id', 'maxWidth', 'bg'])
@php
$id = $id ?? md5($attributes->wire('model'));
@@ -9,6 +9,7 @@ $maxWidth = [
'lg' => 'sm:max-w-lg',
'xl' => 'sm:max-w-xl',
'2xl' => 'sm:max-w-2xl',
'screen' => 'sm:max-w-screen-lg',
][$maxWidth ?? '2xl'];
@endphp
@@ -53,10 +54,10 @@ $maxWidth = [
x-transition:leave="ease-in duration-200"
x-transition:leave-start="opacity-100"
x-transition:leave-end="opacity-0">
<div class="absolute inset-0 bg-gray-500 opacity-75"></div>
<div class="absolute inset-0 {{ $bg }} opacity-75"></div>
</div>
<div x-show="show" class="mb-6 bg-white rounded-lg overflow-hidden shadow-xl transform transition-all sm:w-full {{ $maxWidth }} sm:mx-auto"
<div x-show="show" class="mb-6 {{ $bg }} rounded-lg overflow-hidden shadow-xl transform transition-all sm:w-full {{ $maxWidth }} sm:mx-auto"
x-transition:enter="ease-out duration-300"
x-transition:enter-start="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95"
x-transition:enter-end="opacity-100 translate-y-0 sm:scale-100"