modal
modal copied to clipboard
Please move maxWidths to config or consider adding Tailwind preffix support
Issue: currently, maxWidths is hardcoded in /modal/src/ModalComponent.php as follows:
protected static array $maxWidths = [
'sm' => 'sm:max-w-sm',
'md' => 'sm:max-w-md',
'lg' => 'sm:max-w-md md:max-w-lg',
'xl' => 'sm:max-w-md md:max-w-xl',
'2xl' => 'sm:max-w-md md:max-w-xl lg:max-w-2xl',
'3xl' => 'sm:max-w-md md:max-w-xl lg:max-w-3xl',
'4xl' => 'sm:max-w-md md:max-w-xl lg:max-w-3xl xl:max-w-4xl',
'5xl' => 'sm:max-w-md md:max-w-xl lg:max-w-3xl xl:max-w-5xl',
'6xl' => 'sm:max-w-md md:max-w-xl lg:max-w-3xl xl:max-w-5xl 2xl:max-w-6xl',
'7xl' => 'sm:max-w-md md:max-w-xl lg:max-w-3xl xl:max-w-5xl 2xl:max-w-7xl',
];
The thing is, there is no way to customize it. The thing is, I use Tailwind classes with tw- preffix in my code, so basically I have to adjust classes in modal.blade.php and modal.js with every new Wire Elements Modal version (overflow-y-hidden becomes tw-overflow-y-hidden in my code, for example).
Please consider allowing us - as I said earlier - to override maxWidths in config, or, alternatively, consider adding Tailwind preffix support.
Thanks!
Update: I ended up overriding modalMaxWidthClass in my code, as a work-around (to add tw- preffix to any Tailwind class):
public static function modalMaxWidthClass(): string
{
return str_replace(':', ':tw-', parent::modalMaxWidthClass());
}