diff options
Diffstat (limited to 'src/components/TitleBar/TitleBar.tsx')
| -rw-r--r-- | src/components/TitleBar/TitleBar.tsx | 26 |
1 files changed, 15 insertions, 11 deletions
diff --git a/src/components/TitleBar/TitleBar.tsx b/src/components/TitleBar/TitleBar.tsx index 85fbfbd..05a0e5d 100644 --- a/src/components/TitleBar/TitleBar.tsx +++ b/src/components/TitleBar/TitleBar.tsx @@ -1,25 +1,29 @@ 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 }) => { +const TitleBar: React.FC<TitleBarProps> = ({ title, redirectUrl, showHomeButton, backgroundColor }) => { return ( - <div className="title-bar p-5 shadow-md" style={{ backgroundColor: '#2D4B71' }}> - <div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center' }}> - <a href={redirectUrl}> - <span className="text-white text-4xl font-bold">{title}</span> - </a> - {showHomeButton && ( - <a href="/"> - <button className="bg-white text-blue-500 hover:bg-blue-500 hover:text-white font-bold py-2 px-4 rounded-full">Home</button> + <> + <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> - </div> + </> ); }; |