PHP code example of irajul / filament-shadcn-theme

1. Go to this page and download the library: Download irajul/filament-shadcn-theme library. Choose the download type require.

2. Extract the ZIP file and open the index.php.

3. Add this code to the index.php. 
    
        
<?php
require_once('vendor/autoload.php');

/* Start to develop here. Best regards https://php-download.com/ */

irajul / filament-shadcn-theme example snippets




namespace App\Providers\Filament;

use Filament\Enums\ThemeMode;
use Filament\Panel;
use Filament\PanelProvider;
use Irajul\FilamentShadcnTheme\Enums\BaseColor;
use Irajul\FilamentShadcnTheme\Enums\MenuAccent;
use Irajul\FilamentShadcnTheme\Enums\Radius;
use Irajul\FilamentShadcnTheme\Enums\SidebarVariant;
use Irajul\FilamentShadcnTheme\Enums\StyleVariant;
use Irajul\FilamentShadcnTheme\Enums\SurfaceShadow;
use Irajul\FilamentShadcnTheme\Enums\ThemeColor;
use Irajul\FilamentShadcnTheme\FilamentShadcnThemePlugin;

class AdminPanelProvider extends PanelProvider
{
    public function panel(Panel $panel): Panel
    {
        return $panel
            ->defaultThemeMode(ThemeMode::Dark)
            ->darkMode(true)
            ->plugin(
                FilamentShadcnThemePlugin::make()
                    ->style(StyleVariant::Lyra)
                    ->baseColor(BaseColor::Taupe)
                    ->themeColor(ThemeColor::Taupe)
                    ->chartColor(ThemeColor::Taupe)
                    ->font('inter')
                    ->headingFont('inherit')
                    ->radius(Radius::None)
                    ->menuAccent(MenuAccent::Subtle)
                    ->sidebarVariant(SidebarVariant::Sidebar)
                    ->surfaceShadow(SurfaceShadow::ExtraSmall)
            );
    }
}


[
    'style' => 'lyra',
    'base_color' => 'taupe',
    'theme_color' => 'taupe',
    'chart_color' => null,
    'font' => 'inter',
    'heading_font' => 'inherit',
    'icon_library' => 'lucide',
    'css_mode' => 'inline',
    'radius' => 'none',
    'menu_color' => 'default',
    'menu_accent' => 'subtle',
    'sidebar_variant' => 'sidebar',
    'surface_shadow' => 'xs',
]


StyleVariant::Vega
StyleVariant::Nova
StyleVariant::Maia
StyleVariant::Lyra
StyleVariant::Mira
StyleVariant::Luma
StyleVariant::Sera


BaseColor::Neutral
BaseColor::Stone
BaseColor::Zinc
BaseColor::Mauve
BaseColor::Olive
BaseColor::Mist
BaseColor::Taupe


ThemeColor::Neutral
ThemeColor::Stone
ThemeColor::Zinc
ThemeColor::Mauve
ThemeColor::Olive
ThemeColor::Mist
ThemeColor::Taupe
ThemeColor::Amber
ThemeColor::Blue
ThemeColor::Cyan
ThemeColor::Emerald
ThemeColor::Fuchsia
ThemeColor::Green
ThemeColor::Indigo
ThemeColor::Lime
ThemeColor::Orange
ThemeColor::Pink
ThemeColor::Purple
ThemeColor::Red
ThemeColor::Rose
ThemeColor::Sky
ThemeColor::Teal
ThemeColor::Violet
ThemeColor::Yellow


->chartColor(ThemeColor::Emerald)


->font('Geist')
->headingFont('Space Grotesk')


Radius::Default // 0.625rem
Radius::None    // 0
Radius::Small   // 0.45rem
Radius::Medium  // 0.625rem
Radius::Large   // 0.875rem


IconLibrary::Lucide
IconLibrary::Heroicons
IconLibrary::Tabler
IconLibrary::Phosphor
IconLibrary::Radix


CssMode::Inline
CssMode::CachedAsset


FilamentShadcnThemePlugin::make()
    ->cssMode('cached-asset')


MenuColor::Default
MenuColor::Inverted
MenuColor::DefaultTranslucent
MenuColor::InvertedTranslucent


MenuAccent::Subtle
MenuAccent::Bold


SidebarVariant::Sidebar
SidebarVariant::Floating
SidebarVariant::Inset


SurfaceShadow::None
SurfaceShadow::ExtraSmall
SurfaceShadow::Small
SurfaceShadow::Medium


FilamentShadcnThemePlugin::make()
    ->tokens(
        light: [
            'background' => 'oklch(1 0 0)',
            'primary' => 'oklch(0.55 0.18 140)',
        ],
        dark: [
            'background' => 'oklch(0.16 0.01 90)',
            'primary' => 'oklch(0.78 0.2 140)',
        ],
    );


FilamentShadcnThemePlugin::make()
    ->styleVariables([
        'fs-sidebar-width' => '18rem',
        'fs-main-padding-y' => '1rem',
        'fs-table-cell-padding-y' => '0.35rem',
        'fs-table-edge-padding-x' => '0.875rem',
    ]);


FilamentShadcnThemePlugin::make()
    ->selectorMap([
        'card' => '.fi-section, .custom-admin-card',
        'button' => '.fi-btn, .custom-admin-button',
    ]);


return [
    'style' => 'lyra',
    'base_color' => 'taupe',
    'theme_color' => 'taupe',
    'chart_color' => 'emerald',
    'font' => 'inter',
    'heading_font' => 'inherit',
    'icon_library' => 'lucide',
    'css_mode' => 'inline',
    'radius' => 'none',
    'menu_color' => 'default',
    'menu_accent' => 'subtle',
    'sidebar_variant' => 'sidebar',
    'surface_shadow' => 'xs',
    'apply_panel_font' => true,
    'default_theme_mode' => 'dark',
    'dark_mode' => true,
    'force_dark_mode' => false,
    'token_overrides' => [
        'light' => [],
        'dark' => [],
    ],
    'style_overrides' => [],
    'selector_map' => [],
];


->plugin(FilamentShadcnThemePlugin::make())

bash
php artisan filament-shadcn-theme:cache --panel=admin
php artisan filament-shadcn-theme:clear --panel=admin