diff --git a/public/assets/css/app.css b/public/assets/css/app.css index d3771b78c2c42811b3e8efe862a075f235bf598b..c85ae9efcc95b6433c529f5d63a14629d8d2d491 100755 --- a/public/assets/css/app.css +++ b/public/assets/css/app.css @@ -604,4 +604,23 @@ audio::-webkit-media-controls-mute-button { padding: 15px; border-radius: 15px; box-shadow: 2px 2px 6px 0px rgba(0,0,0,0.63); +} + +#flashes { + display: none; + width: fit-content; + min-width: 33%; + position: absolute; + top: 90px; + left: 0; + right: 0; + margin-left: auto; + margin-right: auto; + text-align: center; + z-index: 150; +} +#flashes .alert { + padding-left: 40px; + padding-right: 40px; + box-shadow: 2px 2px 6px 0px rgba(0,0,0,0.63); } \ No newline at end of file diff --git a/public/assets/js/app.js b/public/assets/js/app.js index a9f22ab69efdef07fef45def81645914c711ebd8..c4ed772d7763abd607d08496c79dced4a92c2938 100755 --- a/public/assets/js/app.js +++ b/public/assets/js/app.js @@ -54,6 +54,7 @@ $(function() { function initializeForm() { initializeFieldsSelect2(); initializeOverlayOnClick(); + initializeFlashes(); // initializeToggleFields(); // initializeClickableRows(); // initializePopover(); @@ -529,4 +530,15 @@ function initializeAjaxReload() { } }); }) +} + +function initializeFlashes() { + // show si content puis hide + $flashes = $('#flashes'); + if ($flashes.find('.alert').length) { + $flashes.show(); + window.setTimeout(function () { + $flashes.fadeOut(1000); + }, 4000); + } } \ No newline at end of file diff --git a/templates/_flashMessages.html.twig b/templates/_flashMessages.html.twig index 3610497d4d6462b69783b486163613bf974524da..2f672d72303fd92d44e42069d5c98610799173ac 100644 --- a/templates/_flashMessages.html.twig +++ b/templates/_flashMessages.html.twig @@ -1,9 +1,8 @@ {% if app.session.started %} {% for type, flashes in app.session.flashbag.all %} {% for message in flashes %} - <div class="alert alert-{{ type }} alert-dismissible fade show" role="alert"> + <div class="alert alert-{{ type }}" role="alert"> {{ message|trans|raw }} - <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button> </div> {% endfor %} {% endfor %} diff --git a/templates/base.html.twig b/templates/base.html.twig index 7498dde53d18a0a669db5f061fd02d933e968fef..b389d0eae1b229567177cd13f6170f82c02489d3 100644 --- a/templates/base.html.twig +++ b/templates/base.html.twig @@ -40,10 +40,8 @@ {# {% for flashMessage in app.flashes('notice') %} <div class="alert alert-notice"> {{ flashMessage }} </div> {% endfor %}#} - <div id="flashes" class="row mx-lg-5 mx-sm-3 text-center"> - <div class="col-md-12"> - {% include "_flashMessages.html.twig" %} - </div> + <div id="flashes"> + {% include "_flashMessages.html.twig" %} </div> {% endblock flash_messages %} diff --git a/templates/flashes.html.twig b/templates/flashes.html.twig index 2fb995933d7ba926b55fea091ac476085ceca9eb..2277bd5d1966abdd63e08da72eb5ab51c2d4162c 100644 --- a/templates/flashes.html.twig +++ b/templates/flashes.html.twig @@ -3,9 +3,8 @@ {% if app.session.started %} {% for type, flashes in app.session.flashbag.all %} {% for message in flashes %} - <div class="alert alert-{{ type }} alert-dismissible fade show" role="alert"> + <div class="alert alert-{{ type }}" role="alert"> {{ message|trans|raw }} - <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button> </div> {% endfor %} {% endfor %} diff --git a/templates/reloadFlashes.html.twig b/templates/reloadFlashes.html.twig new file mode 100644 index 0000000000000000000000000000000000000000..49b3caec6b25319523d33257c27e3e7ec7310921 --- /dev/null +++ b/templates/reloadFlashes.html.twig @@ -0,0 +1,9 @@ +<script id="refreshedFlashes" type="text/template"> + {% include 'flashes.html.twig' %} +</script> + +<script type="text/javascript"> + $('#flashes').html($('#refreshedFlashes').html()); + $('#refreshedFlashes').remove(); + initializeFlashes(); +</script> \ No newline at end of file