29 lines
1.0 KiB
Plaintext
29 lines
1.0 KiB
Plaintext
|
#flash
|
||
|
-if flash.alert
|
||
|
.m-20.rounded.border-l-4.border-red-500.bg-red-50.p-4{:role => "alert"}
|
||
|
%strong.block.font-medium.text-red-700 Oops
|
||
|
%p.mt-2.text-sm.text-red-700
|
||
|
=flash.alert
|
||
|
|
||
|
-if flash.notice
|
||
|
.rounded-xl.border.border-gray-100.p-4.shadow-xl{:role => "alert"}
|
||
|
.flex.items-start.gap-4
|
||
|
%span.text-green-600
|
||
|
%svg.h-6.w-6{:fill => "none", :stroke => "currentColor", "stroke-width" => "1.5", :viewbox => "0 0 24 24", :xmlns => "http://www.w3.org/2000/svg"}
|
||
|
%path{:d => "M9 12.75L11.25 15 15 9.75M21 12a9 9 0 11-18 0 9 9 0 0118 0z", "stroke-linecap" => "round", "stroke-linejoin" => "round"}
|
||
|
.flex-1
|
||
|
%strong.block.font-medium.text-gray-900 Ok
|
||
|
%p.mt-1.text-sm.text-gray-700
|
||
|
= flash.notice
|
||
|
|
||
|
:javascript
|
||
|
function hideNotice() {
|
||
|
const notification = document.querySelector('#flash')
|
||
|
if (notification) {
|
||
|
setInterval(function() {
|
||
|
notification.classList.add('collapse');
|
||
|
}, 5000);
|
||
|
}
|
||
|
}
|
||
|
hideNotice();
|