From 74d4ba4e3400acc0f7a50e633cd7d3d14208178d Mon Sep 17 00:00:00 2001
From: Adam Soltys <asoltys@gmail.com>
Date: Fri, 22 Dec 2023 16:39:51 -0800
Subject: button styles

---
 src/components/Qr.svelte                     |  2 +-
 src/routes/(app)/qr/[text]/+page.svelte      |  4 ++--
 src/routes/(app)/send/[...text]/+page.svelte | 26 ++++++++++++--------------
 3 files changed, 15 insertions(+), 17 deletions(-)

diff --git a/src/components/Qr.svelte b/src/components/Qr.svelte
index 8a716b14..e98497c4 100644
--- a/src/components/Qr.svelte
+++ b/src/components/Qr.svelte
@@ -5,7 +5,7 @@
 </script>
 
 <div
-  class="w-80 mx-auto my-5 cursor-pointer"
+  class="w-80 mx-auto cursor-pointer"
   bind:this={qr}
   on:click={() => screenfull.toggle(qr)}
   on:keydown={() => screenfull.toggle(qr)}
diff --git a/src/routes/(app)/qr/[text]/+page.svelte b/src/routes/(app)/qr/[text]/+page.svelte
index 2678d91a..da164b50 100644
--- a/src/routes/(app)/qr/[text]/+page.svelte
+++ b/src/routes/(app)/qr/[text]/+page.svelte
@@ -10,14 +10,14 @@
   <Icon icon="arrow-left" style="w-10" />
 </button>
 
-<div class="container px-4 max-w-4xl mx-auto mt-10 space-y-5">
+<div class="container px-4 max-w-4xl mx-auto space-y-5">
   <div class="flex justify-center items-center">
     <div
       class="md:shadow-xl rounded-3xl md:px-10 pt-5 pb-10 space-y-5 w-full md:mx-5"
     >
       <Qr {src} />
 
-      <div class="text-center w-full text-2xl py-10 break-all">
+      <div class="text-center w-full text-lg break-all">
         {text}
       </div>
     </div>
diff --git a/src/routes/(app)/send/[...text]/+page.svelte b/src/routes/(app)/send/[...text]/+page.svelte
index 8548964c..effaea60 100644
--- a/src/routes/(app)/send/[...text]/+page.svelte
+++ b/src/routes/(app)/send/[...text]/+page.svelte
@@ -58,23 +58,21 @@
       />
     </div>
 
-    <div class="flex justify-end">
-      {#if text?.length}
-        <a href={`/qr/${encodeURIComponent(text)}`}>
-          <button
-            type="button"
-            class="flex border rounded-full px-6 py-2 font-bold hover:opacity-80 mr-1"
-          >
-            <Icon icon="qr" style="mr-2 w-6 my-auto invert" />
-            <div class="my-auto">{$t("user.send.makeQR")}</div>
-          </button>
-        </a>
-      {/if}
+    <div class="grid grid-cols-2 md:grid-cols-4 gap-2">
+      <a href={`/qr/${encodeURIComponent(text)}`} class:invisible={!text?.length}>
+        <button
+          type="button"
+          class="flex border rounded-full px-6 py-2 font-bold hover:opacity-80 mr-1 w-full"
+        >
+          <Icon icon="qr" style="mr-2 w-6 my-auto invert" />
+          <div class="my-auto">{$t("user.send.makeQR")}</div>
+        </button>
+      </a>
 
-      <a href="/scan">
+      <a href="/scan" class="w-full">
         <button
           type="button"
-          class="flex border rounded-full px-6 py-2 font-bold hover:opacity-80 mr-1"
+          class="flex border rounded-full px-6 py-2 font-bold hover:opacity-80 mr-1 w-full"
         >
           <Icon icon="camera" style="mr-2 w-6 my-auto" />
           <div class="my-auto">{$t("user.send.scan")}</div>
-- 
cgit v1.2.3