Merge pull request #7834 from tanshiqi/3.x

Add more options to maximum content width
filamentphp · Aug 17, 2023 · 1ae14a3 · 1ae14a3
2 parents 67c0366 + 85d0770
commit 1ae14a3
Show file tree

Hide file tree

Showing 4 changed files with 9 additions and 3 deletions.
diff --git a/packages/panels/dist/theme.css b/packages/panels/dist/theme.css
diff --git a/packages/panels/docs/04-pages.md b/packages/panels/docs/04-pages.md
@@ -295,7 +295,7 @@ This example assumes you have a Blade view at `resources/views/filament/settings
 
 ## Customizing the maximum content width
 
-By default, Filament will restrict the width of the content on the page, so it doesn't become too wide on large screens. To change this, you may override the `getMaxContentWidth()` method. Options correspond to [Tailwind's max-width scale](https://tailwindcss.com/docs/max-width). The options are `xs`, `sm`, `md`, `lg`, `xl`, `2xl`, `3xl`, `4xl`, `5xl`, `6xl`, `7xl`, and `full`. The default is `7xl`:
+By default, Filament will restrict the width of the content on the page, so it doesn't become too wide on large screens. To change this, you may override the `getMaxContentWidth()` method. Options correspond to [Tailwind's max-width scale](https://tailwindcss.com/docs/max-width). The options are `xs`, `sm`, `md`, `lg`, `xl`, `2xl`, `3xl`, `4xl`, `5xl`, `6xl`, `7xl`, `prose`, `screen-sm`, `screen-md`, `screen-lg`, `screen-xl`, `screen-2xl` and `full`. The default is `7xl`:
 
 ```php
 public function getMaxContentWidth(): ?string

diff --git a/packages/panels/docs/09-configuration.md b/packages/panels/docs/09-configuration.md
@@ -100,7 +100,7 @@ public function panel(Panel $panel): Panel
 
 ## Customizing the maximum content width
 
-By default, Filament will restrict the width of the content on a page, so it doesn't become too wide on large screens. To change this, you may use the `maxContentWidth()` method. Options correspond to [Tailwind's max-width scale](https://tailwindcss.com/docs/max-width). The options are `xs`, `sm`, `md`, `lg`, `xl`, `2xl`, `3xl`, `4xl`, `5xl`, `6xl`, `7xl`, and `full`. The default is `7xl`:
+By default, Filament will restrict the width of the content on a page, so it doesn't become too wide on large screens. To change this, you may use the `maxContentWidth()` method. Options correspond to [Tailwind's max-width scale](https://tailwindcss.com/docs/max-width). The options are `xs`, `sm`, `md`, `lg`, `xl`, `2xl`, `3xl`, `4xl`, `5xl`, `6xl`, `7xl`, `prose`, `screen-sm`, `screen-md`, `screen-lg`, `screen-xl`, `screen-2xl` and `full`. The default is `7xl`:
 
 ```php
 use Filament\Panel;

diff --git a/packages/panels/resources/views/components/layout/index.blade.php b/packages/panels/resources/views/components/layout/index.blade.php
@@ -49,6 +49,12 @@ class="fi-sidebar-close-overlay fixed inset-0 z-30 bg-gray-950/50 transition dur
                         '5xl' => 'max-w-5xl',
                         '6xl' => 'max-w-6xl',
                         '7xl' => 'max-w-7xl',
+                        'prose' => 'max-w-prose',
+                        'screen-sm' => 'max-w-screen-sm',
+                        'screen-md' => 'max-w-screen-md',
+                        'screen-lg' => 'max-w-screen-lg',
+                        'screen-xl' => 'max-w-screen-xl',
+                        'screen-2xl' => 'max-w-screen-2xl',
                         'full' => 'max-w-full',
                         default => $maxContentWidth,
                     },