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:
Younes ENNAJI
@@ -1,5 +1,5 @@
|
||||
{
|
||||
"dist/main.css": "/dist/main.9d03d300.css",
|
||||
"dist/main.css": "/dist/main.9ecbb439.css",
|
||||
"dist/main.js": "/dist/main.3be5bc06.js",
|
||||
"dist/455.3a7b4474.css": "/dist/455.3a7b4474.css",
|
||||
"dist/455.095e6545.js": "/dist/455.095e6545.js",
|
||||
|
||||
+23
-124
@@ -53,159 +53,57 @@ layout: default
|
||||
helps you easily add flash notifications to your <strong>Symfony</strong> projects, improving user feedback with minimal setup.
|
||||
</p>
|
||||
|
||||
<!-- Version requirements - improved design -->
|
||||
|
||||
|
||||
|
||||
<!-- Version requirements -->
|
||||
<div class="mb-8">
|
||||
<!-- Section Title -->
|
||||
<h3 class="text-sm uppercase tracking-wide text-indigo-500 font-semibold mb-4">System Requirements</h3>
|
||||
|
||||
<!-- Requirements Cards Container -->
|
||||
<div class="grid grid-cols-1 md:grid-cols-2 gap-8 perspective-1000">
|
||||
<!-- PHP Card -->
|
||||
<div class="group relative transform transition-all duration-500 hover:-translate-y-2 hover:rotate-1">
|
||||
<!-- Glossy background with animated gradient -->
|
||||
<div class="absolute inset-0 bg-gradient-to-br from-indigo-400/20 via-purple-400/20 to-pink-400/20 rounded-2xl blur opacity-60 group-hover:opacity-80 transition-opacity"></div>
|
||||
|
||||
<!-- Card content -->
|
||||
<div class="relative overflow-hidden rounded-2xl border border-indigo-200 bg-gradient-to-br from-white to-indigo-50 p-1">
|
||||
<div class="absolute -right-12 -top-12 h-40 w-40 bg-indigo-100 rounded-full opacity-30"></div>
|
||||
<div class="absolute -left-4 -bottom-4 h-24 w-24 bg-purple-100 rounded-full opacity-30"></div>
|
||||
|
||||
<div class="relative backdrop-blur-sm bg-white/80 rounded-xl p-6 h-full shadow-sm">
|
||||
<!-- Top bar indicator -->
|
||||
<div class="absolute top-0 left-0 right-0 h-1 bg-gradient-to-r from-indigo-600 to-purple-600 rounded-t-xl"></div>
|
||||
<div class="group relative bg-white rounded-lg border border-indigo-200 shadow-sm overflow-hidden transition-all duration-300 hover:shadow-md hover:-translate-y-1">
|
||||
<!-- Subtle accent line -->
|
||||
<div class="absolute top-1 inset-x-0 h-1 bg-gradient-to-r from-indigo-500 to-indigo-600"></div>
|
||||
|
||||
<div class="p-5">
|
||||
<div class="flex items-center">
|
||||
<!-- Icon with animated ring -->
|
||||
<div class="relative">
|
||||
<div class="absolute inset-0 bg-indigo-200 rounded-full animate-ping opacity-30 group-hover:opacity-60 duration-1000"></div>
|
||||
<div class="relative bg-gradient-to-br from-indigo-500 to-indigo-700 rounded-full h-16 w-16 flex items-center justify-center shadow-lg">
|
||||
<i class="fa-brands fa-php text-white text-2xl"></i>
|
||||
</div>
|
||||
<div class="bg-gradient-to-br from-indigo-500 to-indigo-600 rounded-full h-12 w-12 flex items-center justify-center shadow-sm group-hover:shadow transition-all">
|
||||
<i class="fa-brands fa-php text-white text-xl"></i>
|
||||
</div>
|
||||
|
||||
<div class="ml-6 flex flex-col">
|
||||
<div class="uppercase tracking-wider text-xs font-bold text-indigo-400">Required</div>
|
||||
<h4 class="text-xl font-bold text-slate-800">PHP Version</h4>
|
||||
<div class="flex items-center mt-1.5">
|
||||
<span class="inline-block px-3 py-1 rounded-full bg-gradient-to-r from-indigo-100 to-indigo-200 text-indigo-800 font-semibold text-sm">
|
||||
<div class="ml-4">
|
||||
<div class="text-xs uppercase tracking-wider text-indigo-500 font-semibold mb-0.5">Required</div>
|
||||
<h4 class="font-bold text-slate-800 text-lg">PHP Version</h4>
|
||||
<div class="mt-1 inline-block px-2.5 py-0.5 bg-indigo-100 text-indigo-800 text-sm font-medium rounded-full">
|
||||
v8.2 or higher
|
||||
</span>
|
||||
<div class="ml-2 h-2 w-2 bg-green-500 rounded-full animate-pulse"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Bottom compatibility note -->
|
||||
<div class="mt-4 pt-4 border-t border-indigo-100 text-sm text-slate-500 flex items-center">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4 text-indigo-400 mr-1.5" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z" />
|
||||
</svg>
|
||||
<span>Recommended: PHP 8.2+</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Symfony Card -->
|
||||
<div class="group relative transform transition-all duration-500 hover:-translate-y-2 hover:-rotate-1">
|
||||
<!-- Glossy background with animated gradient -->
|
||||
<div class="absolute inset-0 bg-gradient-to-br from-slate-400/20 via-black/10 to-black/20 rounded-2xl blur opacity-60 group-hover:opacity-80 transition-opacity"></div>
|
||||
|
||||
<!-- Card content -->
|
||||
<div class="relative overflow-hidden rounded-2xl border border-slate-200 bg-gradient-to-br from-white to-slate-50 p-1">
|
||||
<div class="absolute -right-12 -top-12 h-40 w-40 bg-slate-100 rounded-full opacity-30"></div>
|
||||
<div class="absolute -left-4 -bottom-4 h-24 w-24 bg-slate-100 rounded-full opacity-30"></div>
|
||||
|
||||
<div class="relative backdrop-blur-sm bg-white/80 rounded-xl p-6 h-full shadow-sm">
|
||||
<!-- Top bar indicator -->
|
||||
<div class="absolute top-0 left-0 right-0 h-1 bg-gradient-to-r from-slate-600 to-black rounded-t-xl"></div>
|
||||
<div class="group relative bg-white rounded-lg border border-slate-200 shadow-sm overflow-hidden transition-all duration-300 hover:shadow-md hover:-translate-y-1">
|
||||
<!-- Subtle accent line -->
|
||||
<div class="absolute top-1 inset-x-0 h-1 bg-gradient-to-r from-slate-700 to-black"></div>
|
||||
|
||||
<div class="p-5">
|
||||
<div class="flex items-center">
|
||||
<!-- Icon with animated ring -->
|
||||
<div class="relative">
|
||||
<div class="absolute inset-0 bg-slate-200 rounded-full animate-ping opacity-30 group-hover:opacity-60 duration-1000"></div>
|
||||
<div class="relative bg-gradient-to-br from-slate-700 to-black rounded-full h-16 w-16 flex items-center justify-center shadow-lg">
|
||||
<i class="fa-brands fa-symfony text-white text-2xl"></i>
|
||||
</div>
|
||||
<div class="bg-gradient-to-br from-slate-700 to-black rounded-full h-12 w-12 flex items-center justify-center shadow-sm group-hover:shadow transition-all">
|
||||
<i class="fa-brands fa-symfony text-white text-xl"></i>
|
||||
</div>
|
||||
|
||||
<div class="ml-6 flex flex-col">
|
||||
<div class="uppercase tracking-wider text-xs font-bold text-slate-400">Required</div>
|
||||
<h4 class="text-xl font-bold text-slate-800">Symfony Version</h4>
|
||||
<div class="flex items-center mt-1.5">
|
||||
<span class="inline-block px-3 py-1 rounded-full bg-gradient-to-r from-slate-100 to-slate-200 text-slate-800 font-semibold text-sm">
|
||||
<div class="ml-4">
|
||||
<div class="text-xs uppercase tracking-wider text-slate-500 font-semibold mb-0.5">Required</div>
|
||||
<h4 class="font-bold text-slate-800 text-lg">Symfony Version</h4>
|
||||
<div class="mt-1 inline-block px-2.5 py-0.5 bg-slate-100 text-slate-800 text-sm font-medium rounded-full">
|
||||
v7.0 or higher
|
||||
</span>
|
||||
<div class="ml-2 h-2 w-2 bg-green-500 rounded-full animate-pulse"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Bottom compatibility note -->
|
||||
<div class="mt-4 pt-4 border-t border-slate-100 text-sm text-slate-500 flex items-center">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4 text-slate-400 mr-1.5" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z" />
|
||||
</svg>
|
||||
<span>Recommended: Symfony 7.0+</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Legacy version note -->
|
||||
<div class="mt-6 bg-gradient-to-r from-amber-50 to-orange-50 rounded-xl p-5 border border-amber-200/50 shadow-sm transform transition-all hover:shadow-md">
|
||||
<div class="flex items-start">
|
||||
<div class="shrink-0 bg-amber-100 rounded-full p-2.5 mt-0.5">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5 text-amber-600" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z" />
|
||||
</svg>
|
||||
</div>
|
||||
<div class="ml-4">
|
||||
<h3 class="text-base font-medium text-amber-800">Using older versions?</h3>
|
||||
<p class="mt-1 text-amber-700">
|
||||
For PHP < 8.2 or Symfony < 7.0, use
|
||||
<a href="https://php-flasher.github.io/" class="font-medium text-amber-900 underline hover:text-amber-800 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-amber-500 rounded">
|
||||
<span class="font-semibold">PHPFlasher v1</span>
|
||||
</a>.
|
||||
It supports PHP ≥ 5.3 and Symfony ≥ 2.0.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="grid grid-cols-1 md:grid-cols-2 gap-4 mb-6">
|
||||
<div class="bg-gradient-to-br from-indigo-50 to-slate-50 rounded-lg border border-indigo-100 p-4 shadow-sm">
|
||||
<div class="flex items-center">
|
||||
<div class="bg-indigo-100 rounded-full h-12 w-12 flex items-center justify-center mr-4">
|
||||
<i class="fa-brands fa-php text-indigo-600 text-xl"></i>
|
||||
</div>
|
||||
<div>
|
||||
<h4 class="font-semibold text-slate-800">PHP Version</h4>
|
||||
<p class="text-indigo-700">v8.2 or higher</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="bg-gradient-to-br from-indigo-50 to-slate-50 rounded-lg border border-indigo-100 p-4 shadow-sm">
|
||||
<div class="flex items-center">
|
||||
<div class="bg-indigo-100 rounded-full h-12 w-12 flex items-center justify-center mr-4">
|
||||
<i class="fa-brands fa-symfony text-indigo-600 text-xl"></i>
|
||||
</div>
|
||||
<div>
|
||||
<h4 class="font-semibold text-slate-800">Symfony Version</h4>
|
||||
<p class="text-indigo-700">v7.0 or higher</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- PHPFlasher v1 for older versions -->
|
||||
<div class="bg-amber-50 border-l-4 border-amber-300 rounded-r-lg p-5 mb-6">
|
||||
<div class="bg-amber-50 border-l-4 border-amber-300 rounded-r-lg p-4 mt-5 mb-6">
|
||||
<div class="flex">
|
||||
<div class="flex-shrink-0 flex items-center justify-center">
|
||||
<i class="fa-solid fa-lightbulb text-amber-500"></i>
|
||||
@@ -224,6 +122,7 @@ layout: default
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Installation Section -->
|
||||
<div id="installation" class="mt-10 scroll-mt-20">
|
||||
|
||||
Vendored
+1
-1
@@ -2,7 +2,7 @@
|
||||
"entrypoints": {
|
||||
"main": {
|
||||
"css": [
|
||||
"/dist/main.9d03d300.css"
|
||||
"/dist/main.9ecbb439.css"
|
||||
],
|
||||
"js": [
|
||||
"/dist/main.3be5bc06.js"
|
||||
|
||||
File diff suppressed because one or more lines are too long
Reference in New Issue
Block a user