fix #370 - make black hover box go from the edge of the screen

ZdruzenieSTROM · May 19, 2024 · b2b2b46 · b2b2b46
1 parent e8b5664
commit b2b2b46
Show file tree

Hide file tree

Showing 3 changed files with 9 additions and 5 deletions.
diff --git a/src/components/PageLayout/PageLayout.tsx b/src/components/PageLayout/PageLayout.tsx
@@ -1,4 +1,4 @@
-import {Stack} from '@mui/material'
+import {Stack, SxProps} from '@mui/material'
 import Grid from '@mui/material/Unstable_Grid2'
 import Head from 'next/head'
 import {FC, ReactNode} from 'react'
@@ -15,6 +15,7 @@ type PageLayoutProps = {
   contentWidth?: number
   title?: string
   children: ReactNode
+  sx?: SxProps
 }
 
 const seminarTitle: Record<Seminar, string> = {
@@ -25,7 +26,7 @@ const seminarTitle: Record<Seminar, string> = {
 
 // pre pouzitie len na seminarovych strankach a podstrankach - `/matik(/*)`
 // ked budeme potrebovat top-level stranky ako `/ina-stranka`, budeme musiet upravit, ako sa pracuje s `useSeminarInfo`
-export const PageLayout: FC<PageLayoutProps> = ({contentWidth = 2, title = '', children}) => {
+export const PageLayout: FC<PageLayoutProps> = ({contentWidth = 2, title = '', children, sx}) => {
   const {seminar} = useSeminarInfo()
   const browserTitlePrefix = title && `${title} | `
   const browserTitle = `${browserTitlePrefix}${seminarTitle[seminar]}`
@@ -44,7 +45,7 @@ export const PageLayout: FC<PageLayoutProps> = ({contentWidth = 2, title = '', c
               <Grid xs={0} md={3} sx={{position: 'relative', display: {xs: 'none', md: 'block'}}}>
                 <StromLogo />
               </Grid>
-              <Grid xs={12} md={contentWidth * 3} sx={{pb: 2, px: 1}}>
+              <Grid xs={12} md={contentWidth * 3} sx={{pb: 2, px: 1, ...sx}}>
                 {children}
               </Grid>
             </Grid>

diff --git a/src/components/Results/ResultsRow.module.scss b/src/components/Results/ResultsRow.module.scss
@@ -11,7 +11,8 @@
   display: flex;
   justify-content: flex-start;
   align-items: center;
-  padding: 0px;
+  // top-level PageLayout padding je vypnuty, odsadzame to rucne tu
+  padding-left: 8px;
 }
 
 .nameAndSchool {
@@ -60,6 +61,8 @@
 }
 
 .totalScore {
+  // top-level PageLayout padding je vypnuty, odsadzame to rucne tu
+  padding-right: 8px;
   display: flex;
   justify-content: center;
   align-items: center;

diff --git a/src/pages/strom/vysledky/[[...params]].tsx b/src/pages/strom/vysledky/[[...params]].tsx
@@ -5,7 +5,7 @@ import {Results} from '@/components/Results/Results'
 
 const Vysledky: NextPage = () => {
   return (
-    <PageLayout contentWidth={2} title="Výsledky">
+    <PageLayout contentWidth={2} title="Výsledky" sx={{px: 0}}>
       <Results />
     </PageLayout>
   )