October 21, 2024
Chicago 12, Melborne City, USA
CSS

New Filament project Styling not applied correctly


I just created a new filament project, no custom pages.
Just added a filament resource ‘customers’ and with some basic textInputs in the form and table:

public static function form(Form $form): Form
{
    return $form
    ->schema([
       TextInput::make('first_name')
            ->label('First Name')
            ->required(),

       TextInput::make('last_name')
            ->label('Last Name')
            ->required(),

       TextInput::make('phone_number')
            ->label('Phone number')
            ->required(),

       TextInput::make('email')
            ->label('Email')
            ->required(),

       Select::make('status')
            ->options(collect(CustomerStatus::cases())->mapWithKeys(fn($case) => [$case->value => $case->getLabel()]))
            ->default(CustomerStatus::NEW),
    ]);
}

public static function table(Table $table): Table
{
    return $table
    ->columns([
        TextColumn::make('first_name')
            ->label('First Name')
            ->searchable(),
        TextColumn::make('last_name')
            ->label('Last Name')
            ->searchable(),

        TextColumn::make('status')
            ->label('Status')
            ->badge(),

        TextColumn::make('phone_number')
            ->label('Phone number')
            ->searchable(),

        TextColumn::make('email')
            ->label('Email')
            ->searchable(),

        TextColumn::make('created_at')
            ->label('Created at')
            ->dateTime(),
    ])
    ->filters([
        SelectFilter::make('status')
            ->label('Status')
            ->options(CustomerStatus::class),
    ])
    ->actions([
        Tables\Actions\EditAction::make(),
    ])
    ->bulkActions([
        Tables\Actions\DeleteBulkAction::make(),
    ]);
}

but when i run ‘php artisan serve’ i only get the raw html of the pages without any styling. I didn’t set-up any nginx and i’m just using http://localhost for testing. any idea of the issue?

admin panel page
some of the console errors



You need to sign in to view this answers

Leave feedback about this

  • Quality
  • Price
  • Service

PROS

+
Add Field

CONS

+
Add Field
Choose Image
Choose Video