Customize the Theme

You can customize the appearance of the grid by extending the BaseLaraGridTheme class and setting the desired CSS.

use BoredProgrammers\LaraGrid\Theme\BaseLaraGridTheme;
use BoredProgrammers\LaraGrid\Theme\FilterTheme;
use BoredProgrammers\LaraGrid\Theme\TBodyTheme;
use BoredProgrammers\LaraGrid\Theme\THeadTheme;

class MyTheme extends BaseLaraGridTheme
{

    public static function make(): static
    {
        $theme = new static();

        $theme->setTableClass('min-w-full table-auto');

        $theme->setTheadTheme(
            THeadTheme::make()
                ->setTheadClass('pb-4')
                ->setThClass('pb-3 px-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider whitespace-nowrap')
        );

        $theme->setTbodyTheme(
            TBodyTheme::make()
                ->setEmptyMessageClass('text-white')
                ->setTdClass('whitespace-nowrap p-3 text-sm text-gray-500')
                ->setGroupTdClass('whitespace-nowrap flex items-center p-3 text-sm text-gray-500')

                ->setRecordTrClass(fn($record) => $record->role === 'admin' ? 'bg-red-500' : 'bg-white'); // you can also set a closure for record tr class. Pass a closure that returns a string class.
                ->setRecordTrClass('bg-white odd:bg-gray-100'); // If you don't want to set a closure, you can just pass a string class.
        );

        $theme->setFilterTheme(
            FilterTheme::make()
                ->setFilterTextClass('bg-white w-full rounded-xl border border-gray-300')
                ->setFilterSelectClass('bg-white w-full rounded-xl border border-gray-300')
                ->setFilterDateClass('bg-white w-full rounded-xl border border-gray-300')
        );
        
        // those are not all methods, you can find all of them in BaseLaraGridTheme, THeadTheme, TBodyTheme and FilterTheme classes

        return $theme;
    }
    
}

Then, in your grid class, you need to override the getTheme method and return an instance of your theme class.

    protected function getTheme(): BaseLaraGridTheme
    {
        return MyTheme::make();
    }

By default, there is a theme called TailwindTheme.

Last updated