[taler-taler-ops-www] branch master updated (991a994 -> f18956a)

[gnunet]

This is an automated email from the git hooks/post-receive script.

nora-grothoff pushed a change to branch master
in repository taler-ops-www.

    from 991a994  new screenshots
     new 3e9c40c  more fee style stuff
     new f18956a  expand by default

The 2 revisions listed above as "new" are entirely new to this
repository and will be described in separate emails.  The revisions
listed as "add" were already present in the repository and have only
been added to this reference.


Summary of changes:
 static/js/toggleable.ts |   1 -
 template/fees.html.j2   | 109 +++++++++++++++++++++++++++---------------------
 2 files changed, 62 insertions(+), 48 deletions(-)

diff --git a/static/js/toggleable.ts b/static/js/toggleable.ts
index 6f7e43b..13c087a 100644
--- a/static/js/toggleable.ts
+++ b/static/js/toggleable.ts
@@ -16,5 +16,4 @@ document
     trigger.addEventListener('click', () => {
       content.classList.toggle('hidden');
     });
-    content.classList.add('hidden');
   });
diff --git a/template/fees.html.j2 b/template/fees.html.j2
index 5a7ac2d..f6c92ba 100644
--- a/template/fees.html.j2
+++ b/template/fees.html.j2
@@ -13,7 +13,7 @@
 <link href="{{ url_static('scss/pages/fees.scss') }}" rel="stylesheet" />
 {% endblock %} {% block body_content %}
 <main id="maincontent" class="fess-page standard-layout-render">
-  <section class="toggleable max-w-screen-lg w-screen">
+  <section class="toggleable max-w-screen-xl w-[90vw]">
     <h2 class="toggle-trigger" tabindex="0">
       {% trans %}Wire transfer fee{% endtrans %}
     </h2>
@@ -31,7 +31,7 @@
       </p>
     </div>
   </section>
-  <section class="toggleable max-w-screen-lg w-screen">
+  <section class="toggleable max-w-screen-xl w-[90vw]">
     <h2 class="toggle-trigger" tabindex="0">
       {% trans %}Deposit fees{% endtrans %}
     </h2>
@@ -44,53 +44,68 @@
         resulting in a total of 3.24&nbsp;CHF with 0.01&nbsp;CHF returned as
         change. {% endtrans %}
       </p>
-      <p>
-        {% trans %}
-        <b>Deposit fees</b> charged by Taler payment providers depend on the
-        electronic coins used in the transaction. Merchants can offer to pay
-        deposit fees up to a specified limit; customers have to pay deposit 
fees
-        that exceed what the merchant is willing to cover. Taler wallets inform
-        customers about applicable deposit fees they have to pay before every
-        transaction. {% endtrans %}
-      </p>
-      <p>
-        {% trans %} The following table shows the deposit fee structure used by
-        Taler Operations: {% endtrans %}
-      </p>
-      <table>
-        <tr>
-          <th>{% trans %}Coin denomination{% endtrans %}</th>
-          <th>{% trans %}Fee per Coin{% endtrans %}</th>
-        </tr>
-        <tr>
-          <td>0.0025&nbsp;CHF - 0.64&nbsp;CHF</td>
-          <td>0.0025&nbsp;CHF</td>
-        </tr>
-        <tr>
-          <td>1.28&nbsp;CHF - 10.24&nbsp;CHF</td>
-          <td>0.0050&nbsp;CHF</td>
-        </tr>
-        <tr>
-          <td>20.48&nbsp;CHF - 655.36&nbsp;CHF</td>
-          <td>0.0010&nbsp;CHF</td>
-        </tr>
-      </table>
-      <p>
-        {% trans %} Merchants can set the merchant backend if they want to 
cover
-        customary fees. The backend will then over-approximate typical deposit
-        and wire fees, ensuring that customers virtually never have to pay
-        deposit fees. The following curve shows the customary fees for 
different
-        net transaction amounts. {% endtrans %}
-      </p>
-      <img
-        alt="Customary fees for different net amounts"
-        style="width: 400px"
-        src="{{ url_static('images/stefan.svg') }}"
-      />
+      <div
+        class="flex flex-col md:flex-row justify-center gap-12 mt-8 mb-16 
md:mb-8"
+      >
+        <p class="flex-1">
+          {% trans %}
+          <b>Deposit fees</b> charged by Taler payment providers depend on the
+          electronic coins used in the transaction. Merchants can offer to pay
+          deposit fees up to a specified limit; customers have to pay deposit
+          fees that exceed what the merchant is willing to cover. Taler wallets
+          inform customers about applicable deposit fees they have to pay 
before
+          every transaction. {% endtrans %}
+        </p>
+        <div class="table-col flex-1 relative md:mt-0 -mt-12">
+          <table class="w-full">
+            <tr>
+              <th>{% trans %}Coin denomination{% endtrans %}</th>
+              <th>{% trans %}Fee per Coin{% endtrans %}</th>
+            </tr>
+            <tr>
+              <td>0.0025&nbsp;CHF - 0.64&nbsp;CHF</td>
+              <td>0.0025&nbsp;CHF</td>
+            </tr>
+            <tr>
+              <td>1.28&nbsp;CHF - 10.24&nbsp;CHF</td>
+              <td>0.0050&nbsp;CHF</td>
+            </tr>
+            <tr>
+              <td>20.48&nbsp;CHF - 655.36&nbsp;CHF</td>
+              <td>0.0010&nbsp;CHF</td>
+            </tr>
+          </table>
+          <p class="opacity-50 text-sm text-center">
+            {% trans %} The above table shows the deposit fee structure used by
+            Taler Operations {% endtrans %}
+          </p>
+        </div>
+      </div>
+      <div class="flex flex-col md:flex-row justify-center gap-12">
+        <p class="flex-1">
+          {% trans %} Merchants can set the merchant backend if they want to
+          cover customary fees. The backend will then over-approximate typical
+          deposit and wire fees, ensuring that customers virtually never have 
to
+          pay deposit fees. The following curve shows the customary fees for
+          different net transaction amounts. {% endtrans %}
+        </p>
+        <a
+          href="{{ url_static('images/stefan.svg') }}"
+          target="_blank"
+          rel="noopener noreferrer"
+          class="flex-1 relative md:mt-0 -mt-12"
+        >
+          <img
+            alt="Customary fees for different net amounts"
+            style="width: 100%"
+            src="{{ url_static('images/stefan.svg') }}"
+          />
+        </a>
+      </div>
     </div>
   </section>
 
-  <section class="toggleable max-w-screen-lg w-screen">
+  <section class="toggleable max-w-screen-xl w-[90vw]">
     <h2 class="toggle-trigger" tabindex="0">
       {% trans %}Bounce fee{% endtrans %}
     </h2>
@@ -112,7 +127,7 @@
     </div>
   </section>
 
-  <div class="toggleable max-w-screen-lg w-screen">
+  <div class="toggleable max-w-screen-xl w-[90vw]">
     <h2 class="toggle-trigger" tabindex="0">
       {% trans %}Possible loss of e-money due to expiration{% endtrans %}
     </h2>

-- 
To stop receiving notification emails like this one, please contact
gnunet@gnunet.org.