force dark mode in Laravel Nova

This commit is contained in:
Benjamin Takats
2022-11-29 21:31:45 +01:00
parent 0c274f47ad
commit 0c6c44f224
8 changed files with 118 additions and 13 deletions

1
.gitignore vendored
View File

@@ -15,3 +15,4 @@ yarn-error.log
/.fleet
/.idea
/.vscode
auth.json

View File

@@ -15,10 +15,21 @@ class NovaServiceProvider extends NovaApplicationServiceProvider
public function boot()
{
parent::boot();
Nova::withBreadcrumbs();
// disable theme switcher
Nova::withoutThemeSwitcher();
// login with user id 1, if we are in local environment
if (app()->environment('local')) {
auth()->loginUsingId(1);
}
Nova::footer(function ($request) {
// return MIT license and date
return sprintf("%s %s - %s", date('Y'), config('app.name'), __('MIT License'));
});
}
/**

View File

@@ -48,7 +48,8 @@
"@php artisan package:discover --ansi"
],
"post-update-cmd": [
"@php artisan vendor:publish --tag=laravel-assets --ansi --force"
"@php artisan vendor:publish --tag=laravel-assets --ansi --force",
"@php artisan nova:publish"
],
"post-root-package-install": [
"@php -r \"file_exists('.env') || copy('.env.example', '.env');\""

View File

@@ -148,7 +148,7 @@ return [
|
*/
'currency' => 'USD',
'currency' => 'EUR',
/*
|--------------------------------------------------------------------------
@@ -162,15 +162,18 @@ return [
|
*/
// 'brand' => [
// 'logo' => resource_path('/img/example-logo.svg'),
'brand' => [
'logo' => resource_path('/img/einundzwanzig-horizontal-inverted.svg'),
// 'colors' => [
// "400" => "24, 182, 155, 0.5",
// "500" => "24, 182, 155",
// "600" => "24, 182, 155, 0.75",
// ]
// ],
'colors' => [
"400" => "247, 147, 26, 0.5", // rgba(247, 147, 26, 1)
"500" => "247, 147, 26, 0.75",
"600" => "247, 147, 26, 1",
// rgba(0, 180, 207, 1)
// rgba(21, 21, 21, 1)
]
],
/*
|--------------------------------------------------------------------------

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 5.9 KiB

View File

@@ -0,0 +1,13 @@
<svg viewBox="0 0 134 12" version="1.1" xmlns="http://www.w3.org/2000/svg">
<g>
<path
d="m133.83629 9.42089615c-.443181 1.77759655-2.24359 2.85941795-4.021394 2.41613355-1.777078-.4431808-2.858899-2.24369331-2.415511-4.02118615.442973-1.77780392 2.243382-2.85972904 4.020668-2.41654828 1.7777.44318074 2.859418 2.24390065 2.416237 4.02160088z"
fill="#f7931a"/>
<path
d="m132.080261 8.14548127c.066052-.44152167-.270118-.67887327-.729786-.83721136l.14911-.598097-.364064-.09073074-.145169.58233577c-.095708-.02384922-.194008-.04635044-.291687-.06864427l.146207-.58617239-.363857-.09073074-.149213.59788961c-.079221-.01804245-.15699-.03587751-.232478-.05464581l.000415-.00186647-.502078-.12536395-.096849.388846s.270119.06190429.264416.0657409c.14745.03681075.174099.13438518.16964.21173961-.408547 1.63844151 0 0-.408547 1.63844151-.018043.04479506-.063771.11198765-.166841.08647935.003629.0052883-.264623-.06605197-.264623-.06605197l-.180735.41673922.47377.11810549c.088138.02208645.174514.04520983.259541.06698521l-.150665.60494066.363649.0907308.149213-.59851181c.099338.02695999.195771.05184613.290131.07528059l-.148694.59571212.364063.0907307.150665-.6038001c.620806.1174834 1.087628.070096 1.284125-.49139764.158338-.45209828-.007881-.71288434-.334511-.88293965.23787-.05485322.41705-.21132484.464852-.53453364zm-.831819 1.16643431c-.112506.45209828-.873711.20769561-1.120499.14641348l.199919-.80143754c.246788.06159322 1.038167.18353532.92058.65502406zm.11261-1.17296693c-.102656.41124353-.736215.20230362-.941733.15107964l.181254-.72688279c.205518.05122398.867385.14682825.760479.57580315z"
fill="#fff"/>
<path
d="m7.63783784 11.9027027v-2.74054053h-4.8972973v-1.88108109h3.97297298v-2.74054054h-3.97297298v-1.8h4.8972973v-2.74054054l-7.63783784.01621621v11.88648649zm4.15135136.0162162v-11.9189189h-2.74054056v11.9189189zm4.3621621-.0162162v-6.94054054l3.8918919 6.94054054h2.9675677v-11.9027027h-2.7405407v6.95675676l-3.8756756-6.92432432h-2.9837838v11.87027026zm12.9405406.0162162c.6162162-.0108108 1.1972973-.1378378 1.7432432-.3810811.545946-.2432432 1.0216217-.5702702 1.4270271-.9810811.4054054-.4108107.7243243-.89189179.9567568-1.44324315.2324323-.55135136.3432431-1.13513518.3324324-1.75135139v-7.36216216h-2.7405406v7.37837838c0 .24864864-.0432432.48108108-.1297297.6972973s-.2108108.4054054-.372973.56756753c-.1621622.16216224-.3513513.29189191-.5675676.38918922-.2162162.0972973-.4432432.14594596-.681081.14594596-.4864866 0-.9081082-.16756761-1.2648649-.50270271-.3567568-.35675676-.5351352-.77297298-.5351352-1.24864865v-7.42702703h-2.7405405v7.44324325c.0108108.61621621.1324324 1.1945946.3648649 1.73513514.2324324.54054054.5648648 1.02702711.9972973 1.45945951.4216216.4108107.9027027.727027 1.4432433.9486486.5405405.2216216 1.1135134.3324324 1.7189189.3324324zm8.8378378-.0162162v-6.94054054l3.8918919 6.94054054h2.9675676v-11.9027027h-2.7405406v6.95675676l-3.8756756-6.92432432h-2.9837838v11.87027026zm10.7351352.0648649c.8108108-.0432433 1.5621621-.2243243 2.254054-.5432433.6918919-.3189189 1.2945946-.7432432 1.8081081-1.272973.5135135-.52972968.9162162-1.1432432 1.2081082-1.84054049.2918919-.69729729.4378377-1.44594595.4378377-2.24594594 0-.81081081-.1486486-1.57297297-.4459459-2.28648649-.2972973-.71351351-.7027027-1.34054054-1.2162162-1.88108108s-1.1189189-.97837838-1.8162162-1.31351351c-.6972973-.33513514-1.4405406-.52432432-2.2297297-.56756757v-.01621622h-2.7405406v11.9675676zm0-2.74978378v-6.4540541c.4216216.04324325.8108108.15945946 1.1675675.34864865.3567568.18918919.6702703.43243244.9405405.72972973.2702703.2972973.4810812.63783784.6324325 1.02162163.1513513.38378378.227027.78648648.227027 1.2081081 0 .41081082-.0756757.8-.227027 1.16756758-.1513513.36756756-.3594594.68918919-.6243243.96486486-.2648648.27567567-.5783784.5027027-.9405406.68108112-.3621621.17837833-.754054.28918914-1.1756756.33243243zm15.2918919 2.78221618v-2.74054053h-4.9135135l4.9783783-9.24324326-8.9189189-.01621621v2.75675676h4.3297297l-4.9783784 9.24324324zm7.0702702-.0162162 1.3621622-5.96756759 1.572973 5.96756759h2.708108l3.518919-11.9837838h-2.8702703l-1.9297297 6.60000001-1.7513513-6.60000001h-2.691892l-1.508108 6.63243243-2.2054055-6.63243243h-2.8864865l3.9567568 11.9837838zm10.5932433-.0810811.4864864-1.4432432h3.745946l.4702703 1.4432432h2.8864865l-3.8432433-11.9027027h-2.5945945l-4.0540541 11.9027027zm3.3567567-4.18970272h-1.9297297l.9891892-2.88648648zm7.7837838 4.18970272v-6.94054054l3.8918917 6.94054054h2.9675678v-11.9027027h-2.7405405v6.95675676l-3.8756757-6.92432432h-2.9837838v11.87027026zm17.3189192.0972973v-2.74054053h-4.913513l4.978377-9.24324326-8.918918-.01621621v2.75675676h4.32973l-4.978379 9.24324324zm3.81081-.0810811v-11.9189189h-2.74054v11.9189189zm7.281081.0324324c.313514 0 .62973-.0243243.948649-.072973.318919-.0486486.62973-.127027.932433-.2351351v.2918919h2.756756v-6.66486483h-5.14054v2.74054054h2.383784v.59999996c-.313514.22702708-.654054.38918923-1.021622.48648653-.367567.0972973-.737838.13243245-1.11081.10540544-.372974-.0270271-.735136-.11891895-1.086488-.27567573-.351351-.15675678-.667566-.37567566-.948648-.65675674-.313513-.31351351-.551351-.67027027-.713513-1.07027027-.162163-.4-.243243-.80540541-.243243-1.21621621 0-.41081082.08108-.81621623.243243-1.21621622.162162-.4.4-.75675676.713513-1.07027028.313513-.31351351.67027-.54864864 1.07027-.7054054.4-.15675675.805405-.23513513 1.216216-.23513513s.816217.07837838 1.216217.23513513c.4.15675676.756756.39189189 1.07027.7054054l1.945946-1.94594594c-.583784-.58378379-1.243243-1.02162162-1.978379-1.31351352-.735134-.29189188-1.486486-.43783783-2.254054-.43783783-.767567 0-1.518919.14594595-2.254054.43783783-.735134.2918919-1.394594.72972973-1.978377 1.31351352-.583784.58378379-1.01892 1.24324324-1.305407 1.97837838-.286486.73513513-.429729 1.48648649-.429729 2.25405406 0 .76756756.143243 1.51621621.429729 2.24594594.286487.72972975.721623 1.38648646 1.305407 1.97027027.583783.5837838 1.243243 1.0216216 1.978377 1.3135135.735135.2918919 1.486487.4378378 2.254054.4378378z"
fill="#000"/>
</g>
</svg>

After

Width:  |  Height:  |  Size: 6.0 KiB

View File

@@ -0,0 +1,60 @@
<!DOCTYPE html>
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}" dir="{{ \Laravel\Nova\Nova::rtlEnabled() ? 'rtl' : 'ltr' }}" class="h-full font-sans antialiased">
<head>
<meta name="theme-color" content="#fff">
<meta charset="utf-8">
<meta name="csrf-token" content="{{ csrf_token() }}">
<meta name="viewport" content="width=device-width"/>
<meta name="locale" content="{{ str_replace('_', '-', app()->getLocale()) }}"/>
@include('nova::partials.meta')
<!-- Styles -->
<link rel="stylesheet" href="{{ mix('app.css', 'vendor/nova') }}">
@if ($styles = \Laravel\Nova\Nova::availableStyles(request()))
<!-- Tool Styles -->
@foreach($styles as $asset)
<link rel="stylesheet" href="{!! $asset->url() !!}">
@endforeach
@endif
<script>
document.documentElement.classList.add('dark');
</script>
</head>
<body class="min-w-site text-sm font-medium min-h-full text-gray-500 dark:text-gray-400 bg-gray-100 dark:bg-gray-900">
@inertia
<div class="relative z-50">
<div id="notifications" name="notifications"></div>
</div>
<div>
<div id="dropdowns" name="dropdowns"></div>
<div id="modals" name="modals"></div>
</div>
<!-- Scripts -->
<script src="{{ mix('manifest.js', 'vendor/nova') }}"></script>
<script src="{{ mix('vendor.js', 'vendor/nova') }}"></script>
<script src="{{ mix('app.js', 'vendor/nova') }}"></script>
<!-- Build Nova Instance -->
<script>
const config = @json(\Laravel\Nova\Nova::jsonVariables(request()));
window.Nova = createNovaApp(config)
Nova.countdown()
</script>
@if ($scripts = \Laravel\Nova\Nova::availableScripts(request()))
<!-- Tool Scripts -->
@foreach ($scripts as $asset)
<script src="{!! $asset->url() !!}"></script>
@endforeach
@endif
<!-- Start Nova -->
<script defer>
Nova.liftOff()
</script>
</body>
</html>

View File

@@ -2,14 +2,29 @@ const defaultTheme = require('tailwindcss/defaultTheme')
/** @type {import('tailwindcss').Config} */
module.exports = {
content: [
content: [
'./vendor/laravel/framework/src/Illuminate/Pagination/resources/views/*.blade.php',
'./vendor/laravel/jetstream/**/*.blade.php',
'./storage/framework/views/*.php',
'./resources/views/**/*.blade.php',
],
darkMode: 'class',
theme: {
theme: {
colors: {
'gray': {
DEFAULT: '#151515',
'50': '#AEAEAE',
'100': '#A4A4A4',
'200': '#8F8F8F',
'300': '#7B7B7B',
'400': '#676767',
'500': '#525252',
'600': '#3E3E3E',
'700': '#292929',
'800': '#151515',
'900': '#000000'
},
},
extend: {
fontFamily: {
sans: [
@@ -19,7 +34,7 @@ module.exports = {
},
},
},
plugins: [
plugins: [
require('@tailwindcss/forms'),
require('@tailwindcss/typography')
],