mobile friendly

1 files changed, 7 insertions, 12 deletions

diff --git a/packages/demobank-ui/src/pages/QrCodeSection.tsx b/packages/demobank-ui/src/pages/QrCodeSection.tsx
index 0229dd425..c27984569 100644
--- a/packages/demobank-ui/src/pages/QrCodeSection.tsx
+++ b/packages/demobank-ui/src/pages/QrCodeSection.tsx
@@ -51,19 +51,14 @@ export function QrCodeSection({
   const { abortWithdrawal } = useAccessAnonAPI();
   return (
     <section id="main" class="content">
-      <h1 class="nav">{i18n.str`Transfer to Taler Wallet`}</h1>
+      <h1 class="nav">{i18n.str`Charge your GNU Taler wallet`}</h1>
       <article>
-        <div class="qr-div">
-          <p>{i18n.str`Use this QR code to withdraw to your mobile wallet:`}</p>
+        <div class="qr-div ">
+          <a href={talerWithdrawUri} class="pure-button pure-button-primary">
+            <i18n.Translate>Continue with GNU Taler</i18n.Translate>
+          </a>
+          <p>{i18n.str`Or scan this QR code with your mobile to receive the coin in another device:`}</p>
           <QR text={talerWithdrawUri} />
-          <p>
-            <i18n.Translate>
-              Click{" "}
-              <a href={talerWithdrawUri}>{i18n.str`this taler:// link`}</a> to
-              open your Taler wallet
-            </i18n.Translate>{" "}
-          </p>
-          <br />
           <a
             class="pure-button btn-cancel"
             onClick={async (e) => {
@@ -92,7 +87,7 @@ export function QrCodeSection({
                 }
               }
             }}
-          >{i18n.str`Abort`}</a>
+          >{i18n.str`Cancel`}</a>
         </div>
       </article>
     </section>