From b12fee30b8fef0389e6bc71dd0d449c1e6c7206c Mon Sep 17 00:00:00 2001
From: Subhamoy Biswas <subhamoybiswas636@gmail.com>
Date: Fri, 29 Mar 2024 14:40:34 +0530
Subject: [PATCH] (refactor): switched to toggle to copy contact number mode

---
 htdocs/assets/style.css | 28 ++++------------------------
 htdocs/contact.php      |  4 ++--
 2 files changed, 6 insertions(+), 26 deletions(-)

diff --git a/htdocs/assets/style.css b/htdocs/assets/style.css
index 7ff8b6d..0086fc8 100644
--- a/htdocs/assets/style.css
+++ b/htdocs/assets/style.css
@@ -1455,6 +1455,10 @@ video {
   background-color: rgba(56, 189, 248, 0.15);
 }
 
+.bg-accent_primary_transparent {
+  background-color: rgba(56, 189, 248, 0.30);
+}
+
 .bg-bg_primary {
   --tw-bg-opacity: 1;
   background-color: rgb(15 23 42 / var(--tw-bg-opacity));
@@ -1465,10 +1469,6 @@ video {
   background-color: rgb(30 41 59 / var(--tw-bg-opacity));
 }
 
-.bg-accent_primary_transparent {
-  background-color: rgba(56, 189, 248, 0.30);
-}
-
 .bg-gradient-to-r {
   background-image: linear-gradient(to right, var(--tw-gradient-stops));
 }
@@ -1607,16 +1607,6 @@ video {
   padding-bottom: 0.30rem;
 }
 
-.px-10 {
-  padding-left: 2.5rem;
-  padding-right: 2.5rem;
-}
-
-.py-\[0\.20rem\] {
-  padding-top: 0.20rem;
-  padding-bottom: 0.20rem;
-}
-
 .pb-1 {
   padding-bottom: 0.25rem;
 }
@@ -2343,16 +2333,6 @@ video {
     line-height: 1.75rem;
   }
 
-  .lg\:blur-2xl {
-    --tw-blur: blur(40px);
-    filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
-  }
-
-  .lg\:blur-xl {
-    --tw-blur: blur(24px);
-    filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
-  }
-
   .lg\:blur-lg {
     --tw-blur: blur(16px);
     filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
diff --git a/htdocs/contact.php b/htdocs/contact.php
index 5ff6aef..df9acd5 100644
--- a/htdocs/contact.php
+++ b/htdocs/contact.php
@@ -47,8 +47,8 @@ write_dataset($conn);
                     <div class="contactinfocont mt-14">
                         <div class="flex items-center my-4">
                             <span class="w-[40px] h-[40px] bg-accent_primary text-bg_primary flex justify-center items-center rounded-full mr-5" title="Contact via Phone Call"><i class="fa-solid fa-phone"></i></span>
-                            <p class="text-lg font-light">+91 80XXX 26XXX</p>
-                            <button class="bg-accent_primary_transparent text-accent_primary py-[0.15rem] px-2 ml-3 text-xs rounded" onclick="copy_to_clipboard('+91 8016626636', 'Number')">copy</button>
+                            <p class="text-lg font-light" id="phoneNumberCont" onclick="if(document.getElementById('togglePhoneNumber').innerHTML==='hide') { copy_to_clipboard('+91 8016626636', 'Number') }">+91 80XXX 26XXX</p>
+                            <button class="bg-accent_primary_transparent text-accent_primary py-[0.15rem] px-2 ml-3 text-xs rounded" onclick="if(document.getElementById('togglePhoneNumber').innerHTML==='show'){ document.getElementById('togglePhoneNumber').innerHTML='hide'; document.getElementById('phoneNumberCont').innerHTML='+91 80166 26636'; document.getElementById('phoneNumberCont').classList.add('cursor-pointer') } else { document.getElementById('togglePhoneNumber').innerHTML='show'; document.getElementById('phoneNumberCont').innerHTML='+91 80XXX 26XXX'; document.getElementById('phoneNumberCont').classList.remove('cursor-pointer') }" id="togglePhoneNumber">show</button>
                         </div>
                         <div class="flex items-center my-4">
                             <span class="w-[40px] h-[40px] bg-accent_primary text-bg_primary flex justify-center items-center rounded-full mr-5" title="Contact via Email"><i class="fa-solid fa-envelope"></i></span>