Make two sections appear side by side
I've got an infolist with two sections. I'd like them so appear 50% width each, side by side on the screen instead of one above the other.
Does Filament provide a built-in way to do this or do I need to add my own css?
Section::make('customer')
->collapsible()
->columns([
'sm' => 2,
'xl' => 4,
'2xl' => 8,
])
->schema([
TextEntry::make(''firstname)
->label('First name'),
TextEntry::make('lastname')
->label('Last name'),
]),
Section::make('address')
->collapsible()
->columns([
'sm' => 2,
'xl' => 4,
'2xl' => 8,
])
->schema([
TextEntry::make('address1')
->label('Address 1'),
TextEntry::make('address2')
->label('Address 2'),
]),
Does Filament provide a built-in way to do this or do I need to add my own css?
Section::make('customer')
->collapsible()
->columns([
'sm' => 2,
'xl' => 4,
'2xl' => 8,
])
->schema([
TextEntry::make(''firstname)
->label('First name'),
TextEntry::make('lastname')
->label('Last name'),
]),
Section::make('address')
->collapsible()
->columns([
'sm' => 2,
'xl' => 4,
'2xl' => 8,
])
->schema([
TextEntry::make('address1')
->label('Address 1'),
TextEntry::make('address2')
->label('Address 2'),
]),
Solution
Use
Use
You can nest Group and Grid (and other layout) components as mush as you need. Not only to change visual layout, but also to collectively show/hide/readonly them.
In your case, make a
->columns() on layout components to state how many cols there are.Use
->columnSpan() on field components to state how many cols they take up.You can nest Group and Grid (and other layout) components as mush as you need. Not only to change visual layout, but also to collectively show/hide/readonly them.
In your case, make a
Grid::make(2) (2 is the default) and put your sections in its ->schema.