added link to main photo

ibrucelei · Sep 25, 2024 · c0bfc23 · c0bfc23
1 parent 72cb22c
commit c0bfc23
Show file tree

Hide file tree

Showing 2 changed files with 46 additions and 26 deletions.
diff --git a/src/components/Home/Home.js b/src/components/Home/Home.js
@@ -1,46 +1,49 @@
-import React from "react";
+import React, { useMemo } from "react";
 import { Container, Row, Col } from "react-bootstrap";
 import homeLogo from "../../Assets/home-main.png";
 import Particle from "../Particle";
 import HomeContent from "./HomeContent";
 import Type from "./Type";
+import Image from "react-bootstrap/Image";
 
 function Home() {
+  const timestamp = useMemo(() => '?v=' + new Date().getTime(), []);
   return (
     <section>
-      <Container fluid className="home-section" id="home">
-        <Particle />
-        <Container className="home-content">
-          <Row>
-            <Col md={7} className="home-header">
-              <h1 style={{ paddingBottom: 15 }} className="heading">
-                Hi There!{" "}
-                <span className="wave" role="img" aria-labelledby="wave">
-                  👋🏻
-                </span>
-              </h1>
+      {/* <Container fluid className="home-section" id="home"> */}
+      <Particle />
+      <Container className="home-content">
+        <Row>
+          <Col md={7} className="home-header">
+            <h1 style={{ paddingBottom: 15 }} className="heading">
+              Hi There!{" "}
+              <span className="wave" role="img" aria-labelledby="wave">
+                👋🏻
+              </span>
+            </h1>
 
-              <h1 className="heading-name">
-                It's
-                <strong className="main-name"> KasWare Wallet</strong>
-              </h1>
+            <h1 className="heading-name">
+              It's
+              <strong className="main-name"> KasWare Wallet</strong>
+            </h1>
 
-              <div style={{ padding: 50, textAlign: "left" }}>
-                <Type />
-              </div>
-            </Col>
-
-            <Col md={5} style={{ paddingBottom: 20 }}>
-              <img
+            <div style={{ padding: 50, textAlign: "left" }}>
+              <Type />
+            </div>
+          </Col>
+          <Col md={5} style={{ paddingBottom: 20 }} className="main-icons">
+            <a href={"https://chromewebstore.google.com/detail/kasware-wallet/hklhheigdmpoolooomdihmhlpjjdbklf" + timestamp} style={{ color: "white" }} target="_blank" rel="noopener noreferrer">
+              <Image
                 src={homeLogo}
                 alt="home pic"
                 className="img-fluid"
                 style={{ maxHeight: "450px" }}
               />
-            </Col>
-          </Row>
-        </Container>
+            </a>
+          </Col>
+        </Row>
       </Container>
+      {/* </Container> */}
       <HomeContent />
     </section>
   );

diff --git a/src/style.css b/src/style.css
@@ -602,6 +602,23 @@ button:focus {
   line-height: 1.6 !important;
 }
 
+.main-icons {
+  font-size: 4.5em !important;
+  opacity: 0.93 !important;
+  vertical-align: middle !important;
+  text-align: center !important;
+  border-radius: 5px !important;
+  display: table !important;
+  box-shadow: 4px 5px 4px 3px rgba(89, 4, 168, 0.137) !important;
+  overflow: hidden !important;
+  transition: all 0.4s ease 0s !important;
+}
+
+.main-icon-images {
+  /* padding: 20px !important; */
+  line-height: 1.6 !important;
+}
+
 .quote-card-view {
   border: none !important;
   color: white !important;