mirror of
https://github.com/php-flasher/php-flasher.git
synced 2026-03-31 15:07:47 +01:00
Wip
This commit is contained in:
@@ -1,5 +1,5 @@
|
|||||||
{
|
{
|
||||||
"dist/main.css": "/dist/main.32ef094c.css",
|
"dist/main.css": "/dist/main.a73f4b77.css",
|
||||||
"dist/main.js": "/dist/main.3be5bc06.js",
|
"dist/main.js": "/dist/main.3be5bc06.js",
|
||||||
"dist/455.3a7b4474.css": "/dist/455.3a7b4474.css",
|
"dist/455.3a7b4474.css": "/dist/455.3a7b4474.css",
|
||||||
"dist/455.095e6545.js": "/dist/455.095e6545.js",
|
"dist/455.095e6545.js": "/dist/455.095e6545.js",
|
||||||
|
|||||||
+352
-354
@@ -2,94 +2,94 @@
|
|||||||
layout: default
|
layout: default
|
||||||
---
|
---
|
||||||
|
|
||||||
<!-- Refined Hero Section -->
|
<div class="theme-showcase">
|
||||||
<header class="flex items-center justify-between pt-2 pb-6 mb-6 border-b border-slate-100">
|
<!-- Refined Hero Section -->
|
||||||
<div class="flex items-center">
|
<header class="flex items-center justify-between pt-2 pb-6 mb-6 border-b border-slate-100">
|
||||||
<div class="mr-4 relative">
|
<div class="flex items-center">
|
||||||
<div class="w-10 h-10 rounded-lg bg-slate-50 flex items-center justify-center">
|
<div class="mr-4 relative">
|
||||||
<i class="fa-solid {{ page.icon }} text-{{ page.color }}-600 text-lg"></i>
|
<div class="w-10 h-10 rounded-lg bg-slate-50 flex items-center justify-center">
|
||||||
|
<i class="fa-solid {{ page.icon }} text-{{ page.color }}-600 text-lg"></i>
|
||||||
|
</div>
|
||||||
|
<div class="absolute -bottom-1 -right-1 w-4 h-4 rounded-full bg-{{ page.color }}-100 flex items-center justify-center">
|
||||||
|
<div class="w-2 h-2 rounded-full bg-{{ page.color }}-500"></div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="absolute -bottom-1 -right-1 w-4 h-4 rounded-full bg-{{ page.color }}-100 flex items-center justify-center">
|
<div>
|
||||||
<div class="w-2 h-2 rounded-full bg-{{ page.color }}-500"></div>
|
<h1 class="text-2xl font-semibold text-slate-800 tracking-tight mb-0.5">{{ page.title }}</h1>
|
||||||
|
<p class="text-sm text-slate-500">{{ page.subtitle }}</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div class="hidden sm:flex gap-2">
|
||||||
<h1 class="text-2xl font-semibold text-slate-800 tracking-tight mb-0.5">{{ page.title }}</h1>
|
<button
|
||||||
<p class="text-sm text-slate-500">{{ page.subtitle }}</p>
|
onclick="flasher.use('{{ page.theme_name }}').success('Success! Your changes were saved.', 'Well Done')"
|
||||||
|
class="px-3 py-1.5 text-xs bg-white hover:bg-gray-50 text-slate-700 rounded-full border border-slate-200 transition-colors flex items-center"
|
||||||
|
>
|
||||||
|
<i class="fa-regular fa-circle-check text-green-500 mr-1.5"></i> Try Success
|
||||||
|
</button>
|
||||||
|
<button
|
||||||
|
onclick="flasher.use('{{ page.theme_name }}').error('Something went wrong. Please try again.')"
|
||||||
|
class="px-3 py-1.5 text-xs bg-white hover:bg-gray-50 text-slate-700 rounded-full border border-slate-200 transition-colors flex items-center"
|
||||||
|
>
|
||||||
|
<i class="fa-regular fa-circle-xmark text-red-500 mr-1.5"></i> Try Error
|
||||||
|
</button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</header>
|
||||||
<div class="hidden sm:flex gap-2">
|
|
||||||
<button
|
|
||||||
onclick="flasher.use('{{ page.theme_name }}').success('Success! Your changes were saved.', 'Well Done')"
|
|
||||||
class="px-3 py-1.5 text-xs bg-white hover:bg-gray-50 text-slate-700 rounded-full border border-slate-200 transition-colors flex items-center"
|
|
||||||
>
|
|
||||||
<i class="fa-regular fa-circle-check text-green-500 mr-1.5"></i> Try Success
|
|
||||||
</button>
|
|
||||||
<button
|
|
||||||
onclick="flasher.use('{{ page.theme_name }}').error('Something went wrong. Please try again.')"
|
|
||||||
class="px-3 py-1.5 text-xs bg-white hover:bg-gray-50 text-slate-700 rounded-full border border-slate-200 transition-colors flex items-center"
|
|
||||||
>
|
|
||||||
<i class="fa-regular fa-circle-xmark text-red-500 mr-1.5"></i> Try Error
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</header>
|
|
||||||
|
|
||||||
<!-- Demo buttons for mobile -->
|
<div class="container mx-auto px-4">
|
||||||
<div class="sm:hidden flex gap-2 mb-6">
|
<!-- Demo buttons for mobile -->
|
||||||
<button
|
<div class="sm:hidden flex gap-2 mb-6">
|
||||||
onclick="flasher.use('{{ page.theme_name }}').success('Success! Your changes were saved.', 'Well Done')"
|
|
||||||
class="flex-1 py-1.5 px-0 text-xs bg-white text-slate-600 rounded-full border border-slate-200 flex items-center justify-center"
|
|
||||||
>
|
|
||||||
<i class="fa-regular fa-circle-check text-green-500 mr-1"></i> Success
|
|
||||||
</button>
|
|
||||||
<button
|
|
||||||
onclick="flasher.use('{{ page.theme_name }}').error('Something went wrong. Please try again.')"
|
|
||||||
class="flex-1 py-1.5 px-0 text-xs bg-white text-slate-600 rounded-full border border-slate-200 flex items-center justify-center"
|
|
||||||
>
|
|
||||||
<i class="fa-regular fa-circle-xmark text-red-500 mr-1"></i> Error
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Notification Examples with darker background -->
|
|
||||||
<section class="bg-slate-50 rounded-lg shadow-sm overflow-hidden mb-8">
|
|
||||||
{% include themes/{{ page.theme_name_short }}.html %}
|
|
||||||
</section>
|
|
||||||
|
|
||||||
<!-- Configuration Section -->
|
|
||||||
<section class="mb-8">
|
|
||||||
<div class="flex items-center mb-3">
|
|
||||||
<h2 class="text-sm font-medium text-slate-800">Configuration</h2>
|
|
||||||
<div class="h-px bg-slate-100 flex-grow ml-3"></div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="bg-white rounded-lg border border-slate-100 shadow-sm overflow-hidden">
|
|
||||||
<div class="flex border-b border-slate-100 overflow-x-auto">
|
|
||||||
<button
|
<button
|
||||||
class="tab-button px-4 py-2 text-xs text-slate-800 font-medium border-b-2 border-{{ page.color }}-500 whitespace-nowrap focus:outline-none transition-colors"
|
onclick="flasher.use('{{ page.theme_name }}').success('Success! Your changes were saved.', 'Well Done')"
|
||||||
data-framework="laravel"
|
class="flex-1 py-1.5 px-0 text-xs bg-white text-slate-600 rounded-full border border-slate-200 flex items-center justify-center"
|
||||||
>
|
>
|
||||||
Laravel
|
<i class="fa-regular fa-circle-check text-green-500 mr-1"></i> Success
|
||||||
</button>
|
</button>
|
||||||
<button
|
<button
|
||||||
class="tab-button px-4 py-2 text-xs text-slate-500 hover:text-slate-700 whitespace-nowrap focus:outline-none transition-colors"
|
onclick="flasher.use('{{ page.theme_name }}').error('Something went wrong. Please try again.')"
|
||||||
data-framework="symfony"
|
class="flex-1 py-1.5 px-0 text-xs bg-white text-slate-600 rounded-full border border-slate-200 flex items-center justify-center"
|
||||||
>
|
>
|
||||||
Symfony
|
<i class="fa-regular fa-circle-xmark text-red-500 mr-1"></i> Error
|
||||||
</button>
|
|
||||||
<button
|
|
||||||
class="tab-button px-4 py-2 text-xs text-slate-500 hover:text-slate-700 whitespace-nowrap focus:outline-none transition-colors"
|
|
||||||
data-framework="javascript"
|
|
||||||
>
|
|
||||||
JavaScript
|
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="tab-content p-4" id="config-content">
|
<!-- Notification Examples with darker background -->
|
||||||
<div class="flex items-center mb-2 text-slate-800">
|
<section class="bg-slate-50 rounded-lg shadow-sm overflow-hidden mb-8">
|
||||||
<i class="fa-brands fa-laravel text-red-500 mr-1.5"></i>
|
{% include themes/{{ page.theme_name_short }}.html %}
|
||||||
<span class="text-xs font-medium">Setting as Default in Laravel</span>
|
</section>
|
||||||
</div>
|
|
||||||
<pre class="language-php bg-slate-50 p-3 rounded-md text-xs"><code>// config/flasher.php
|
<!-- Configuration Section With Clean Tabs -->
|
||||||
|
<section class="mb-10">
|
||||||
|
<h2 class="text-lg font-semibold text-slate-800 mb-4 border-b border-slate-100 pb-2">Configuration</h2>
|
||||||
|
|
||||||
|
<div class="bg-white rounded-lg shadow-sm border border-slate-200 overflow-hidden">
|
||||||
|
<!-- Framework Tabs with Simple Design -->
|
||||||
|
<div class="flex border-b border-slate-100 overflow-x-auto bg-slate-50">
|
||||||
|
<button
|
||||||
|
class="tab-button px-5 py-3 text-sm font-medium text-indigo-600 border-b-2 border-indigo-600 whitespace-nowrap focus:outline-none flex items-center space-x-2"
|
||||||
|
data-framework="laravel"
|
||||||
|
>
|
||||||
|
<i class="fab fa-laravel text-red-500"></i>
|
||||||
|
<span>Laravel</span>
|
||||||
|
</button>
|
||||||
|
<button
|
||||||
|
class="tab-button px-5 py-3 text-sm font-medium text-slate-600 hover:text-slate-800 whitespace-nowrap focus:outline-none flex items-center space-x-2"
|
||||||
|
data-framework="symfony"
|
||||||
|
>
|
||||||
|
<i class="fab fa-symfony text-black"></i>
|
||||||
|
<span>Symfony</span>
|
||||||
|
</button>
|
||||||
|
<button
|
||||||
|
class="tab-button px-5 py-3 text-sm font-medium text-slate-600 hover:text-slate-800 whitespace-nowrap focus:outline-none flex items-center space-x-2"
|
||||||
|
data-framework="javascript"
|
||||||
|
>
|
||||||
|
<i class="fab fa-js text-yellow-500"></i>
|
||||||
|
<span>JavaScript</span>
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Tab Content with Clean styling -->
|
||||||
|
<div class="tab-content" id="config-content">
|
||||||
|
<pre class="language-php bg-slate-800 text-slate-200 p-4 text-sm overflow-x-auto"><code>// config/flasher.php
|
||||||
|
|
||||||
return [
|
return [
|
||||||
'default' => '{{ page.theme_name }}',{% if page.has_assets %}
|
'default' => '{{ page.theme_name }}',{% if page.has_assets %}
|
||||||
@@ -105,255 +105,250 @@ return [
|
|||||||
],
|
],
|
||||||
],{% endif %}
|
],{% endif %}
|
||||||
];</code></pre>
|
];</code></pre>
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
<!-- Theme Usage -->
|
|
||||||
<section class="mb-8">
|
|
||||||
<div class="flex items-center mb-3">
|
|
||||||
<h2 class="text-sm font-medium text-slate-800">Theme Usage</h2>
|
|
||||||
<div class="h-px bg-slate-100 flex-grow ml-3"></div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Combined Usage Section -->
|
|
||||||
<div class="bg-white rounded-lg border border-slate-100 shadow-sm overflow-hidden">
|
|
||||||
<!-- Tabs -->
|
|
||||||
<div class="flex border-b border-slate-100">
|
|
||||||
<button
|
|
||||||
class="usage-tab px-4 py-2 text-xs text-slate-800 font-medium border-b-2 border-{{ page.color }}-500 whitespace-nowrap focus:outline-none transition-colors"
|
|
||||||
data-lang="php"
|
|
||||||
>
|
|
||||||
PHP
|
|
||||||
</button>
|
|
||||||
<button
|
|
||||||
class="usage-tab px-4 py-2 text-xs text-slate-500 hover:text-slate-700 whitespace-nowrap focus:outline-none transition-colors"
|
|
||||||
data-lang="js"
|
|
||||||
>
|
|
||||||
JavaScript
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- PHP Content -->
|
|
||||||
<div class="p-4 usage-content" id="php-content">
|
|
||||||
<div class="flex items-center text-xs text-slate-500 mb-2">
|
|
||||||
<div class="w-5 h-5 rounded-full bg-{{ page.color }}-50 flex items-center justify-center mr-1.5">
|
|
||||||
<i class="fa-solid fa-wand-magic-sparkles text-{{ page.color }}-500 text-[10px]"></i>
|
|
||||||
</div>
|
</div>
|
||||||
<span class="font-medium text-slate-700">
|
|
||||||
When <span class="font-medium">{{ page.theme_name }}</span> is set as your default theme, you can call methods directly.
|
|
||||||
</span>
|
|
||||||
</div>
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
<pre class="language-php bg-slate-50 p-3 rounded-md text-xs mb-6"><code>flash()->success('Your changes have been saved!');</code></pre>
|
<!-- Usage Section with Minimal Design -->
|
||||||
|
<section class="mb-10">
|
||||||
|
<h2 class="text-lg font-semibold text-slate-800 mb-4 border-b border-slate-100 pb-2">Usage</h2>
|
||||||
|
|
||||||
<div class="flex items-center text-xs text-slate-500 mb-2">
|
<!-- Combined Usage Section with Tabs -->
|
||||||
<div class="w-5 h-5 rounded-full bg-{{ page.color }}-50 flex items-center justify-center mr-1.5">
|
<div class="bg-white rounded-lg shadow-sm border border-slate-200 overflow-hidden">
|
||||||
<i class="fa-solid fa-wand-magic-sparkles text-{{ page.color }}-500 text-[10px]"></i>
|
<!-- Tabs -->
|
||||||
|
<div class="flex border-b border-slate-100 bg-slate-50">
|
||||||
|
<button
|
||||||
|
class="usage-tab px-5 py-3 text-sm font-medium text-indigo-600 border-b-2 border-indigo-600 whitespace-nowrap focus:outline-none flex items-center space-x-2"
|
||||||
|
data-lang="php"
|
||||||
|
>
|
||||||
|
<i class="fab fa-php text-indigo-500"></i>
|
||||||
|
<span>PHP</span>
|
||||||
|
</button>
|
||||||
|
<button
|
||||||
|
class="usage-tab px-5 py-3 text-sm font-medium text-slate-600 hover:text-slate-800 whitespace-nowrap focus:outline-none flex items-center space-x-2"
|
||||||
|
data-lang="js"
|
||||||
|
>
|
||||||
|
<i class="fab fa-js text-yellow-500"></i>
|
||||||
|
<span>JavaScript</span>
|
||||||
|
</button>
|
||||||
</div>
|
</div>
|
||||||
<span class="font-medium text-slate-700">For specific notifications</span>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<pre class="language-php bg-slate-50 p-3 rounded-md text-xs"><code>flash()->use('{{ page.theme_name }}')->success('This uses {{ page.title }}');</code></pre>
|
<!-- PHP Content -->
|
||||||
</div>
|
<div class="p-6 usage-content" id="php-content">
|
||||||
|
<div class="mb-6 bg-slate-50 rounded-lg p-4 border border-slate-200">
|
||||||
<!-- JavaScript Content -->
|
<div class="flex items-center text-sm text-slate-700 mb-2">
|
||||||
<div class="p-4 usage-content hidden" id="js-content">
|
<div class="w-6 h-6 rounded-full bg-slate-200 flex items-center justify-center mr-2">
|
||||||
<div class="flex items-center text-xs text-slate-500 mb-2">
|
<i class="fa-solid fa-lightbulb text-slate-600 text-xs"></i>
|
||||||
<div class="w-5 h-5 rounded-full bg-{{ page.color }}-50 flex items-center justify-center mr-1.5">
|
</div>
|
||||||
<i class="fa-solid fa-wand-magic-sparkles text-{{ page.color }}-500 text-[10px]"></i>
|
<span class="font-medium">When <span class="font-semibold text-indigo-600">{{ page.theme_name }}</span> is set as your default theme:</span>
|
||||||
</div>
|
</div>
|
||||||
<span class="font-medium text-slate-700">
|
<pre class="language-php bg-slate-800 text-slate-200 p-4 rounded-lg text-sm overflow-x-auto"><code>flash()->success('Your changes have been saved!');</code></pre>
|
||||||
When <span class="font-medium">{{ page.theme_name }}</span> is set as your default theme, you can call methods directly.
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<pre class="language-javascript bg-slate-50 p-3 rounded-md text-xs mb-6"><code>flasher.success('Your changes have been saved!');</code></pre>
|
|
||||||
|
|
||||||
<div class="flex items-center text-xs text-slate-500 mb-2">
|
|
||||||
<div class="w-5 h-5 rounded-full bg-{{ page.color }}-50 flex items-center justify-center mr-1.5">
|
|
||||||
<i class="fa-solid fa-wand-magic-sparkles text-{{ page.color }}-500 text-[10px]"></i>
|
|
||||||
</div>
|
|
||||||
<span class="font-medium text-slate-700">For specific notifications</span>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<pre class="language-javascript bg-slate-50 p-3 rounded-md text-xs"><code>flasher.use('{{ page.theme_name }}').success('This uses {{ page.title }}');</code></pre>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
<!-- Features Grid -->
|
|
||||||
<section class="mb-8">
|
|
||||||
<div class="flex items-center mb-3">
|
|
||||||
<h2 class="text-sm font-medium text-slate-800">Key Features</h2>
|
|
||||||
<div class="h-px bg-slate-100 flex-grow ml-3"></div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="grid grid-cols-1 md:grid-cols-2 gap-4">
|
|
||||||
<div class="p-4 bg-white rounded-lg border border-slate-100 shadow-sm">
|
|
||||||
<div class="flex items-center mb-3">
|
|
||||||
<div class="w-6 h-6 rounded-full bg-{{ page.color }}-50 flex items-center justify-center mr-2">
|
|
||||||
<i class="fa-solid fa-palette text-{{ page.color }}-500 text-xs"></i>
|
|
||||||
</div>
|
|
||||||
<h3 class="font-medium text-slate-700 text-xs">Visual Design</h3>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<ul class="space-y-2 ml-4">
|
|
||||||
{% for feature in page.visual_features %}
|
|
||||||
<li class="flex items-start text-xs text-slate-600">
|
|
||||||
<div class="w-4 h-4 rounded-full bg-green-50 flex-shrink-0 flex items-center justify-center mr-2 mt-0.5">
|
|
||||||
<i class="fa-solid fa-check text-green-500 text-[9px]"></i>
|
|
||||||
</div>
|
</div>
|
||||||
<span>{{ feature }}</span>
|
|
||||||
</li>
|
|
||||||
{% endfor %}
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="p-4 bg-white rounded-lg border border-slate-100 shadow-sm">
|
<div class="bg-slate-50 rounded-lg p-4 border border-slate-200">
|
||||||
<div class="flex items-center mb-3">
|
<div class="flex items-center text-sm text-slate-700 mb-2">
|
||||||
<div class="w-6 h-6 rounded-full bg-blue-50 flex items-center justify-center mr-2">
|
<div class="w-6 h-6 rounded-full bg-slate-200 flex items-center justify-center mr-2">
|
||||||
<i class="fa-solid fa-universal-access text-blue-500 text-xs"></i>
|
<i class="fa-solid fa-code text-slate-600 text-xs"></i>
|
||||||
</div>
|
</div>
|
||||||
<h3 class="font-medium text-slate-700 text-xs">Accessibility</h3>
|
<span class="font-medium">For specific notifications:</span>
|
||||||
</div>
|
</div>
|
||||||
|
<pre class="language-php bg-slate-800 text-slate-200 p-4 rounded-lg text-sm overflow-x-auto"><code>flash()->use('{{ page.theme_name }}')->success('This uses {{ page.title }}');</code></pre>
|
||||||
<ul class="space-y-2 ml-4">
|
|
||||||
{% for feature in page.accessibility_features %}
|
|
||||||
<li class="flex items-start text-xs text-slate-600">
|
|
||||||
<div class="w-4 h-4 rounded-full bg-green-50 flex-shrink-0 flex items-center justify-center mr-2 mt-0.5">
|
|
||||||
<i class="fa-solid fa-check text-green-500 text-[9px]"></i>
|
|
||||||
</div>
|
</div>
|
||||||
<span>{{ feature }}</span>
|
|
||||||
</li>
|
|
||||||
{% endfor %}
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
<!-- Customization Section -->
|
|
||||||
<section class="mb-8">
|
|
||||||
<div class="flex items-center mb-3">
|
|
||||||
<h2 class="text-sm font-medium text-slate-800">Customization</h2>
|
|
||||||
<div class="h-px bg-slate-100 flex-grow ml-3"></div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="grid grid-cols-1 gap-4">
|
|
||||||
<!-- Color Customization -->
|
|
||||||
<div class="bg-white rounded-lg border border-slate-100 shadow-sm">
|
|
||||||
<div class="border-b border-slate-50 px-4 py-2 flex items-center">
|
|
||||||
<i class="fa-solid fa-palette text-{{ page.color }}-400 mr-1.5 text-xs"></i>
|
|
||||||
<h3 class="text-xs font-medium text-slate-700">CSS Variables</h3>
|
|
||||||
</div>
|
|
||||||
<div class="p-4">
|
|
||||||
<pre class="language-css text-xs rounded-md overflow-hidden"><code>{{ page.css_variables }}</code></pre>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- HTML Structure -->
|
|
||||||
<div class="bg-white rounded-lg border border-slate-100 shadow-sm">
|
|
||||||
<div class="border-b border-slate-50 px-4 py-2 flex items-center">
|
|
||||||
<i class="fa-solid fa-code text-blue-400 mr-1.5 text-xs"></i>
|
|
||||||
<h3 class="text-xs font-medium text-slate-700">HTML Structure</h3>
|
|
||||||
</div>
|
|
||||||
<div class="p-4">
|
|
||||||
<pre class="language-html text-xs rounded-md overflow-hidden"><code>{{ page.html_structure | escape }}</code></pre>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
<!-- Browser Support -->
|
|
||||||
<section class="mb-8">
|
|
||||||
<div class="flex items-center mb-3">
|
|
||||||
<h2 class="text-sm font-medium text-slate-800">Browser Support</h2>
|
|
||||||
<div class="h-px bg-slate-100 flex-grow ml-3"></div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="bg-white rounded-lg border border-slate-100 shadow-sm p-4">
|
|
||||||
<div class="flex flex-wrap justify-center gap-6">
|
|
||||||
<div class="flex flex-col items-center">
|
|
||||||
<div class="w-10 h-10 rounded-full bg-slate-50 flex items-center justify-center mb-1.5">
|
|
||||||
<i class="fa-brands fa-chrome text-green-500 text-lg"></i>
|
|
||||||
</div>
|
</div>
|
||||||
<span class="text-xs text-slate-500">Chrome</span>
|
|
||||||
</div>
|
|
||||||
<div class="flex flex-col items-center">
|
|
||||||
<div class="w-10 h-10 rounded-full bg-slate-50 flex items-center justify-center mb-1.5">
|
|
||||||
<i class="fa-brands fa-firefox text-orange-500 text-lg"></i>
|
|
||||||
</div>
|
|
||||||
<span class="text-xs text-slate-500">Firefox</span>
|
|
||||||
</div>
|
|
||||||
<div class="flex flex-col items-center">
|
|
||||||
<div class="w-10 h-10 rounded-full bg-slate-50 flex items-center justify-center mb-1.5">
|
|
||||||
<i class="fa-brands fa-safari text-blue-500 text-lg"></i>
|
|
||||||
</div>
|
|
||||||
<span class="text-xs text-slate-500">Safari</span>
|
|
||||||
</div>
|
|
||||||
<div class="flex flex-col items-center">
|
|
||||||
<div class="w-10 h-10 rounded-full bg-slate-50 flex items-center justify-center mb-1.5">
|
|
||||||
<i class="fa-brands fa-edge text-blue-600 text-lg"></i>
|
|
||||||
</div>
|
|
||||||
<span class="text-xs text-slate-500">Edge</span>
|
|
||||||
</div>
|
|
||||||
<div class="flex flex-col items-center">
|
|
||||||
<div class="w-10 h-10 rounded-full bg-slate-50 flex items-center justify-center mb-1.5">
|
|
||||||
<i class="fa-solid fa-mobile-screen text-slate-600 text-lg"></i>
|
|
||||||
</div>
|
|
||||||
<span class="text-xs text-slate-500">Mobile</span>
|
|
||||||
</div>
|
|
||||||
<div class="flex flex-col items-center">
|
|
||||||
<div class="w-10 h-10 rounded-full bg-slate-50 flex items-center justify-center mb-1.5">
|
|
||||||
<i class="fa-solid fa-moon text-indigo-500 text-lg"></i>
|
|
||||||
</div>
|
|
||||||
<span class="text-xs text-slate-500">Dark</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
<!-- Help Section (Redesigned) -->
|
<!-- JavaScript Content -->
|
||||||
<div class="bg-gradient-to-r from-slate-50 to-white rounded-lg shadow-sm border border-slate-100 p-4 mb-6">
|
<div class="p-6 usage-content hidden" id="js-content">
|
||||||
<div class="flex items-center">
|
<div class="mb-6 bg-slate-50 rounded-lg p-4 border border-slate-200">
|
||||||
<div class="w-10 h-10 rounded-lg bg-{{ page.color }}-50 border border-{{ page.color }}-100 flex items-center justify-center mr-3">
|
<div class="flex items-center text-sm text-slate-700 mb-2">
|
||||||
<i class="fa-regular fa-life-ring text-{{ page.color }}-500"></i>
|
<div class="w-6 h-6 rounded-full bg-slate-200 flex items-center justify-center mr-2">
|
||||||
</div>
|
<i class="fa-solid fa-lightbulb text-slate-600 text-xs"></i>
|
||||||
<div>
|
</div>
|
||||||
<h3 class="text-sm font-medium text-slate-800 mb-1">Need assistance?</h3>
|
<span class="font-medium">When <span class="font-semibold text-indigo-600">{{ page.theme_name }}</span> is set as your default theme:</span>
|
||||||
<div class="flex items-center flex-wrap gap-3">
|
</div>
|
||||||
<a
|
<pre class="language-javascript bg-slate-800 text-slate-200 p-4 rounded-lg text-sm overflow-x-auto"><code>flasher.success('Your changes have been saved!');</code></pre>
|
||||||
href="/docs/"
|
</div>
|
||||||
class="inline-flex items-center text-xs px-3 py-1 bg-white border border-slate-200 rounded-full text-slate-700 hover:bg-slate-50 transition-colors"
|
|
||||||
>
|
<div class="bg-slate-50 rounded-lg p-4 border border-slate-200">
|
||||||
<i class="fa-regular fa-file-lines text-{{ page.color }}-500 mr-1.5"></i>
|
<div class="flex items-center text-sm text-slate-700 mb-2">
|
||||||
Documentation
|
<div class="w-6 h-6 rounded-full bg-slate-200 flex items-center justify-center mr-2">
|
||||||
</a>
|
<i class="fa-solid fa-code text-slate-600 text-xs"></i>
|
||||||
<a
|
</div>
|
||||||
href="https://github.com/php-flasher/php-flasher/discussions"
|
<span class="font-medium">For specific notifications:</span>
|
||||||
class="inline-flex items-center text-xs px-3 py-1 bg-white border border-slate-200 rounded-full text-slate-700 hover:bg-slate-50 transition-colors"
|
</div>
|
||||||
>
|
<pre class="language-javascript bg-slate-800 text-slate-200 p-4 rounded-lg text-sm overflow-x-auto"><code>flasher.use('{{ page.theme_name }}').success('This uses {{ page.title }}');</code></pre>
|
||||||
<i class="fa-regular fa-comments text-{{ page.color }}-500 mr-1.5"></i>
|
</div>
|
||||||
Community
|
</div>
|
||||||
</a>
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<!-- Features Grid with Clean Design -->
|
||||||
|
<section class="mb-10">
|
||||||
|
<h2 class="text-lg font-semibold text-slate-800 mb-4 border-b border-slate-100 pb-2">Key Features</h2>
|
||||||
|
|
||||||
|
<div class="grid grid-cols-1 md:grid-cols-2 gap-6">
|
||||||
|
<!-- Visual Design Features -->
|
||||||
|
<div class="bg-white rounded-lg shadow-sm border border-slate-200 overflow-hidden">
|
||||||
|
<div class="px-6 py-4 border-b border-slate-100 flex items-center">
|
||||||
|
<div class="w-8 h-8 rounded-lg bg-slate-100 flex items-center justify-center mr-3">
|
||||||
|
<i class="fa-solid fa-palette text-indigo-600"></i>
|
||||||
|
</div>
|
||||||
|
<h3 class="font-medium text-slate-800">Visual Design</h3>
|
||||||
|
</div>
|
||||||
|
<div class="p-6">
|
||||||
|
<ul class="space-y-3">
|
||||||
|
{% for feature in page.visual_features %}
|
||||||
|
<li class="flex items-start">
|
||||||
|
<div class="w-5 h-5 rounded-full bg-green-50 flex-shrink-0 flex items-center justify-center mr-3 mt-0.5">
|
||||||
|
<i class="fa-solid fa-check text-green-500 text-xs"></i>
|
||||||
|
</div>
|
||||||
|
<span class="text-sm text-slate-600">{{ feature }}</span>
|
||||||
|
</li>
|
||||||
|
{% endfor %}
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Accessibility Features -->
|
||||||
|
<div class="bg-white rounded-lg shadow-sm border border-slate-200 overflow-hidden">
|
||||||
|
<div class="px-6 py-4 border-b border-slate-100 flex items-center">
|
||||||
|
<div class="w-8 h-8 rounded-lg bg-slate-100 flex items-center justify-center mr-3">
|
||||||
|
<i class="fa-solid fa-universal-access text-indigo-600"></i>
|
||||||
|
</div>
|
||||||
|
<h3 class="font-medium text-slate-800">Accessibility</h3>
|
||||||
|
</div>
|
||||||
|
<div class="p-6">
|
||||||
|
<ul class="space-y-3">
|
||||||
|
{% for feature in page.accessibility_features %}
|
||||||
|
<li class="flex items-start">
|
||||||
|
<div class="w-5 h-5 rounded-full bg-green-50 flex-shrink-0 flex items-center justify-center mr-3 mt-0.5">
|
||||||
|
<i class="fa-solid fa-check text-green-500 text-xs"></i>
|
||||||
|
</div>
|
||||||
|
<span class="text-sm text-slate-600">{{ feature }}</span>
|
||||||
|
</li>
|
||||||
|
{% endfor %}
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<!-- Customization Section with Tab System -->
|
||||||
|
<section class="mb-10">
|
||||||
|
<h2 class="text-lg font-semibold text-slate-800 mb-4 border-b border-slate-100 pb-2">Customization</h2>
|
||||||
|
|
||||||
|
<!-- CSS Variables Tab -->
|
||||||
|
<div class="bg-white rounded-lg shadow-sm border border-slate-200 overflow-hidden">
|
||||||
|
<div class="flex border-b border-slate-100">
|
||||||
|
<button class="customization-tab px-5 py-3 text-sm font-medium text-indigo-600 border-b-2 border-indigo-600 focus:outline-none" data-tab="css">
|
||||||
|
<i class="fas fa-palette text-indigo-600 mr-2"></i> CSS Variables
|
||||||
|
</button>
|
||||||
|
<button class="customization-tab px-5 py-3 text-sm font-medium text-slate-600 hover:text-slate-800 focus:outline-none" data-tab="html">
|
||||||
|
<i class="fas fa-code text-slate-600 mr-2"></i> HTML Structure
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- CSS Variables Content -->
|
||||||
|
<div id="css-content" class="customization-content">
|
||||||
|
<div class="bg-slate-800 overflow-hidden">
|
||||||
|
<pre class="language-css text-sm p-4 overflow-x-auto text-slate-200"><code>{{ page.css_variables }}</code></pre>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- HTML Structure Content -->
|
||||||
|
<div id="html-content" class="customization-content hidden">
|
||||||
|
<div class="bg-slate-800 overflow-hidden">
|
||||||
|
<pre class="language-html text-sm p-4 overflow-x-auto text-slate-200"><code>{{ page.html_structure | escape }}</code></pre>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<!-- Browser Support with Simple Design -->
|
||||||
|
<section class="mb-10">
|
||||||
|
<h2 class="text-lg font-semibold text-slate-800 mb-4 border-b border-slate-100 pb-2">Browser Support</h2>
|
||||||
|
|
||||||
|
<div class="bg-white rounded-lg shadow-sm border border-slate-200 p-6">
|
||||||
|
<div class="flex flex-wrap justify-center gap-8">
|
||||||
|
<div class="flex flex-col items-center">
|
||||||
|
<div class="w-12 h-12 rounded-lg bg-slate-50 flex items-center justify-center mb-2">
|
||||||
|
<i class="fa-brands fa-chrome text-green-500 text-xl"></i>
|
||||||
|
</div>
|
||||||
|
<span class="text-sm text-slate-600">Chrome</span>
|
||||||
|
</div>
|
||||||
|
<div class="flex flex-col items-center">
|
||||||
|
<div class="w-12 h-12 rounded-lg bg-slate-50 flex items-center justify-center mb-2">
|
||||||
|
<i class="fa-brands fa-firefox-browser text-orange-500 text-xl"></i>
|
||||||
|
</div>
|
||||||
|
<span class="text-sm text-slate-600">Firefox</span>
|
||||||
|
</div>
|
||||||
|
<div class="flex flex-col items-center">
|
||||||
|
<div class="w-12 h-12 rounded-lg bg-slate-50 flex items-center justify-center mb-2">
|
||||||
|
<i class="fa-brands fa-safari text-blue-500 text-xl"></i>
|
||||||
|
</div>
|
||||||
|
<span class="text-sm text-slate-600">Safari</span>
|
||||||
|
</div>
|
||||||
|
<div class="flex flex-col items-center">
|
||||||
|
<div class="w-12 h-12 rounded-lg bg-slate-50 flex items-center justify-center mb-2">
|
||||||
|
<i class="fa-brands fa-edge text-blue-600 text-xl"></i>
|
||||||
|
</div>
|
||||||
|
<span class="text-sm text-slate-600">Edge</span>
|
||||||
|
</div>
|
||||||
|
<div class="flex flex-col items-center">
|
||||||
|
<div class="w-12 h-12 rounded-lg bg-slate-50 flex items-center justify-center mb-2">
|
||||||
|
<i class="fa-solid fa-mobile-screen text-slate-600 text-xl"></i>
|
||||||
|
</div>
|
||||||
|
<span class="text-sm text-slate-600">Mobile</span>
|
||||||
|
</div>
|
||||||
|
<div class="flex flex-col items-center">
|
||||||
|
<div class="w-12 h-12 rounded-lg bg-slate-50 flex items-center justify-center mb-2">
|
||||||
|
<i class="fa-solid fa-moon text-slate-700 text-xl"></i>
|
||||||
|
</div>
|
||||||
|
<span class="text-sm text-slate-600">Dark Mode</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<!-- Help Section (Simple Design) -->
|
||||||
|
<div class="bg-slate-50 rounded-lg shadow-sm border border-slate-200 p-6 mb-6">
|
||||||
|
<div class="flex items-center">
|
||||||
|
<div class="w-10 h-10 rounded-lg bg-slate-200 flex items-center justify-center mr-3">
|
||||||
|
<i class="fa-regular fa-life-ring text-slate-600"></i>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<h3 class="text-lg font-medium text-slate-800 mb-2">Need assistance?</h3>
|
||||||
|
<div class="flex items-center flex-wrap gap-3">
|
||||||
|
<a
|
||||||
|
href="/docs/"
|
||||||
|
class="inline-flex items-center text-sm px-4 py-2 bg-white border border-slate-200 rounded-lg text-slate-700 hover:bg-slate-50 transition-colors"
|
||||||
|
>
|
||||||
|
<i class="fa-regular fa-file-lines text-indigo-600 mr-2"></i>
|
||||||
|
Documentation
|
||||||
|
</a>
|
||||||
|
<a
|
||||||
|
href="https://github.com/php-flasher/php-flasher/discussions"
|
||||||
|
class="inline-flex items-center text-sm px-4 py-2 bg-white border border-slate-200 rounded-lg text-slate-700 hover:bg-slate-50 transition-colors"
|
||||||
|
>
|
||||||
|
<i class="fa-regular fa-comments text-indigo-600 mr-2"></i>
|
||||||
|
Community
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
// Tab system with Prism re-highlight
|
// Simple tab system with minimal animations
|
||||||
document.addEventListener('DOMContentLoaded', function() {
|
document.addEventListener('DOMContentLoaded', function() {
|
||||||
// Config tabs
|
// Framework tabs
|
||||||
const tabButtons = document.querySelectorAll('.tab-button');
|
setupTabs('.tab-button', function(framework) {
|
||||||
const tabContent = document.getElementById('config-content');
|
const tabContent = document.getElementById('config-content');
|
||||||
|
|
||||||
const frameworkContents = {
|
// Framework content objects
|
||||||
'laravel': `<div class="flex items-center mb-2 text-slate-800">
|
const frameworkContents = {
|
||||||
<i class="fa-brands fa-laravel text-red-500 mr-1.5"></i>
|
'laravel': `<pre class="language-php bg-slate-800 text-slate-200 p-4 text-sm overflow-x-auto"><code>// config/flasher.php
|
||||||
<span class="text-xs font-medium">Setting as Default in Laravel</span>
|
|
||||||
</div>
|
|
||||||
<pre class="language-php bg-slate-50 p-3 rounded-md text-xs"><code>// config/flasher.php
|
|
||||||
|
|
||||||
return [
|
return [
|
||||||
'default' => '{{ page.theme_name }}',{% if page.has_assets %}
|
'default' => '{{ page.theme_name }}',{% if page.has_assets %}
|
||||||
@@ -370,11 +365,7 @@ return [
|
|||||||
],{% endif %}
|
],{% endif %}
|
||||||
];</code></pre>`,
|
];</code></pre>`,
|
||||||
|
|
||||||
'symfony': `<div class="flex items-center mb-2 text-slate-800">
|
'symfony': `<pre class="language-yaml bg-slate-800 text-slate-200 p-4 text-sm overflow-x-auto"><code># config/packages/flasher.yaml
|
||||||
<i class="fa-brands fa-symfony text-black mr-1.5"></i>
|
|
||||||
<span class="text-xs font-medium">Setting as Default in Symfony</span>
|
|
||||||
</div>
|
|
||||||
<pre class="language-yaml bg-slate-50 p-3 rounded-md text-xs"><code># config/packages/flasher.yaml
|
|
||||||
|
|
||||||
flasher:
|
flasher:
|
||||||
default: {{ page.theme_name }}{% if page.has_assets %}
|
default: {{ page.theme_name }}{% if page.has_assets %}
|
||||||
@@ -386,59 +377,66 @@ flasher:
|
|||||||
styles:
|
styles:
|
||||||
- '/vendor/flasher/themes/{{ page.theme_name }}.min.css'{% endif %}</code></pre>`,
|
- '/vendor/flasher/themes/{{ page.theme_name }}.min.css'{% endif %}</code></pre>`,
|
||||||
|
|
||||||
'javascript': `<div class="flex items-center mb-2 text-slate-800">
|
'javascript': `<pre class="language-javascript bg-slate-800 text-slate-200 p-4 text-sm overflow-x-auto"><code>// Set as default theme
|
||||||
<i class="fa-brands fa-js text-amber-500 mr-1.5"></i>
|
|
||||||
<span class="text-xs font-medium">Setting as Default in JavaScript</span>
|
|
||||||
</div>
|
|
||||||
<pre class="language-javascript bg-slate-50 p-3 rounded-md text-xs"><code>// Set as default theme
|
|
||||||
flasher.defaultPlugin = '{{ page.theme_name }}';
|
flasher.defaultPlugin = '{{ page.theme_name }}';
|
||||||
|
|
||||||
// Then use it
|
// Then use it
|
||||||
flasher.success('Well done!');</code></pre>`
|
flasher.success('Well done!');</code></pre>`
|
||||||
};
|
};
|
||||||
|
|
||||||
tabButtons.forEach(button => {
|
// Change content
|
||||||
button.addEventListener('click', function() {
|
tabContent.innerHTML = frameworkContents[framework];
|
||||||
// Update active tab
|
|
||||||
tabButtons.forEach(btn => {
|
|
||||||
btn.classList.remove('border-{{ page.color }}-500', 'text-slate-800', 'font-medium');
|
|
||||||
btn.classList.add('text-slate-500');
|
|
||||||
});
|
|
||||||
this.classList.add('border-b-2', 'border-{{ page.color }}-500', 'text-slate-800', 'font-medium');
|
|
||||||
this.classList.remove('text-slate-500');
|
|
||||||
|
|
||||||
// Update content
|
// Re-run Prism highlighting
|
||||||
const framework = this.getAttribute('data-framework');
|
if (window.Prism) {
|
||||||
tabContent.innerHTML = frameworkContents[framework];
|
Prism.highlightAllUnder(tabContent);
|
||||||
|
}
|
||||||
// Re-run Prism highlighting
|
|
||||||
if (window.Prism) {
|
|
||||||
Prism.highlightAllUnder(tabContent);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
});
|
});
|
||||||
|
|
||||||
// Usage tabs
|
// Language usage tabs
|
||||||
const usageTabs = document.querySelectorAll('.usage-tab');
|
setupTabs('.usage-tab', function(lang) {
|
||||||
const usageContents = document.querySelectorAll('.usage-content');
|
document.querySelectorAll('.usage-content').forEach(content => {
|
||||||
|
content.classList.add('hidden');
|
||||||
usageTabs.forEach(tab => {
|
|
||||||
tab.addEventListener('click', function() {
|
|
||||||
// Update active tab
|
|
||||||
usageTabs.forEach(t => {
|
|
||||||
t.classList.remove('border-{{ page.color }}-500', 'text-slate-800', 'font-medium');
|
|
||||||
t.classList.add('text-slate-500');
|
|
||||||
});
|
|
||||||
this.classList.add('border-b-2', 'border-{{ page.color }}-500', 'text-slate-800', 'font-medium');
|
|
||||||
this.classList.remove('text-slate-500');
|
|
||||||
|
|
||||||
// Show correct content
|
|
||||||
const lang = this.getAttribute('data-lang');
|
|
||||||
usageContents.forEach(content => {
|
|
||||||
content.classList.add('hidden');
|
|
||||||
});
|
|
||||||
document.getElementById(lang + '-content').classList.remove('hidden');
|
|
||||||
});
|
});
|
||||||
|
document.getElementById(lang + '-content').classList.remove('hidden');
|
||||||
|
});
|
||||||
|
|
||||||
|
// Customization tabs
|
||||||
|
setupTabs('.customization-tab', function(tabId) {
|
||||||
|
document.querySelectorAll('.customization-content').forEach(content => {
|
||||||
|
content.classList.add('hidden');
|
||||||
|
});
|
||||||
|
document.getElementById(tabId + '-content').classList.remove('hidden');
|
||||||
|
|
||||||
|
// Re-run Prism highlighting
|
||||||
|
if (window.Prism) {
|
||||||
|
Prism.highlightAllUnder(document.getElementById(tabId + '-content'));
|
||||||
|
}
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
|
// Simple tab functionality
|
||||||
|
function setupTabs(tabSelector, callback) {
|
||||||
|
const tabs = document.querySelectorAll(tabSelector);
|
||||||
|
|
||||||
|
tabs.forEach(tab => {
|
||||||
|
tab.addEventListener('click', function() {
|
||||||
|
// Update active state
|
||||||
|
tabs.forEach(t => {
|
||||||
|
t.classList.remove('text-indigo-600', 'border-b-2', 'border-indigo-600');
|
||||||
|
t.classList.add('text-slate-600');
|
||||||
|
});
|
||||||
|
|
||||||
|
this.classList.remove('text-slate-600');
|
||||||
|
this.classList.add('text-indigo-600', 'border-b-2', 'border-indigo-600');
|
||||||
|
|
||||||
|
// Get id and execute callback
|
||||||
|
const id = this.getAttribute('data-framework') ||
|
||||||
|
this.getAttribute('data-lang') ||
|
||||||
|
this.getAttribute('data-tab');
|
||||||
|
|
||||||
|
if (callback) callback(id);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|||||||
Vendored
+1
-1
@@ -2,7 +2,7 @@
|
|||||||
"entrypoints": {
|
"entrypoints": {
|
||||||
"main": {
|
"main": {
|
||||||
"css": [
|
"css": [
|
||||||
"/dist/main.32ef094c.css"
|
"/dist/main.a73f4b77.css"
|
||||||
],
|
],
|
||||||
"js": [
|
"js": [
|
||||||
"/dist/main.3be5bc06.js"
|
"/dist/main.3be5bc06.js"
|
||||||
|
|||||||
File diff suppressed because one or more lines are too long
Reference in New Issue
Block a user