From 54041387013136ea528501715001f841e8f1604e Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Mat=C3=BA=C5=A1=20Hlav=C3=A1=C4=8Dik?=
 <hlavacik.matus@gmail.com>
Date: Fri, 8 Dec 2023 21:26:42 +0100
Subject: [PATCH] Add typography to `Banner` (#237)

---
 src/components/PageLayout/Banner/Banner.module.scss | 2 +-
 src/components/PageLayout/Banner/Banner.tsx         | 5 ++++-
 2 files changed, 5 insertions(+), 2 deletions(-)

diff --git a/src/components/PageLayout/Banner/Banner.module.scss b/src/components/PageLayout/Banner/Banner.module.scss
index adcfcefd..62d4c8e1 100644
--- a/src/components/PageLayout/Banner/Banner.module.scss
+++ b/src/components/PageLayout/Banner/Banner.module.scss
@@ -1,6 +1,5 @@
 .banner{
   width: 100vw;
-  height: 2rem;
   background-color: black;
   color: white;
   border: none;
@@ -9,6 +8,7 @@
   padding: 0px;
   z-index: 3;
   margin-bottom: 0.5rem;
+  padding: 0.2rem;
 }
 
 
diff --git a/src/components/PageLayout/Banner/Banner.tsx b/src/components/PageLayout/Banner/Banner.tsx
index a9dc9182..26c2bdce 100644
--- a/src/components/PageLayout/Banner/Banner.tsx
+++ b/src/components/PageLayout/Banner/Banner.tsx
@@ -1,3 +1,4 @@
+import {Typography} from '@mui/material'
 import {FC} from 'react'
 
 import {Marquee} from '@/components/Marquee/Marquee'
@@ -10,7 +11,9 @@ export const Banner: FC = () => {
   return (
     <div className={styles.banner}>
       <Marquee gradient={false} speed={100}>
-        <div className={styles.marqueeTextContainer}>{bannerText}</div>
+        <Typography variant="h2" component="span" className={styles.marqueeTextContainer}>
+          {bannerText}
+        </Typography>
       </Marquee>
     </div>
   )