From 71d2d1128c66d36f29f70e22ea28312b5a0cf946 Mon Sep 17 00:00:00 2001
From: Adam Soltys <adam@coinos.io>
Date: Tue, 3 Feb 2026 10:54:01 -0800
Subject: fix opacity classes

---
 src/components/Account.svelte      | 28 ++++++++++++++--------------
 src/components/AmountField.svelte  |  2 +-
 src/components/LandingHero.svelte  |  2 +-
 src/components/LocationsMap.svelte |  8 ++++----
 src/components/Nostr.svelte        |  2 +-
 src/components/Password.svelte     |  2 +-
 src/components/Payments.svelte     |  3 +--
 src/components/Pin.svelte          |  2 +-
 src/components/SetAmount.svelte    |  2 +-
 src/components/SetMemo.svelte      |  2 +-
 src/components/SetType.svelte      |  2 +-
 src/components/WalletPass.svelte   |  2 +-
 12 files changed, 28 insertions(+), 29 deletions(-)

(limited to 'src/components')

diff --git a/src/components/Account.svelte b/src/components/Account.svelte
index d37101ee..b8ba94d8 100644
--- a/src/components/Account.svelte
+++ b/src/components/Account.svelte
@@ -100,20 +100,20 @@
       </button>
     </a>
 
-    <a
-      href={"/payments"}
-      class="contents"
-      onclick={(e) => setAccount(e, "/payments")}
-    >
-      <button class="btn !w-auto flex-grow">
-        <iconify-icon
-          noobserver
-          icon="ph:clock-bold"
-          width="32"
-          flip="horizontal"
-        ></iconify-icon>
-      </button>
-    </a>
+    <!-- <a -->
+    <!--   href={"/payments"} -->
+    <!--   class="contents" -->
+    <!--   onclick={(e) => setAccount(e, "/payments")} -->
+    <!-- > -->
+    <!--   <button class="btn !w-auto flex-grow"> -->
+    <!--     <iconify-icon -->
+    <!--       noobserver -->
+    <!--       icon="ph:clock-bold" -->
+    <!--       width="32" -->
+    <!--       flip="horizontal" -->
+    <!--     ></iconify-icon> -->
+    <!--   </button> -->
+    <!-- </a> -->
 
     <a
       href={`/send`}
diff --git a/src/components/AmountField.svelte b/src/components/AmountField.svelte
index cbe55e49..851518e0 100644
--- a/src/components/AmountField.svelte
+++ b/src/components/AmountField.svelte
@@ -50,7 +50,7 @@
 
 {#if setting}
   <div
-    class="fixed bg-base-100 bg-opacity-90 inset-0 overflow-y-auto h-full w-full z-50 max-w-lg mx-auto"
+    class="fixed bg-base-100/90 inset-0 overflow-y-auto h-full w-full z-50 max-w-lg mx-auto"
   >
     <div class="relative p-5 border shadow-lg rounded-md bg-base-100 space-y-5">
       <h1 class="text-center text-2xl font-semibold">
diff --git a/src/components/LandingHero.svelte b/src/components/LandingHero.svelte
index 3f24724c..812452cd 100644
--- a/src/components/LandingHero.svelte
+++ b/src/components/LandingHero.svelte
@@ -31,7 +31,7 @@
       <a href="/register">
         <button
           use:focus
-          class="btn !rounded-full bg-primary text-primary-content hover:bg-primary hover:bg-opacity-80"
+          class="btn !rounded-full bg-primary text-primary-content hover:bg-primary/80"
         >
           {$t("nav.startInSeconds")}
         </button>
diff --git a/src/components/LocationsMap.svelte b/src/components/LocationsMap.svelte
index 103e2477..b676d276 100644
--- a/src/components/LocationsMap.svelte
+++ b/src/components/LocationsMap.svelte
@@ -264,7 +264,7 @@
   <div class="absolute flex top-2 left-2 gap-2">
     <button
        aria-label="Back"
-      class="rounded-full border-2 border-black bg-base-100 w-16 h-16 flex items-center justify-center bg-opacity-80"
+      class="rounded-full border-2 border-black bg-base-100/80 w-16 h-16 flex items-center justify-center"
       onclick={back}
     >
       <iconify-icon noobserver icon="ph:arrow-left-bold" width="24"></iconify-icon>
@@ -273,7 +273,7 @@
   <div class="relative">
     {#if !showList}
       <div
-        class="space-y-1 text-sm w-[300px] max-w-[calc(100vw*0.5)] h-[300px] max-h-[calc(100vh*0.4)] overflow-y-scroll p-4 bg-opacity-90 bg-base-100 absolute right-4 bottom-8 rounded-2xl shadow text-ellipsis overflow-x-hidden"
+        class="space-y-1 text-sm w-[300px] max-w-[calc(100vw*0.5)] h-[300px] max-h-[calc(100vh*0.4)] overflow-y-scroll p-4 bg-base-100/90 absolute right-4 bottom-8 rounded-2xl shadow text-ellipsis overflow-x-hidden"
       >
         <div class="relative mb-4 sticky top-0 bg-base-100 z-10">
           <input bind:value={search} class="w-full" />
@@ -302,13 +302,13 @@
     {/if}
     <div class="absolute flex top-2 right-2 gap-2">
       <button
-        class="rounded-full border-2 border-primary bg-base-100 w-16 h-16 flex items-center justify-center bg-opacity-80"
+        class="rounded-full border-2 border-primary bg-base-100/80 w-16 h-16 flex items-center justify-center"
         onclick={toggleList}
       >
         <iconify-icon noobserver icon="ph:list-bold" width="24"></iconify-icon>
       </button>
       <button
-        class="rounded-full border-2 border-primary bg-base-100 w-16 h-16 flex items-center justify-center bg-opacity-80"
+        class="rounded-full border-2 border-primary bg-base-100/80 w-16 h-16 flex items-center justify-center"
         onclick={toggle}
       >
         {#if timeout}
diff --git a/src/components/Nostr.svelte b/src/components/Nostr.svelte
index b41cb8ff..fc85100c 100644
--- a/src/components/Nostr.svelte
+++ b/src/components/Nostr.svelte
@@ -123,7 +123,7 @@
 
 {#if $eventToSign && !$signer?.ready}
   <div
-    class="fixed inset-0 bg-base-100 bg-opacity-90 overflow-y-auto h-full w-full z-50"
+    class="fixed inset-0 bg-base-100/90 overflow-y-auto h-full w-full z-50"
   >
     <div
       class="relative mx-auto mt-10 p-5 border w-96 shadow-lg rounded-md bg-base-100 space-y-5"
diff --git a/src/components/Password.svelte b/src/components/Password.svelte
index cc350ecd..cc91d554 100644
--- a/src/components/Password.svelte
+++ b/src/components/Password.svelte
@@ -24,7 +24,7 @@
 </script>
 
 <div
-  class="fixed inset-0 bg-base-100 bg-opacity-90 overflow-y-auto h-full w-full z-50"
+  class="fixed inset-0 bg-base-100/90 overflow-y-auto h-full w-full z-50"
 >
   <div
     class="relative top-1/3 mx-auto p-5 border w-96 shadow-lg rounded-md bg-base-100 space-y-5"
diff --git a/src/components/Payments.svelte b/src/components/Payments.svelte
index daedb036..0f07cc2b 100644
--- a/src/components/Payments.svelte
+++ b/src/components/Payments.svelte
@@ -102,8 +102,7 @@
                 />
               </div>
             {:else if p.type === types.ark}
-              <iconify-icon noobserver icon="ph:vault-bold" width="32"
-              ></iconify-icon>
+              <img src="/images/ark.png" class="w-10 h-10 rounded-full object-cover" alt="Ark" />
             {/if}
 
             <div class="my-auto">
diff --git a/src/components/Pin.svelte b/src/components/Pin.svelte
index 980e17fa..06faeeb7 100644
--- a/src/components/Pin.svelte
+++ b/src/components/Pin.svelte
@@ -49,7 +49,7 @@
 {#if loaded}
   <div
     role="dialog"
-    class="fixed bg-base-100 bg-opacity-90 inset-0 h-full w-full z-50 cursor-default"
+    class="fixed bg-base-100/90 inset-0 h-full w-full z-50 cursor-default"
     on:click|preventDefault
     aria-labelledby="title"
   >
diff --git a/src/components/SetAmount.svelte b/src/components/SetAmount.svelte
index 536c8e24..c3adf9c4 100644
--- a/src/components/SetAmount.svelte
+++ b/src/components/SetAmount.svelte
@@ -20,7 +20,7 @@
 
 {#if settingAmount}
   <div
-    class="fixed inset-0 bg-base-100 bg-opacity-90 overflow-y-auto h-full w-full z-50"
+    class="fixed inset-0 bg-base-100/90 overflow-y-auto h-full w-full z-50"
   >
     <div
       class="relative mx-auto p-12 max-w-xl shadow-lg rounded-md bg-base-100 space-y-5"
diff --git a/src/components/SetMemo.svelte b/src/components/SetMemo.svelte
index f11bf780..99828d05 100644
--- a/src/components/SetMemo.svelte
+++ b/src/components/SetMemo.svelte
@@ -13,7 +13,7 @@
 
 {#if settingMemo}
   <div
-    class="fixed inset-0 bg-base-100 bg-opacity-90 overflow-y-auto h-full w-full z-50"
+    class="fixed inset-0 bg-base-100/90 overflow-y-auto h-full w-full z-50"
   >
     <div
       class="relative mx-auto p-12 max-w-xl shadow-lg rounded-md bg-base-100 space-y-5"
diff --git a/src/components/SetType.svelte b/src/components/SetType.svelte
index ecbfcba4..f195d2ee 100644
--- a/src/components/SetType.svelte
+++ b/src/components/SetType.svelte
@@ -19,7 +19,7 @@
 
 {#if settingType}
   <div
-    class="fixed inset-0 bg-base-100 bg-opacity-90 overflow-y-auto h-full w-full z-50"
+    class="fixed inset-0 bg-base-100/90 overflow-y-auto h-full w-full z-50"
   >
     <div
       class="relative mx-auto p-12 max-w-xl shadow-lg rounded-md bg-base-100 space-y-2"
diff --git a/src/components/WalletPass.svelte b/src/components/WalletPass.svelte
index 57cf69c3..9c4c35bb 100644
--- a/src/components/WalletPass.svelte
+++ b/src/components/WalletPass.svelte
@@ -9,7 +9,7 @@
 </script>
 
 <div
-  class="fixed inset-0 bg-gray-600 bg-opacity-50 overflow-y-auto h-full w-full z-20"
+  class="fixed inset-0 bg-gray-600/50 overflow-y-auto h-full w-full z-20"
 >
   <div
     class="relative top-1/3 mx-auto p-5 border w-96 shadow-lg rounded-md bg-white space-y-5"
-- 
cgit v1.2.3