New in v6: How to enable dark-mode on Backpack 🌑✨

Hello fellow developers! Are you ready to embrace the dark side? Starting from Backpack v6, we've got you covered with a sleek dark mod...

Hello fellow developers! Are you ready to embrace the dark side? Starting from Backpack v6, we've got you covered with a sleek dark mode for the default theme, Tabler. It's beautiful, legible, and designed to give you the best user experience.

Installation:

Let's get you set up with dark mode in just a few simple steps:

Step 1: Install via Composer Start by installing the Tabler theme using Composer:

composer require backpack/theme-tabler

Step 2: Update Your View Namespace Head over to config/backpack/ui.php and update the view namespace:

- 'view_namespace' => 'backpack::',
+ 'view_namespace' => 'backpack.theme-tabler::',

Step 3: Publish the Theme Config File If you want to customize the dark mode behavior, you can publish the theme config file:

php artisan vendor:publish --tag="theme-tabler-config"

After publishing, you'll find the config file at config/backpack/theme-tabler.php. This file contains various options, including the ability to set the default color mode, toggle the color mode switcher, and more.

Here's an overview of the options you can tweak in the config file:

'options' => [
    /**
     * The color mode used by default.
     */
    'defaultColorMode' => 'system', // system, light, dark

    /**
     * When true, a switch is displayed to let admins choose their favorite theme mode.
     * When false, the theme will only use the "defaultColorMode" set above.
     * In case "defaultColorMode" is null, system is the default.
     */
    'showColorModeSwitcher' => true,
]

With these simple steps, you've enabled the dark mode in Backpack v6. Now you can enjoy a beautiful and user-friendly dark interface. If you ever need to change the color mode behavior, just tweak the options in the config file to suit your preferences.

Happy coding, and may the dark mode be with you! 🌑✨