Custom styles

public function table(Table $table): Table
{
return $table
->query(Course::query())
->columns([

Stack::make([
ImageColumn::make('image')
->width(400)
->height(300)
//->extraAttributes(['class' => 'h-auto', 'm-auto', 'rounded-lg', 'sm:w-32'])
->toggleable(),
// ->size(370),
Grid::make([
'sm' => 2,
'xl' => 2,
'2xl' => 2,
])->schema([
ImageColumn::make('image')->circular()->extraAttributes(['class' => 'mt-2', 'sm:w-80', 'sm:m-0']),
TextColumn::make('name')
->extraAttributes(['class' => 'mt-2', 'text-4xl'])
->weight(FontWeight::Black)
->size(TextColumnSize::Large)
->searchable(),
])->extraAttributes(['class' => 'gap-0']),

TextColumn::make('details')
->searchable()
->weight(FontWeight::SemiBold)
->size(TextColumnSize::Medium)
->toggleable(isToggledHiddenByDefault: true)
->extraAttributes(['class' => 'my-4']),
])->extraAttributes(['style' => 'max-width:720px', 'max-w-screen-lg', 'class' => 'bg-blue-200']),

])
->contentGrid([
'md' => 3,
'sm' => 2,
])

}
public function table(Table $table): Table
{
return $table
->query(Course::query())
->columns([

Stack::make([
ImageColumn::make('image')
->width(400)
->height(300)
//->extraAttributes(['class' => 'h-auto', 'm-auto', 'rounded-lg', 'sm:w-32'])
->toggleable(),
// ->size(370),
Grid::make([
'sm' => 2,
'xl' => 2,
'2xl' => 2,
])->schema([
ImageColumn::make('image')->circular()->extraAttributes(['class' => 'mt-2', 'sm:w-80', 'sm:m-0']),
TextColumn::make('name')
->extraAttributes(['class' => 'mt-2', 'text-4xl'])
->weight(FontWeight::Black)
->size(TextColumnSize::Large)
->searchable(),
])->extraAttributes(['class' => 'gap-0']),

TextColumn::make('details')
->searchable()
->weight(FontWeight::SemiBold)
->size(TextColumnSize::Medium)
->toggleable(isToggledHiddenByDefault: true)
->extraAttributes(['class' => 'my-4']),
])->extraAttributes(['style' => 'max-width:720px', 'max-w-screen-lg', 'class' => 'bg-blue-200']),

])
->contentGrid([
'md' => 3,
'sm' => 2,
])

}
extraAttributes for image column doesn't work. How do i make it work? Also some just don't work
5 Replies
antiquarian_capsaicin
Also it's for a livewire page So I'm using the table for the livewire page
Dennis Koch
Dennis Koch12mo ago
If you use custom Tailwind classes you need to use a custom theme
antiquarian_capsaicin
So when creating the theme do i add the specific filename to the command or...?
Dennis Koch
Dennis Koch12mo ago
You need to make sure your files are in your tailwind and vite config. But the docs on themes should explain this
antiquarian_capsaicin
ok thanks
Want results from more Discord servers?
Add your server