fix(bootstrap5): add gap-2 between status alert icon and message text

Removing justify-content-between left the icon and text touching with no
spacing after handleNotification rerenders the alert into two flex
children. Add gap-2 (0.5rem) on the parent so they get a small visual
break consistent with Bootstrap 5 alert conventions.

The deleted-paste case (icon + text inline inside the inner div, plus the
"Start over" button as the second child) keeps its original spacing
because PHP_EOL provides the icon-text separation; gap-2 only adds 0.5rem
between the inner div and the right-aligned button, which reads cleanly.
This commit is contained in:
Trevin Chow 2026-04-29 15:13:33 -07:00
parent 7f61ff139c
commit 92ea78005b

View file

@ -378,7 +378,7 @@ if ($FILEUPLOAD) :
<?php
endif;
?>
<div id="status" role="alert" class="d-flex align-items-center alert alert-<?php echo $ISDELETED ? 'success' : 'info'; echo empty($STATUS) ? ' hidden' : '' ?>">
<div id="status" role="alert" class="d-flex align-items-center gap-2 alert alert-<?php echo $ISDELETED ? 'success' : 'info'; echo empty($STATUS) ? ' hidden' : '' ?>">
<div>
<svg width="16" height="16" fill="currentColor" aria-hidden="true"><use href="img/bootstrap-icons.svg#info-circle" /></svg>
<?php echo I18n::encode($STATUS), PHP_EOL; ?>