From f46db88f0897c8ef0254d990e741fdb30a2dda2c Mon Sep 17 00:00:00 2001
From: matushl <hlavacik.matus@gmail.com>
Date: Sat, 14 Dec 2024 20:30:39 +0100
Subject: [PATCH] Try no. 1

---
 src/components/PageLayout/PageLayout.tsx      |  4 +--
 .../PageLayout/StromLogo/StromLogo.tsx        | 31 ++++++++++++++++---
 2 files changed, 28 insertions(+), 7 deletions(-)

diff --git a/src/components/PageLayout/PageLayout.tsx b/src/components/PageLayout/PageLayout.tsx
index 7d01acb6..31e0492b 100644
--- a/src/components/PageLayout/PageLayout.tsx
+++ b/src/components/PageLayout/PageLayout.tsx
@@ -43,9 +43,7 @@ export const PageLayout: FC<PageLayoutProps> = ({contentWidth = 2, title = '', c
             <TopGrid />
             <Grid container disableEqualOverflow sx={{flex: 1}}>
               <Grid xs={0} md={3} sx={{display: {xs: 'none', md: 'block'}, pt: {xs: 4, md: 8, lg: 12}}}>
-                <Box sx={{position: 'relative'}}>
-                  <StromLogo />
-                </Box>
+                <StromLogo />
               </Grid>
               <Grid
                 xs={12}
diff --git a/src/components/PageLayout/StromLogo/StromLogo.tsx b/src/components/PageLayout/StromLogo/StromLogo.tsx
index 50f99908..ed13e9e2 100644
--- a/src/components/PageLayout/StromLogo/StromLogo.tsx
+++ b/src/components/PageLayout/StromLogo/StromLogo.tsx
@@ -1,13 +1,35 @@
-import {Box} from '@mui/material'
-import {FC} from 'react'
+import {Box, Button} from '@mui/material'
+import {FC, useEffect, useRef, useState} from 'react'
 
 import Strom from '@/svg/strom.svg'
+import {BannerContainer} from '@/utils/BannerContainer'
 
 export const StromLogo: FC = () => {
+  const firstBoxRef = useRef<HTMLDivElement>(null)
+  const [topPosition, setTopPosition] = useState(0)
+
+  const {bannerMessages} = BannerContainer.useContainer()
+
+  const updateTopPosition = () => {
+    if (firstBoxRef.current) {
+      const rect = firstBoxRef.current.getBoundingClientRect()
+      setTopPosition(rect.top)
+      console.log(rect.top)
+    }
+  }
+
+  useEffect(() => {
+    updateTopPosition()
+    // toto sa prepocita skor ako sa baner zobrazi v plnej sirke, takze toto uplne nefunguje
+    // dalsim problemom je ked sa zmeni nadpis (napriklad pri poradi prejdes z poradia semestra na seriu - zvacsi sa nadpis - banner sa posunie nizsie)
+  }, [bannerMessages])
+
   return (
     <>
       {/* zistit pozicitu tohto boxu a nastavit to ako top pre box obsahujuci strom */}
-      <Box />
+      <Box ref={firstBoxRef}>
+        <Button onClick={updateTopPosition}>Update top position</Button>
+      </Box>
       <Box
         sx={{
           position: 'fixed',
@@ -16,10 +38,11 @@ export const StromLogo: FC = () => {
           // taktiez pri sirke 900 - 1100px sa niektore nadpisy zalomuju a rozbijaju zarovnanie stromu
           // - problem toho je ze to je rozlisenie vacsinu tabletov na vysku, takze to bude treba fixnut
           // top: {md: '213px', lg: '265px', xl: '301px'},
+          top: topPosition,
           left: 0,
           bottom: 0,
           width: '25%',
-          paddingTop: 2,
+          // paddingTop: 2,
           overflow: 'hidden',
           display: 'flex',
           flexDirection: 'column',