changes to interviewRounds header component

src/pages/interviewRounds/Header.module.scss

@@ -1,8 +1,8 @@
-.header {
+ion-header {
     background-color: black;
     height: 12vh;
    
-    div {
+    .header {
 
         display: flex;
         justify-content: space-between;
@@ -11,8 +11,8 @@
         margin-left: 2rem;
         margin-right: 1rem;
         ion-icon {
-            width: 12rem;
-            height: 10rem;
+            width: 33vw;
+            height: 5vh;
         }
     
         .profile {

src/pages/interviewRounds/Header.tsx

@@ -1,16 +1,16 @@
-import { IonIcon } from '@ionic/react';
+import { IonHeader, IonIcon } from '@ionic/react';
 import logo from '../../assets/icons/Logo.svg';
 import styles from './Header.module.scss';
 
 
 const Header: React.FC = () => {
     return (
-        <div className={styles.header}>
-            <div>
+        <IonHeader>
+            <div className={styles.header}>
                 <IonIcon src={logo}></IonIcon>
                 <div className={styles.profile}></div>
             </div>
-        </div>
+        </IonHeader>
     )
 }
 

src/pages/interviewRounds/InterviewRounds.tsx

@@ -2,13 +2,14 @@ import styles from './InterviewRounds.module.scss';
 
 import Button from "../../components/button/Button";
 import Header from "./Header";
+import { IonHeader, IonPage } from '@ionic/react';
 
 const InterviewRounds: React.FC = () => {
     return (
-        <div>
+        <IonPage>
             <Header />
+        </IonPage>
 
-        </div>
     )
 }