formatting
This commit is contained in:
@@ -1,28 +1,57 @@
|
||||
import React from "react";
|
||||
import { chevroneLeft, chevroneRight, arrowLeft } from "../../../assets/icons/header";
|
||||
import { Logo } from "../../../assets/logos";
|
||||
import { useNavigate } from "react-router-dom";
|
||||
import React from 'react';
|
||||
import {
|
||||
chevroneLeft,
|
||||
chevroneRight,
|
||||
arrowLeft,
|
||||
} from '../../../assets/icons/header';
|
||||
import { Logo } from '../../../assets/logos';
|
||||
import { useNavigate } from 'react-router-dom';
|
||||
|
||||
interface HeaderProps {
|
||||
missionId: number;
|
||||
}
|
||||
|
||||
const Header: React.FC<HeaderProps> = ({
|
||||
missionId
|
||||
}) => {
|
||||
const Header: React.FC<HeaderProps> = ({ missionId }) => {
|
||||
const navigate = useNavigate();
|
||||
return (
|
||||
<header className="w-full h-[60px] flex items-center px-4 gap-[20px]">
|
||||
<img src={Logo} alt="Logo" className="h-[28px] w-auto cursor-pointer" onClick={() => { navigate("/home") }} />
|
||||
<img
|
||||
src={Logo}
|
||||
alt="Logo"
|
||||
className="h-[28px] w-auto cursor-pointer"
|
||||
onClick={() => {
|
||||
navigate('/home');
|
||||
}}
|
||||
/>
|
||||
|
||||
<img src={arrowLeft} alt="back" className="h-[24px] w-[24px] cursor-pointer" onClick={() => { navigate("/home/missions") }} />
|
||||
<img
|
||||
src={arrowLeft}
|
||||
alt="back"
|
||||
className="h-[24px] w-[24px] cursor-pointer"
|
||||
onClick={() => {
|
||||
navigate('/home/missions');
|
||||
}}
|
||||
/>
|
||||
|
||||
<div className="flex gap-[10px]">
|
||||
<img src={chevroneLeft} alt="back" className="h-[24px] w-[24px] cursor-pointer" onClick={() => { navigate(`/mission/${missionId - 1}`) }} />
|
||||
<img
|
||||
src={chevroneLeft}
|
||||
alt="back"
|
||||
className="h-[24px] w-[24px] cursor-pointer"
|
||||
onClick={() => {
|
||||
navigate(`/mission/${missionId - 1}`);
|
||||
}}
|
||||
/>
|
||||
<span>{missionId}</span>
|
||||
<img src={chevroneRight} alt="back" className="h-[24px] w-[24px] cursor-pointer" onClick={() => { navigate(`/mission/${missionId + 1}`) }} />
|
||||
<img
|
||||
src={chevroneRight}
|
||||
alt="back"
|
||||
className="h-[24px] w-[24px] cursor-pointer"
|
||||
onClick={() => {
|
||||
navigate(`/mission/${missionId + 1}`);
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
|
||||
</header>
|
||||
);
|
||||
};
|
||||
|
||||
Reference in New Issue
Block a user