Adjust controls
fantomas-code opened this issue · 0 comments
fantomas-code commented
How could I adjust these controls so they don't overflow my modal?
I am using Tailwind CSS and Laravel 8
<x-jet-dialog-modal wire:model="modalForm">
<x-slot name="title">
<span class="italic">
{{ __(' Página a crear ▼') }}
</span>
</x-slot>
<x-slot name="content">
<div class="mt-4 italic">
<x-jet-label for="titulo" value="{{ __('Titulo') }}" class="text-lg" />
<x-jet-input id="titulo" class="block mt-1 w-full" type="text" wire:model.debounce.800ms='titulo' />
</div>
<div class="mt-4 italic">
<x-jet-label for="url" value="{{ __('Url') }}" class="text-lg" />
<x-jet-input id="titulo" class="block mt-1 w-full" type="text" wire:model='url' placeholder='url-del-articulo'/>
</div>
<div class="mt-4 italic">
<x-jet-label for="cont" value="{{ __('Contenido') }}" class="text-lg" />
<div class="rounded-md shadow-sm w-full ">
<div wire:ignore class=" ">
<trix-editor class="trix-content" x-ref='trix' wire:model.debounce.100000ms='contenido' wire:key='trix-content-unique-key'>
</trix-editor>
</div>
</div >
</div>
</x-slot>
<x-slot name="footer">
<x-jet-secondary-button wire:click="$toggle('modalForm')" wire:loading.attr="disabled">
{{ __('Cancelar') }}
</x-jet-secondary-button>
<x-jet-button class="ml-2 bg-purple-900" wire:click="crearPag" wire:loading.attr="disabled">
{{ __('Guardar !!') }}
</x-jet-button>
</x-slot>
</x-jet-dialog-modal>