From b38648b32b4010efc0bd0e6933378c695738d052 Mon Sep 17 00:00:00 2001
From: void-57 <ruddhaani60@gmail.com>
Date: Tue, 14 Oct 2025 02:23:51 +0530
Subject: [PATCH] Add transaction hash links with styling for better user
 navigation

---
 index.html | 12 ++++++++++--
 style.css  | 26 ++++++++++++++++++++++++++
 2 files changed, 36 insertions(+), 2 deletions(-)

diff --git a/index.html b/index.html
index 5679d7f..71416d0 100644
--- a/index.html
+++ b/index.html
@@ -1586,7 +1586,11 @@
                   </div>
                   <div class="tx-detail-row">
                     <span class="tx-label">Tx:</span>
-                    <span class="tx-value full-address tx-hash">${hash}</span>
+                    <span class="tx-value full-address tx-hash">
+                      <a href="https://tonviewer.com/transaction/${hash}" target="_blank" class="tx-hash-link" title="View on TON Viewer">
+                        ${hash}
+                      </a>
+                    </span>
                   </div>
                 </div>
               </div>
@@ -1641,7 +1645,11 @@
                     </div>
                     <div class="tx-detail-row">
                       <span class="tx-label">Tx:</span>
-                      <span class="tx-value full-address tx-hash">${hash}</span>
+                      <span class="tx-value full-address tx-hash">
+                        <a href="https://tonviewer.com/transaction/${hash}" target="_blank" class="tx-hash-link" title="View on TON Viewer">
+                          ${hash}
+                        </a>
+                      </span>
                     </div>
                   </div>
                 </div>
diff --git a/style.css b/style.css
index 0fe8e37..7ef9224 100644
--- a/style.css
+++ b/style.css
@@ -2379,3 +2379,29 @@ body {
     padding: 0.75rem;
   }
 }
+
+/* Transaction Hash Link Styling */
+.tx-hash-link {
+  color: var(--primary-color);
+  text-decoration: none;
+  transition: all 0.2s ease;
+  display: inline-flex;
+  align-items: center;
+  gap: 0.25rem;
+  font-family: "Courier New", monospace;
+  word-break: break-all;
+}
+
+.tx-hash-link:hover {
+  color: var(--primary-color-dark);
+  text-decoration: underline;
+  transform: translateY(-1px);
+}
+
+.tx-hash-link:active {
+  transform: translateY(0);
+}
+
+.tx-hash-link:hover::after {
+  opacity: 1;
+}