Fix scrolling in emailing preview's modal

[galette.git] / galette / templates / default / modals / mailing_preview.html.twig

diff --git a/galette/templates/default/modals/mailing_preview.html.twig b/galette/templates/default/modals/mailing_preview.html.twig
index 5381cbd083894225f2e7c6d0b7deb54c5c4a5004..f768f88b2c9a6a87a6421df24bca6badd5a3692c 100644 (file)
--- a/galette/templates/default/modals/mailing_preview.html.twig
+++ b/galette/templates/default/modals/mailing_preview.html.twig
@@ -1,58 +1,61 @@
 {% extends (mode == 'ajax') ? "ajax.html.twig" : "page.html.twig" %}
 
 {% block content %}
-    <section id="mailing_header" class="ajax_mailing_preview">
         <div class="ui top attached accordion-styled header">
             {{ _T("Headers") }}
         </div>
         <div class="ui bottom attached accordion-styled segment">
-            <table class="ui very basic striped table">
-                <tbody>
-                    <tr>
-                        <th>{{ _T("From:") }}</th>
-                        <td>{{ sender }}</td>
-                    </tr>
-                    <tr>
-                        <th>{{ _T("To:") }}</th>
-                        <td>
+            <div class="ui basic segments form">
+                <div class="ui segment">
+                    <div class="inline field">
+                        <label>{{ _T("From:") }}</label>
+                        <span>{{ sender }}</span>
+                    </div>
+                </div>
+                <div class="ui segment">
+                    <div class="inline field">
+                        <label>{{ _T("To:") }}</label>
+                        <div class="ui horizontal bulleted link list">
     {% for recipient in recipients %}
         {% if recipient.email is null and recipient.hasParent() %}
             {% set email = recipient.parent.email %}
         {% else %}
             {% set email = recipient.email %}
         {% endif %}
-                            <a href="mailto:{{ email }}">{{ recipient.sname }} &lt;{{ email }}&gt;</a>{% if not loop.last %}, {% endif %}
+                            <a href="mailto:{{ email }}" class="item">{{ recipient.sname }} &lt;{{ email }}&gt;</a>
     {% endfor %}
-                        </td>
-                    </tr>
-                    <tr>
-                        <th>{{ _T("Subject:") }}</th>
-                        <td>{{ mailing.subject }}</td>
-                    </tr>
-                    <tr>
-                        <th>{{ _T("Attachments:") }}</th>
-                        <td>
+                        </div>
+                    </div>
+                </div>
+                <div class="ui segment">
+                    <div class="inline field">
+                        <label>{{ _T("Subject:") }}</label>
+                        <span>{{ mailing.subject }}</span>
+                    </div>
+                </div>
+                <div class="ui segment">
+                    <div class="inline field">
+                        <label>{{ _T("Attachments:") }}</label>
+                        <div class="ui horizontal bulleted link list">
     {% for attachment in attachments %}
-                            <span class="attached"><a target="_blank" href="{{ path_for("previewAttachment", {"id": mailing_id, "pos": loop.index}) }}"><i class="ui paperclip icon"></i>{{ attachment.getFileName() }}</a></span>
+                            <a target="_blank" href="{{ url_for("previewAttachment", {"id": mailing_id, "pos": loop.index}) }}" class="item"><i class="ui paperclip icon" aria-hidden="true"></i>{{ attachment.getFileName() }}</a>
     {% else %}
-                    -
+                            <span class="item">-</span>
     {% endfor %}
-                        </td>
-                    </tr>
-                </tbody>
-            </table>
+                        </div>
+                    </div>
+                </div>
+            </div>
         </div>
-    </section>
-    <section id="mailing_preview" class="ajax_mailing_preview">
+
         <div class="ui top attached accordion-styled header">
             {{ _T("Mail body") }}
         </div>
-        <div class="ui bottom attached accordion-styled segment">
+        <div class="ui bottom attached accordion-styled{% if mode == 'ajax' %} scrolling{% endif %} segment">
     {% if mailing.html %}
-            {{ mailing.message }}
+            {{ mailing.message|raw }}
     {% else %}
             <pre>{{ mailing.wrapped_message|escape }}</pre>
     {% endif %}
         </div>
-    </section>
 {% endblock %}