PHP code example of suraj-kashyap-dev / vesper

1. Go to this page and download the library: Download suraj-kashyap-dev/vesper 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/ */

suraj-kashyap-dev / vesper example snippets


use Kashyap\Vesper\Enums\ThemePreset;
use Kashyap\Vesper\VesperPlugin;

$panel->plugin(
    VesperPlugin::make()
        ->preset(ThemePreset::Sunset),
);


use Filament\Enums\ThemeMode;
use Filament\Support\Enums\Width;
use Kashyap\Vesper\Enums\ThemePreset;
use Kashyap\Vesper\VesperPlugin;

$panel->plugin(
    VesperPlugin::make()
        ->preset(ThemePreset::Emerald)
        ->branding(name: 'Acme', eyebrow: 'Acme Admin', mark: 'AC')
        ->header(helpUrl: 'https://example.com/docs', showHelpUrl: true, showThemeToggle: true)
        ->sidebar(overviewLabel: 'Overview', userRole: 'Owner')
        ->fonts(
            body: "'Instrument Sans', sans-serif",
            mono: "'JetBrains Mono', monospace",
            heading: "'Sora', sans-serif",
        )
        ->colors([
            'primary' => 'teal',
            'info' => 'sky',
        ])
        ->tokens([
            'shared' => [
                'vs-control-radius' => '999px',
                'vs-user-menu-width' => '18rem',
                'vs-brand-gradient-end' => '#123456',
            ],
            'light' => ['vs-surface-2' => '#eefbf5'],
            'dark' => ['vs-surface-3' => '#173328'],
        ])
        ->layout([
            'default_theme_mode' => ThemeMode::System,
            'sidebar_width' => '17rem',
            'global_search_key_bindings' => ['mod+k', 'ctrl+/'],
            'max_content_width' => Width::SevenExtraLarge,
        ]),
);


use Kashyap\Vesper\Theme\Presets\AbstractPreset;
use Kashyap\Vesper\VesperPlugin;

class MidnightPreset extends AbstractPreset
{
    public function key(): string
    {
        return 'midnight';
    }

    public function colors(): array
    {
        return ['primary' => 'indigo', 'gray' => 'slate'];
    }

    protected function paletteTokens(): array
    {
        return [
            'shared' => ['vs-accent' => '#6366f1', 'vs-accent-strong' => '#4f46e5'],
            'dark' => ['vs-accent-2' => '#a5b4fc'],
        ];
    }
}

$panel->plugin(
    VesperPlugin::make()
        ->registerPreset(new MidnightPreset)
        ->preset('midnight'),
);

bash
php artisan vendor:publish --tag="vesper-config"

bash
php artisan test tests/Filament/Pages/TopbarOverrideTest.php
php artisan test tests/Filament/Pages/ThemeCustomizationTest.php