[BootstrapAdminUi] Remove text-nowrap class

Sylius · Dec 10, 2024 · 5ff2ff9 · 5ff2ff9
1 parent cbcf27f
commit 5ff2ff9
Show file tree

Hide file tree

Showing 6 changed files with 54 additions and 20 deletions.
diff --git a/src/BootstrapAdminUi/assets/styles/_flashes.scss b/src/BootstrapAdminUi/assets/styles/_flashes.scss
@@ -0,0 +1,14 @@
+/*!
+ * This file is part of the Sylius package.
+ *
+ * (c) Sylius Sp. z o.o.
+ *
+ * For the full copyright and license information, please view the LICENSE
+ * file that was distributed with this source code.
+ */
+
+.alert {
+  .close {
+    cursor: pointer;
+  }
+}
diff --git a/src/BootstrapAdminUi/assets/styles/main.scss b/src/BootstrapAdminUi/assets/styles/main.scss
@@ -15,6 +15,7 @@
 
 @import "alert";
 @import "datatable";
+@import "flashes";
 @import "form";
 @import "navbar";
 @import "icons";

diff --git a/src/BootstrapAdminUi/public/app.css b/src/BootstrapAdminUi/public/app.css
diff --git a/src/BootstrapAdminUi/public/app.rtl.css b/src/BootstrapAdminUi/public/app.rtl.css
diff --git a/src/BootstrapAdminUi/templates/shared/crud/common/content/flashes.html.twig b/src/BootstrapAdminUi/templates/shared/crud/common/content/flashes.html.twig
@@ -12,28 +12,33 @@
         {% for type in ['success', 'error', 'info', 'warning'] %}
             {% for flash in session.flashbag.get(type) %}
                 <div
-                    class="sylius alert alert-{{ type == 'error' ? 'danger' : type }}"
-                    role="alert"
-                    {{ sylius_test_html_attribute('sylius-flash-message') }}
-                    {{ sylius_test_html_attribute('sylius-flash-message-type', type) }}
+                        class="sylius alert alert-{{ type == 'error' ? 'danger' : type }}"
+                        role="alert"
+                        {{ sylius_test_html_attribute('sylius-flash-message') }}
+                        {{ sylius_test_html_attribute('sylius-flash-message-type', type) }}
                 >
-                    <div class="d-flex">
-                        <div>
-                            {{ ux_icon(icons[type]) }}
-                        </div>
-                        <div class="mx-2">
-                            <h4 class="alert-title">
-                                {% set header = 'sylius.ui.' ~ type %}
-                                {{ header|trans }}
-                            </h4>
-                            <div class="text-secondary">
-                                {% if flash is iterable %}
-                                    {{ flash.message|trans(flash.parameters, 'flashes') }}
-                                {% else %}
-                                    {{ flash|trans({}, 'flashes') }}
-                                {% endif %}
+                    <div class="d-flex justify-content-between">
+                        <div class="d-flex">
+                            <div>
+                                {{ ux_icon(icons[type]) }}
+                            </div>
+                            <div class="mx-2">
+                                <h4 class="alert-title">
+                                    {% set header = 'sylius.ui.' ~ type %}
+                                    {{ header|trans }}
+                                </h4>
+                                <div class="text-secondary">
+                                    {% if flash is iterable %}
+                                        {{ flash.message|trans(flash.parameters, 'flashes') }}
+                                    {% else %}
+                                        {{ flash|trans({}, 'flashes') }}
+                                    {% endif %}
+                                </div>
                             </div>
                         </div>
+                        <span class="justify-self-end close" data-bs-dismiss="alert" aria-label="Close">
+                            {{ ux_icon('tabler:x') }}
+                        </span>
                     </div>
                 </div>
             {% endfor %}

diff --git a/src/BootstrapAdminUi/templates/shared/crud/index/content/grid/data_table.html.twig b/src/BootstrapAdminUi/templates/shared/crud/index/content/grid/data_table.html.twig
@@ -22,7 +22,7 @@
             </div>
         </div>
         <div class="table-responsive">
-            <table class="table card-table table-vcenter text-nowrap datatable" {{ sylius_test_html_attribute('grid-table') }}>
+            <table class="table card-table table-vcenter datatable" {{ sylius_test_html_attribute('grid-table') }}>
                 <thead>
                 <tr>
                     {{ table.headers(resources, resources.definition, app.request.attributes) }}