From 68a07a48e68d8316976be02248d5bdd59a7e0364 Mon Sep 17 00:00:00 2001 From: Jeremy Postlethwaite Date: Wed, 6 Mar 2024 13:57:28 -0800 Subject: [PATCH] GH-14 --- config/playground-blade.php | 238 ++++++++++++------ .../views/layouts/bootstrap/nav.blade.php | 15 +- 2 files changed, 166 insertions(+), 87 deletions(-) diff --git a/config/playground-blade.php b/config/playground-blade.php index efbe60b..67975e2 100644 --- a/config/playground-blade.php +++ b/config/playground-blade.php @@ -13,7 +13,6 @@ 'themes' => [ 'default' => [ 'bsTheme' => '', - // 'editor' => '', 'enable' => (bool) env('PLAYGROUND_BLADE_THEME_DEFAULT_ENABLE', true), 'label' => 'Default Theme', 'key' => 'default', @@ -25,24 +24,6 @@ 'asset' => 'comment', 'comment' => 'head: using the default theme', ], - // 'bootstrap-root' => [ - // 'rel' => 'stylesheet', - // 'asset' => 'stylesheet', - // 'href' => '/vendor/bootstrap-root-0001.css', - // 'version' => '5.3.3', - // 'always' => true, - // ], - 'anta' => [ - 'asset' => 'font', - 'href' => 'https://fonts.googleapis.com/css2?family=Anta&display=swap', - 'rel' => 'stylesheet', - 'always' => true, - ], - 'font-headers' => [ - 'asset' => 'style', - 'style' => 'h1, h2, h3, h4, h5, h6 {font-family: Anta, sans-serif;}', - 'always' => true, - ], ], 'body' => [ 'comment' => [ @@ -53,11 +34,10 @@ ], 'blue' => [ 'bsTheme' => 'blue', - // 'editor' => '', - 'enable' => (bool) env('PLAYGROUND_BLADE_THEME_DEFAULT_ENABLE', true), + 'enable' => (bool) env('PLAYGROUND_BLADE_THEME_BLUE_ENABLE', true), 'label' => 'Blue Theme', 'key' => 'blue', - 'icon' => 'fa-solid fa-circle', + 'icon' => 'fa-solid fa-fish-fins', 'provider' => 'bootstrap', 'session' => true, 'head' => [ @@ -72,15 +52,23 @@ 'version' => '5.3.3', 'always' => true, ], - 'anta' => [ + 'font-lobster' => [ 'asset' => 'font', + 'docs' => 'https://fonts.google.com/specimen/Lobster', 'href' => 'https://fonts.googleapis.com/css2?family=Lobster&display=swap', 'rel' => 'stylesheet', 'always' => true, ], 'font-headers' => [ 'asset' => 'style', - 'style' => 'h1, h2, h3, h4, h5, h6 {font-family: Lobster, sans-serif;}', + 'style' => 'h1, h2, h3, h4, h5, h6, .card-title, label, fieldset, nav {font-family: Lobster, sans-serif;}', + 'always' => true, + ], + 'ckeditor-bootstrap' => [ + 'rel' => 'stylesheet', + 'asset' => 'stylesheet', + 'href' => '/vendor/ckeditor-bootstrap.css', + 'version' => '41.1.0', 'always' => true, ], ], @@ -91,53 +79,81 @@ ], ], ], - 'dark' => [ - 'bsTheme' => 'dark', - // 'editor' => '/vendor/ckeditor-dark.css', - 'enable' => (bool) env('PLAYGROUND_BLADE_THEME_DARK_ENABLE', true), - 'label' => 'Dark Theme', - 'key' => 'dark', - 'icon' => 'fa-solid fa-moon', + 'pepper' => [ + 'bsTheme' => 'pepper', + // 'editor' => '', + 'enable' => true, + 'label' => 'Pepper Theme', + 'key' => 'pepper', + 'icon' => 'fa-solid fa-pepper-hot', 'provider' => 'bootstrap', 'session' => true, 'head' => [ - 'ckeditor-dark' => [ + 'comment' => [ + 'asset' => 'comment', + 'comment' => 'head: using the pepper theme', + ], + 'bootstrap-root' => [ 'rel' => 'stylesheet', 'asset' => 'stylesheet', - 'href' => '/vendor/ckeditor-dark.css', - 'version' => '41.1.0', + 'href' => '/vendor/bootstrap-root-pepper.css', + 'version' => '5.3.3', 'always' => true, ], - ], - ], - 'light' => [ - 'bsTheme' => 'light', - 'enable' => (bool) env('PLAYGROUND_BLADE_THEME_LIGHT_ENABLE', true), - 'label' => 'Light Theme', - 'key' => 'light', - 'icon' => 'fa-solid fa-sun', - 'provider' => 'bootstrap', - 'session' => true, - 'head' => [ - 'ckeditor-light' => [ + 'font-anta' => [ + 'asset' => 'font', + 'docs' => 'https://fonts.google.com/specimen/Anta', + 'href' => 'https://fonts.googleapis.com/css2?family=Anta&display=swap', 'rel' => 'stylesheet', - 'asset' => 'stylesheet', - 'href' => '/vendor/ckeditor-light.css', - 'version' => '41.1.0', 'always' => true, ], - ], - ], - 'bootstrap-dark' => [ - 'bsTheme' => 'dark', - 'enable' => false, - 'label' => 'CKEditor Unified Bootstrap Theme under Dark', - 'key' => 'bootstrap-dark', - 'icon' => 'fa-brands fa-bootstrap', - 'provider' => 'bootstrap', - 'session' => true, - 'head' => [ - 'ckeditor-light' => [ + 'font-lobster' => [ + 'asset' => 'font', + 'docs' => 'https://fonts.google.com/specimen/Lobster', + 'href' => 'https://fonts.googleapis.com/css2?family=Lobster&display=swap', + 'rel' => 'stylesheet', + 'always' => true, + ], + 'font-quicksand' => [ + 'asset' => 'font', + 'docs' => 'https://fonts.google.com/specimen/Quicksand', + 'href' => 'https://fonts.googleapis.com/css2?family=Quicksand:wght@300..700&display=swap', + 'rel' => 'stylesheet', + 'always' => true, + ], + 'font-rokkitt' => [ + 'asset' => 'font', + 'docs' => 'https://fonts.google.com/specimen/Rokkitt', + 'href' => 'https://fonts.googleapis.com/css2?family=Rokkitt:ital,wght@0,100..900;1,100..900&display=swap', + 'rel' => 'stylesheet', + 'always' => true, + ], + 'font-h1' => [ + 'asset' => 'style', + 'style' => 'h1 {font-family: Lobster, sans-serif;}', + 'always' => true, + ], + 'font-headers' => [ + 'asset' => 'style', + 'style' => 'h2, h3, h4, h5, h6 {font-family: Quicksand, sans-serif;}', + 'always' => true, + ], + 'font-title' => [ + 'asset' => 'style', + 'style' => '.card-header {font-family: Anta, sans-serif;}', + 'always' => true, + ], + 'font-display' => [ + 'asset' => 'style', + 'style' => '.display-1, .display-2, .display-3, .display-4, .display-5, .display-6 {font-family: Lobster, sans-serif;}', + 'always' => true, + ], + 'font-lead' => [ + 'asset' => 'style', + 'style' => '.lead, label, fieldset {font-family: Rokkitt, serif;}', + 'always' => true, + ], + 'ckeditor-bootstrap' => [ 'rel' => 'stylesheet', 'asset' => 'stylesheet', 'href' => '/vendor/ckeditor-bootstrap.css', @@ -145,17 +161,70 @@ 'always' => true, ], ], + 'body' => [ + 'comment' => [ + 'asset' => 'comment', + 'comment' => 'body: using the pepper theme', + ], + ], ], - 'bootstrap-light' => [ - 'bsTheme' => 'light', - 'enable' => false, - 'label' => 'CKEditor Unified Bootstrap Theme under Light', - 'key' => 'bootstrap-light', - 'icon' => 'fa-brands fa-bootstrap', + 'purple' => [ + 'bsTheme' => 'purple', + 'enable' => (bool) env('PLAYGROUND_BLADE_THEME_PURPLE_ENABLE', true), + 'label' => 'Purple Theme', + 'key' => 'purple', + 'icon' => 'fa-solid fa-microchip', 'provider' => 'bootstrap', 'session' => true, 'head' => [ - 'ckeditor-light' => [ + 'comment' => [ + 'asset' => 'comment', + 'comment' => 'head: using the purple theme', + ], + 'bootstrap-root' => [ + 'rel' => 'stylesheet', + 'asset' => 'stylesheet', + 'href' => '/vendor/bootstrap-root-purple.css', + 'version' => '5.3.3', + 'always' => true, + ], + 'font-anta' => [ + 'asset' => 'font', + 'docs' => 'https://fonts.google.com/specimen/Anta', + 'href' => 'https://fonts.googleapis.com/css2?family=Anta&display=swap', + 'rel' => 'stylesheet', + 'always' => true, + ], + 'font-bruno-ace-sc' => [ + 'asset' => 'font', + 'docs' => 'https://fonts.google.com/specimen/Bruno+Ace+SC', + 'href' => 'https://fonts.googleapis.com/css2?family=Bruno+Ace+SC&display=swap', + 'rel' => 'stylesheet', + 'always' => true, + ], + 'font-kode-mono' => [ + 'asset' => 'font', + 'docs' => 'https://fonts.google.com/specimen/Kode+Mono', + 'href' => 'https://fonts.googleapis.com/css2?family=Kode+Mono:wght@400..700&display=swap', + 'rel' => 'stylesheet', + 'always' => true, + ], + 'font-headers' => [ + 'asset' => 'style', + 'style' => 'h1, h2, h3, h4, h5, h6, label, nav {font-family: Anta, sans-serif;}', + 'always' => true, + ], + 'font-title' => [ + 'asset' => 'style', + 'style' => '.card-header, legend {font-family: "Bruno Ace SC", sans-serif;}', + 'always' => true, + ], + 'font-monospace' => [ + 'asset' => 'style', + 'style' => 'code, pre {font-family: "Kode Mono", monospace;}', + 'always' => true, + ], + 'ckeditor-bootstrap' => [ 'rel' => 'stylesheet', 'asset' => 'stylesheet', 'href' => '/vendor/ckeditor-bootstrap.css', @@ -163,38 +232,45 @@ 'always' => true, ], ], + 'body' => [ + 'comment' => [ + 'asset' => 'comment', + 'comment' => 'body: using the purple theme', + ], + ], ], - 'lark-dark' => [ + 'dark' => [ 'bsTheme' => 'dark', - 'enable' => false, - 'label' => 'CKEditor Lark Theme under Dark', - 'key' => 'lark-dark', - 'icon' => 'fa-solid fa-dove fa-moon', + // 'editor' => '/vendor/ckeditor-dark.css', + 'enable' => (bool) env('PLAYGROUND_BLADE_THEME_DARK_ENABLE', true), + 'label' => 'Dark Theme', + 'key' => 'dark', + 'icon' => 'fa-solid fa-moon', 'provider' => 'bootstrap', 'session' => true, 'head' => [ - 'ckeditor-light' => [ + 'ckeditor-dark' => [ 'rel' => 'stylesheet', 'asset' => 'stylesheet', - 'href' => '/vendor/ckeditor-lark.css', + 'href' => '/vendor/ckeditor-dark.css', 'version' => '41.1.0', 'always' => true, ], ], ], - 'lark-light' => [ + 'light' => [ 'bsTheme' => 'light', - 'enable' => false, - 'label' => 'CKEditor Lark Theme under Light', - 'key' => 'lark-light', - 'icon' => 'fa-solid fa-dove fa-sun', + 'enable' => (bool) env('PLAYGROUND_BLADE_THEME_LIGHT_ENABLE', true), + 'label' => 'Light Theme', + 'key' => 'light', + 'icon' => 'fa-solid fa-sun', 'provider' => 'bootstrap', 'session' => true, 'head' => [ 'ckeditor-light' => [ 'rel' => 'stylesheet', 'asset' => 'stylesheet', - 'href' => '/vendor/ckeditor-lark.css', + 'href' => '/vendor/ckeditor-light.css', 'version' => '41.1.0', 'always' => true, ], diff --git a/resources/views/layouts/bootstrap/nav.blade.php b/resources/views/layouts/bootstrap/nav.blade.php index ec1aa29..5b29c84 100644 --- a/resources/views/layouts/bootstrap/nav.blade.php +++ b/resources/views/layouts/bootstrap/nav.blade.php @@ -77,15 +77,18 @@ Themes

- @foreach (Playground\Blade\Facades\Ui::themes() as $themeKey => $theme) - @continue(!$theme->enabled() || !$theme->label()) + @php + $selectedTheme = Playground\Blade\Facades\Ui::theme()->bsTheme(); + @endphp + @foreach (Playground\Blade\Facades\Ui::themes() as $themeKey => $_theme) + @continue(!$_theme->enabled() || !$_theme->label())
  • - - @if ($theme->icon()) - + @if ($_theme->icon()) + @endif - {{ $theme->label() }} + {{ $_theme->label() }}
    • @endforeach