Update templates/claim.html

templates/claim.html

@@ -4,12 +4,26 @@
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>Claim Link - AstraPay</title>
+    <link rel="preconnect" href="https://fonts.googleapis.com">
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+    <link href="https://fonts.googleapis.com/css2?family=Erica+One&display=swap" rel="stylesheet">
     <style>
         body {
             margin: 0;
             padding: 0;
             min-height: 100vh;
-            background: linear-gradient(135deg, #0a0a0a 0%, #1a1a1a 100%);
+            background: linear-gradient(180deg, 
+                #0f0514 0%,
+                #1a0a1a 15%,
+                #2d1a3d 35%,
+                #4a2a5a 50%,
+                #3d2a4a 60%,
+                #2d1a3d 70%,
+                #1a0a1a 80%,
+                #0f0514 85%,
+                #000000 100%
+            );
+            background-attachment: fixed;
             font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
             color: #ffffff;
             line-height: 1.6;
@@ -29,9 +43,10 @@
         }
         .title {
             font-size: 2.2rem;
-            font-weight: 600;
+            font-weight: normal;
+            font-family: 'Erica One', cursive;
             margin-bottom: 1.5rem;
-            letter-spacing: -0.02em;
+            letter-spacing: 0.02em;
         }
         .claim-card {
             background: rgba(255, 255, 255, 0.02);
@@ -148,6 +163,9 @@
             text-align: center;
         }
         .claim-modal-title {
+            font-family: 'Erica One', cursive;
+            font-weight: normal;
+            letter-spacing: 0.02em;
             color: #ffffff;
             font-size: 1.5rem;
             font-weight: bold;
@@ -203,6 +221,11 @@
 
         <div class="claim-card">
             <div class="amount">{{ claim_amount }} Astra{{ 's' if claim_amount > 1 else '' }}</div>
+            {% if fee > 0 %}
+                <div class="info-text" style="margin-bottom: 0.5rem; color: rgba(255, 255, 255, 0.6); font-size: 0.85rem;">
+                    Fee: {{ fee }} Astra{{ 's' if fee > 1 else '' }} ({{ fee_percent }}%)
+                </div>
+            {% endif %}
             {% if not claimed %}
                 <div class="info-text" style="margin-bottom: 1rem;">
                     Send {{ send_amount }} Astra{{ 's' if send_amount > 1 else '' }} to astrapay@astranova.org to verify