Merge pull request #18 from polkadot-cloud/rb-update-header-icon

feat: Update header

src/library/Header/Wrapper.ts

@@ -23,10 +23,15 @@ export const HeaderWrapper = styled.div`
 
     &:first-child {
       > h1 {
-        font-family: InterBold, sans-serif;
-        font-size: 0.72rem;
-        text-transform: uppercase;
-        color: var(--accent-color-primary);
+        display: flex;
+        align-items: center;
+
+        > a {
+          font-family: InterBold, sans-serif;
+          font-size: 0.72rem;
+          text-transform: uppercase;
+          color: #881cbc;
+        }
       }
 
       > span {
@@ -36,14 +41,6 @@ export const HeaderWrapper = styled.div`
           height: 100%;
         }
       }
-      > .version {
-        color: var(--text-color-primary);
-        font-family: InterSemiBold, sans-serif;
-        margin-left: 0.35rem;
-        margin-right: 0.5rem;
-        font-size: 0.7rem;
-        opacity: 0.75;
-      }
     }
 
     &:last-child {

src/library/Header/index.tsx

@@ -4,23 +4,19 @@
 import { faGithub } from '@fortawesome/free-brands-svg-icons';
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import { GithubRepoUrl } from 'consts';
-import IconSvg from 'svg/Cloud.svg?react';
+import IconSvg from 'svg/Icon.svg?react';
 import { HeaderWrapper } from './Wrapper';
-import { version } from '../../../package.json';
 import { Link } from 'react-router-dom';
 
 export const Header = () => (
   <HeaderWrapper>
     <div>
-      <span
-        style={{ width: '1.1rem', height: '1.1rem', marginRight: '0.4rem' }}
-      >
+      <span style={{ width: '1rem', height: '1rem', marginRight: '0.5rem' }}>
         <IconSvg />
       </span>
       <h1>
         <Link to="/">Polkadot Cloud Portal</Link>
       </h1>
-      <span className="version">{version}</span>
     </div>
     <div>
       <button type="button" onClick={() => window.open(GithubRepoUrl)}>