From b9a3f215bc26a5f58a7da42a73412a6d22b2e45f Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Fr=C3=A9d=C3=A9ric=20P=C3=A9ters?= <fpeters@entrouvert.com>
Date: Wed, 8 Apr 2020 09:57:02 +0200
Subject: [PATCH 1/2] backoffice: use native gadjo style for variables table
 (#41316)

---
 wcs/admin/workflows.py              |  1 -
 wcs/qommon/admin/emails.py          |  8 ++------
 wcs/qommon/admin/texts.py           |  6 ++----
 wcs/qommon/static/css/dc2/admin.css |  9 +++------
 wcs/qommon/substitution.py          | 11 +++++++++--
 5 files changed, 16 insertions(+), 19 deletions(-)

diff --git a/wcs/admin/workflows.py b/wcs/admin/workflows.py
index 2de435a8a..060ed71c0 100644
--- a/wcs/admin/workflows.py
+++ b/wcs/admin/workflows.py
@@ -288,7 +288,6 @@ class WorkflowItemPage(Directory):
             r += htmltext('<h2>%s</h2>') % _(self.item.description)
             r += form.render()
             if self.item.support_substitution_variables:
-                r += htmltext('<h3>%s</h3>') % _('Variables')
                 r += get_publisher().substitutions.get_substitution_html_table()
             return r.getvalue()
         else:
diff --git a/wcs/qommon/admin/emails.py b/wcs/qommon/admin/emails.py
index 2b8998bda..f1ced55dd 100644
--- a/wcs/qommon/admin/emails.py
+++ b/wcs/qommon/admin/emails.py
@@ -223,12 +223,8 @@ class EmailsDirectory(Directory):
         r = TemplateIO(html=True)
         r += htmltext('<h2>%s - %s</h2>') % (_('Email'), email_label)
         r += form.render()
-
-        r += htmltext('<h3>%s</h3>') % _('Substitution Variables')
-        r += htmltext('<p>')
-        r += _('The email subject and body can reference variables from the table below:')
-        r += htmltext('</p>')
-        r += get_publisher().substitutions.get_substitution_html_table()
+        r += get_publisher().substitutions.get_substitution_html_table(
+                intro=_('The email subject and body can reference variables from the table below:'))
         return r.getvalue()
 
     def email_submit(self, form, email_key, check_template = None):
diff --git a/wcs/qommon/admin/texts.py b/wcs/qommon/admin/texts.py
index 3e5c71b49..e195af675 100644
--- a/wcs/qommon/admin/texts.py
+++ b/wcs/qommon/admin/texts.py
@@ -146,10 +146,8 @@ class TextsDirectory(Directory):
         r = TemplateIO(html=True)
         r += htmltext('<h2>%s - %s</h2>') % (_('Text'), text_label)
         r += form.render()
-
-        r += htmltext('<h3>%s</h3>') % _('Substitution Variables')
-        r += htmltext('<p>%s</p>') % _('The text can reference variables from the table below:')
-        r += htmltext(get_publisher().substitutions.get_substitution_html_table())
+        r += get_publisher().substitutions.get_substitution_html_table(
+                intro=_('The text can reference variables from the table below:'))
         return r.getvalue()
 
     def text_submit(self, form, text_key, check_template = None):
diff --git a/wcs/qommon/static/css/dc2/admin.css b/wcs/qommon/static/css/dc2/admin.css
index bc013e5e5..d8a702dab 100644
--- a/wcs/qommon/static/css/dc2/admin.css
+++ b/wcs/qommon/static/css/dc2/admin.css
@@ -829,15 +829,13 @@ div.dataview::after {
 	border-bottom: 1px solid #bcbcbc;
 }
 
-table.franceconnect-attrs,
-table#substvars {
+table.franceconnect-attrs {
 	border-bottom: 1px solid #eee;
 	border-collapse: collapse;
 	margin: 1em 0;
 }
 
-table.franceconnect-attrs th,
-table#substvars th {
+table.franceconnect-attrs th {
 	background: #eee;
 	border: 1px solid #eee;
 	border-style: solid solid none;
@@ -845,8 +843,7 @@ table#substvars th {
 	padding: 0 1em;
 }
 
-table.franceconnect-attrs td,
-table#substvars td {
+table.franceconnect-attrs td {
 	border: 1px solid #eee;
 	padding: 0 1em;
 	border-style: none solid;
diff --git a/wcs/qommon/substitution.py b/wcs/qommon/substitution.py
index 29174c841..b340e9a58 100644
--- a/wcs/qommon/substitution.py
+++ b/wcs/qommon/substitution.py
@@ -125,10 +125,15 @@ class Substitutions(object):
         return d
 
     @classmethod
-    def get_substitution_html_table(cls):
+    def get_substitution_html_table(cls, intro=None):
         from . import _
         r = TemplateIO(html=True)
-        r += htmltext('<table id="substvars">')
+        r += htmltext('<div class="section">')
+        r += htmltext('<h3>%s</h3>') % _('Variables')
+        r += htmltext('<div>')
+        if intro:
+            r += htmltext('<p>%s</p>') % intro
+        r += htmltext('<table id="substvars" class="main">')
         r += htmltext('<thead><tr><th>%s</th><th>%s</th><th>%s</th></tr></thead>' % (
                         _('Category'), _('Variable'), _('Comment')))
         r += htmltext('<tbody>')
@@ -142,6 +147,8 @@ class Substitutions(object):
                 category, '{{ %s }}' % variable, comment))
         r += htmltext('</tbody>')
         r += htmltext('</table>')
+        r += htmltext('</div>')
+        r += htmltext('</div>')
         return r.getvalue()
 
 
-- 
2.26.0

