feat: redirect on logo click #178 (#199)

* feat: redirect on logo click #178 * fix: link --------- Co-authored-by: Marcel Ebert <[email protected]>
pendulum-chain · Jun 27, 2023 · 9d42e97 · 9d42e97
1 parent 21dad82
commit 9d42e97
Show file tree

Hide file tree

Showing 2 changed files with 16 additions and 11 deletions.
diff --git a/src/components/Layout/index.tsx b/src/components/Layout/index.tsx
@@ -1,6 +1,6 @@
 import { Bars3Icon } from '@heroicons/react/20/solid';
 import { memo, useEffect, useMemo, useState } from 'preact/compat';
-import { Outlet, useParams } from 'react-router-dom';
+import { Link, Outlet, useParams } from 'react-router-dom';
 import { useGlobalState } from '../../GlobalStateProvider';
 import AmplitudeLogo from '../../assets/amplitud-logo.svg';
 import PendulumLogo from '../../assets/pendulum-logo.png';
@@ -63,13 +63,20 @@ export default function Layout(): JSX.Element | null {
             visible ? 'open left-0' : 'closed -left-full'
           }`}
         >
-          <img
-            className="pendulum-logo"
-            src={sideBarLogo}
-            alt=""
-            style={isPendulum ? {} : { marginTop: 20, marginBottom: 30, marginLeft: 30 }}
-          />
-          {isTestnet && <div className="foucoco-tag">Foucoco testnet</div>}
+          <div
+            style={
+              isPendulum ? { marginLeft: 20, marginBottom: 20 } : { marginTop: 20, marginBottom: 30, marginLeft: 30 }
+            }
+          >
+            <a
+              href={`https://pendulumchain.org/${isPendulum ? '' : 'amplitude'}`}
+              target="_blank"
+              rel="noopener noreferrer"
+            >
+              <img className="logo" src={sideBarLogo} alt="" />
+              {isTestnet && <div className="foucoco-tag">Foucoco testnet</div>}
+            </a>
+          </div>
           <Nav onClick={() => setVisible(false)} />
           <div className="sidebar-footer">
             <Versions tenantName={state.tenantName} />

diff --git a/src/components/Layout/styles.sass b/src/components/Layout/styles.sass
@@ -31,10 +31,8 @@ $menu: 32px
   @media screen and (max-width: $medium)
     box-shadow: 5px 0 8px rgba(0, 0, 0, .1)
 
-.pendulum-logo
+#sidebar-wrapper .logo
   width: 160px
-  margin-left: 20px
-  margin-bottom: 20px
 
 .foucoco-tag
   font-family: 'Nunito Sans'