src/components/TitleBar/TitleBar.tsx


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30

import React from 'react';
import '../TitleBar/TitleBarStyle.css'

interface TitleBarProps {
    title: string;
    redirectUrl?: string;
    showHomeButton?: boolean;
    backgroundColor?: string;
}

const TitleBar: React.FC<TitleBarProps> = ({ title, redirectUrl, showHomeButton, backgroundColor }) => {
    return (
        <>
            <div className="title-bar p-5 shadow-md" style={{ backgroundColor: backgroundColor || '#2D4B71' }}>
                <div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center' }}>
                    <a href={redirectUrl}>
                        <span className="text-white text-4xl font-bold" style={{ fontFamily: 'Quantico, sans-serif' }}>{title}</span>
                    </a>
                    {showHomeButton && (
                        <a href="/">
                            <button className="bg-white text-black font-bold py-2 px-4 rounded-lg">Home</button>
                        </a>
                    )}
                </div>
            </div>
        </>
    );
};

export default TitleBar;