Thank you for purchasing my addon!

Please upload all files from the 'pterodactyl' folder to your panel installation, and then follow the steps below:

=== app/Http/ViewComposers/AssetComposer.php

---------------------------------------------------------------------------
= Under:
use Pterodactyl\Services\Helpers\AssetHashService;

= Add:
use Pterodactyl\Contracts\Repository\SettingsRepositoryInterface;
---------------------------------------------------------------------------
= Replace:
public function __construct(private AssetHashService $assetHashService)

= With:
public function __construct(
    private AssetHashService $assetHashService,
    private SettingsRepositoryInterface $settings
)
---------------------------------------------------------------------------
= Under:
'locale' => config('app.locale') ?? 'en',

= Add:
'theme' => [
    'gray_50' => $this->settings->get('settings::theme:gray_50') ?? config('theme.gray_50'),
    'gray_100' => $this->settings->get('settings::theme:gray_100') ?? config('theme.gray_100'),
    'gray_200' => $this->settings->get('settings::theme:gray_200') ?? config('theme.gray_200'),
    'gray_300' => $this->settings->get('settings::theme:gray_300') ?? config('theme.gray_300'),
    'gray_400' => $this->settings->get('settings::theme:gray_400') ?? config('theme.gray_400'),
    'gray_500' => $this->settings->get('settings::theme:gray_500') ?? config('theme.gray_500'),
    'gray_600' => $this->settings->get('settings::theme:gray_600') ?? config('theme.gray_600'),
    'gray_700' => $this->settings->get('settings::theme:gray_700') ?? config('theme.gray_700'),
    'gray_800' => $this->settings->get('settings::theme:gray_800') ?? config('theme.gray_800'),
    'gray_900' => $this->settings->get('settings::theme:gray_900') ?? config('theme.gray_900'),
],
---------------------------------------------------------------------------

=== routes\admin.php

---------------------------------------------------------------------------
= Under:
Route::get('/', [Admin\Settings\IndexController::class, 'index'])->name('admin.settings');

= Add:
Route::get('/theme', [Admin\Settings\ThemeController::class, 'index'])->name('admin.settings.theme');
---------------------------------------------------------------------------
= Under:
Route::patch('/', [Admin\Settings\IndexController::class, 'update']);

= Add:
Route::patch('/theme', [Admin\Settings\ThemeController::class, 'update']);
---------------------------------------------------------------------------

=== tailwind.config.js

---------------------------------------------------------------------------
= Replace:
const gray = {
    50: 'hsl(216, 33%, 97%)',
    100: 'hsl(214, 15%, 91%)',
    200: 'hsl(210, 16%, 82%)',
    300: 'hsl(211, 13%, 65%)',
    400: 'hsl(211, 10%, 53%)',
    500: 'hsl(211, 12%, 43%)',
    600: 'hsl(209, 14%, 37%)',
    700: 'hsl(209, 18%, 30%)',
    800: 'hsl(209, 20%, 25%)',
    900: 'hsl(210, 24%, 16%)',
};

= With:
const gray = {
    50: 'var(--gray-50)',
    100: 'var(--gray-100)',
    200: 'var(--gray-200)',
    300: 'var(--gray-300)',
    400: 'var(--gray-400)',
    500: 'var(--gray-500)',
    600: 'var(--gray-600)',
    700: 'var(--gray-700)',
    800: 'var(--gray-800)',
    900: 'var(--gray-900)',
};
---------------------------------------------------------------------------

=== resources/views/templates/wrapper.blade.php

---------------------------------------------------------------------------
= Under:
@import url('//fonts.googleapis.com/css?family=IBM+Plex+Mono|IBM+Plex+Sans:500&display=swap');

= Add:
:root {
    --gray-50: {{ $siteConfiguration['theme']['gray_50'] }};
    --gray-100: {{ $siteConfiguration['theme']['gray_100'] }};
    --gray-200: {{ $siteConfiguration['theme']['gray_200'] }};
    --gray-300: {{ $siteConfiguration['theme']['gray_300'] }};
    --gray-400: {{ $siteConfiguration['theme']['gray_400'] }};
    --gray-500: {{ $siteConfiguration['theme']['gray_500'] }};
    --gray-600: {{ $siteConfiguration['theme']['gray_600'] }};
    --gray-700: {{ $siteConfiguration['theme']['gray_700'] }};
    --gray-800: {{ $siteConfiguration['theme']['gray_800'] }};
    --gray-900: {{ $siteConfiguration['theme']['gray_900'] }};
}
---------------------------------------------------------------------------

=== resources/views/partials/admin/settings/nav.blade.php

---------------------------------------------------------------------------
= Under:
<li @if($activeTab === 'basic')class="active"@endif><a href="{{ route('admin.settings') }}">General</a></li>

= Add:
<li @if($activeTab === 'theme')class="active"@endif><a href="{{ route('admin.settings.theme') }}">Theme</a></li>
---------------------------------------------------------------------------

=== resources/scripts/components/NavigationBar.tsx

---------------------------------------------------------------------------
= Replace:
${tw`text-neutral-100 bg-black`};

= With:
${tw`text-neutral-100 bg-gray-800`};
---------------------------------------------------------------------------

=== resources/scripts/components/elements/button/style.module.css

---------------------------------------------------------------------------
= Replace:
@apply bg-gray-500/75 text-gray-200/75;

= With:
@apply bg-gray-500 bg-opacity-75 text-gray-200;
---------------------------------------------------------------------------

=== resources/scripts/components/elements/dialog/Dialog.tsx

---------------------------------------------------------------------------
= Replace:
<div className={'fixed inset-0 bg-gray-900/50 z-40'} />

= With:
<div className={'fixed inset-0 bg-gray-900 bg-opacity-50 z-40'} />
---------------------------------------------------------------------------

After editing the files, run the following commands on your pterodactyl machine:

- Install NodeJS and yarn (If you don't have it already)

curl -sL https://deb.nodesource.com/setup_16.x | sudo -E bash -
sudo apt install -y nodejs
npm i -g yarn

- Build panel assets

cd /var/www/pterodactyl
yarn install
yarn build:production
php artisan optimize
php artisan view:clear

If you encounter any issues, you can contact me in the following discord server: https://dc.bartoszeq.dev