Option to hide the register and view panel

Author: User-DK

Frontend/src/components/about/About.jsx

@@ -1,6 +1,6 @@
-import React from 'react'
-import './about.css'
-import ABTIMAGE from '../../assets/about_img.jpg'
+import React from "react";
+import "./about.css";
+import ABTIMAGE from "../../assets/about_img.jpg";
 
 const About = () => {
   return (
@@ -32,6 +32,6 @@ const About = () => {
       </div>
     </div>
   );
-}
+};
 
-export default About
+export default About;

Frontend/src/components/admin/Admin.jsx

@@ -1,59 +1,88 @@
-import React from "react";
+import React, { useState } from "react";
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
-import { faArrowUpRightFromSquare } from "@fortawesome/free-solid-svg-icons";
+import {
+  faArrowUpRightFromSquare,
+  faChevronDown,
+  faChevronUp,
+} from "@fortawesome/free-solid-svg-icons";
 
 function Toplink() {
+  const [isVisible, setIsVisible] = useState(true);
+
   return (
-    <div
-      style={{
-        position: "fixed",
-        bottom: "30px",
-        left: "50%",
-        transform: "translateX(-50%)",
-        zIndex: "1000",
-        backgroundColor: "white",
-        padding: "10px",
-        borderRadius: "10px",
-        boxShadow: "0 0 10px rgba(0, 0, 0, 0.5)",
-        border: "3px solid #000000", // Initial border
-        animation: "borderAnimation 2s infinite", // Apply animation
-      }}
-    >
-      <div>
-        <a
-          href="https://konfhub.com/yuvarang-2025"
-          target="_blank"
-          rel="noopener noreferrer"
-          style={{
-            color: "black",
-            fontWeight: "bold",
-          }}
-          onMouseEnter={(e) => (e.target.style.color = "blue")}
-          onMouseLeave={(e) => (e.target.style.color = "black")}
-        >
-          ✨ Register Now for Yuvarang 2025 ✨
-          <FontAwesomeIcon icon={faArrowUpRightFromSquare} />
-        </a>
-      </div>
-      <div
+    <div>
+      <button
+        onClick={() => setIsVisible(!isVisible)}
         style={{
-          alignItems: "center",
-          justifyContent: "center",
-          display: "flex",
-          flexDirection: "column",
+          position: "fixed",
+          bottom: "10px",
+          left: "50%",
+          transform: "translateX(-50%)",
+          zIndex: "1001",
+          background: "none",
+          border: "none",
+          cursor: "pointer",
         }}
       >
-        <button className="rainbow-text2">
-          <a
-            href="https://drive.google.com/file/d/1QWBCFOCWWI7yo0hUFoSM9n9c0WvorNDj/view?usp=sharing"
-            target="_blank"
-            rel="noreferrer"
+        <FontAwesomeIcon
+          icon={isVisible ? faChevronDown : faChevronUp}
+          size="2x"
+          color="white"
+        />
+      </button>
+
+      {isVisible && (
+        <div
+          style={{
+            position: "fixed",
+            bottom: "50px",
+            left: "50%",
+            transform: "translateX(-50%)",
+            zIndex: "1000",
+            backgroundColor: "white",
+            padding: "10px",
+            borderRadius: "10px",
+            boxShadow: "0 0 10px rgba(0, 0, 0, 0.5)",
+            border: "3px solid #000000",
+            animation: "borderAnimation 2s infinite",
+          }}
+        >
+          <div>
+            <a
+              href="https://konfhub.com/yuvarang-2025"
+              target="_blank"
+              rel="noopener noreferrer"
+              style={{
+                color: "black",
+                fontWeight: "bold",
+              }}
+              onMouseEnter={(e) => (e.target.style.color = "blue")}
+              onMouseLeave={(e) => (e.target.style.color = "black")}
+            >
+              ✨ Register Now for Yuvarang 2025 ✨
+              <FontAwesomeIcon icon={faArrowUpRightFromSquare} />
+            </a>
+          </div>
+          <div
+            style={{
+              alignItems: "center",
+              justifyContent: "center",
+              display: "flex",
+              flexDirection: "column",
+            }}
           >
-            ✨View RuleBook✨{" "}
-            {/* <FontAwesomeIcon icon={faArrowUpRightFromSquare} /> */}
-          </a>
-        </button>
-      </div>
+            <button className="rainbow-text2">
+              <a
+                href="https://drive.google.com/file/d/1QWBCFOCWWI7yo0hUFoSM9n9c0WvorNDj/view?usp=sharing"
+                target="_blank"
+                rel="noreferrer"
+              >
+                ✨View RuleBook✨
+              </a>
+            </button>
+          </div>
+        </div>
+      )}
     </div>
   );
 }