You've already forked php-flasher
mirror of
https://github.com/php-flasher/php-flasher.git
synced 2026-04-05 12:32:55 +01:00
63 lines
2.4 KiB
HTML
63 lines
2.4 KiB
HTML
<!-- Flasher Theme Notifications -->
|
||
<div class="p-3 grid grid-cols-1 md:grid-cols-2 gap-3">
|
||
<!-- Success -->
|
||
<div class="fl-flasher fl-success fl-container fl-show hover:-translate-y-0.5 transition-all duration-200" role="status" aria-live="polite" aria-atomic="true">
|
||
<div class="fl-content">
|
||
<div class="fl-icon"></div>
|
||
<div>
|
||
<strong class="fl-title">Success</strong>
|
||
<span class="fl-message">Data has been saved successfully!</span>
|
||
</div>
|
||
<button class="fl-close" aria-label="Close success message">×</button>
|
||
</div>
|
||
<span class="fl-progress-bar">
|
||
<span class="fl-progress" style="width: 40%;"></span>
|
||
</span>
|
||
</div>
|
||
|
||
<!-- Error -->
|
||
<div class="fl-flasher fl-error fl-container fl-show hover:-translate-y-0.5 transition-all duration-200" role="alert" aria-live="assertive" aria-atomic="true">
|
||
<div class="fl-content">
|
||
<div class="fl-icon"></div>
|
||
<div>
|
||
<strong class="fl-title">Error</strong>
|
||
<span class="fl-message">Oops! Something went wrong!</span>
|
||
</div>
|
||
<button class="fl-close" aria-label="Close error message">×</button>
|
||
</div>
|
||
<span class="fl-progress-bar">
|
||
<span class="fl-progress" style="width: 30%;"></span>
|
||
</span>
|
||
</div>
|
||
|
||
<!-- Warning -->
|
||
<div class="fl-flasher fl-warning fl-container fl-show hover:-translate-y-0.5 transition-all duration-200" role="alert" aria-live="assertive" aria-atomic="true">
|
||
<div class="fl-content">
|
||
<div class="fl-icon"></div>
|
||
<div>
|
||
<strong class="fl-title">Warning</strong>
|
||
<span class="fl-message">Are you sure you want to proceed?</span>
|
||
</div>
|
||
<button class="fl-close" aria-label="Close warning message">×</button>
|
||
</div>
|
||
<span class="fl-progress-bar">
|
||
<span class="fl-progress" style="width: 20%;"></span>
|
||
</span>
|
||
</div>
|
||
|
||
<!-- Info -->
|
||
<div class="fl-flasher fl-info fl-container fl-show hover:-translate-y-0.5 transition-all duration-200" role="status" aria-live="polite" aria-atomic="true">
|
||
<div class="fl-content">
|
||
<div class="fl-icon"></div>
|
||
<div>
|
||
<strong class="fl-title">Information</strong>
|
||
<span class="fl-message">Welcome back!</span>
|
||
</div>
|
||
<button class="fl-close" aria-label="Close info message">×</button>
|
||
</div>
|
||
<span class="fl-progress-bar">
|
||
<span class="fl-progress" style="width: 10%;"></span>
|
||
</span>
|
||
</div>
|
||
</div>
|