Fix mailing preview; fixes #1800

[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 29c413005d6cd890d45d24fc84d4bc9c1c8e0dcc..9c0632f89ba2902432e1bdfd1c44cd4fb7f2cfa9 100644 (file)
--- a/galette/templates/default/modals/mailing_preview.html.twig
+++ b/galette/templates/default/modals/mailing_preview.html.twig
@@ -1,42 +1,61 @@
 {% extends (mode == 'ajax') ? "ajax.html.twig" : "page.html.twig" %}
 
 {% block content %}
-        <section id="mailing_header" class="ajax_mailing_preview">
-            <header class="ui-state-active ui-corner-top">{{ _T("Headers") }}</header>
-            <dl>
-                <dt>{{ _T("From:") }}</dt>
-                <dd>{{ sender }}</dd>
-                <dt>{{ _T("To:") }}</dt>
-                <dd>
+        <div class="ui top attached accordion-styled header">
+            {{ _T("Headers") }}
+        </div>
+        <div class="ui bottom attached accordion-styled segment">
+            <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 %}
-                </dd>
-                <dt>{{ _T("Subject:") }}</dt>
-                <dd>{{ mailing.subject }}</dd>
-                <dt>{{ _T("Attachments:") }}</dt>
-                <dd>
+                        </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 link 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 %}
-                </dd>
-            </dl>
-        </section>
-        <section id="mailing_preview" class="ajax_mailing_preview">
-            <header class="ui-state-active ui-corner-top">{{ _T("Mail body") }}</header>
-            <div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+
+        <div class="ui top attached accordion-styled header">
+            {{ _T("Mail body") }}
+        </div>
+        <div class="ui bottom attached accordion-styled segment">
     {% if mailing.html %}
-                {{ mailing.message }}
+            {{ mailing.message|raw }}
     {% else %}
-                <pre>{{ mailing.wrapped_message|escape }}</pre>
+            <pre>{{ mailing.wrapped_message|escape }}</pre>
     {% endif %}
-            </div>
-        </section>
+        </div>
 {% endblock %}