My personal website
1import { cn } from '@/lib/utils';
2import React from 'react';
3import { Paragraph } from '../Paragraph/Paragraph';
4import { Link } from '../Link/Link';
5import { banner } from './Banner.styles';
6import { BannerProps } from './Banner.types';
7
8export const Banner: React.FC<BannerProps> = ({ message, linkText, linkUrl, className = '' }) => {
9 return (
10 <div className={cn(banner, className)} role="banner">
11 <div className="flex items-center mx-auto">
12 <Paragraph className="text-sm font-normal">
13 {message}{' '}
14 {linkText && linkUrl && (
15 <Link href={linkUrl}>
16 {linkText}
17 </Link>
18 )}
19 </Paragraph>
20 </div>
21 </div>
22 );
23};