fix: adjust styles

cardano-foundation · Aug 23, 2023 · 5dd4a97 · 5dd4a97
1 parent ffcd367
commit 5dd4a97
Show file tree

Hide file tree

Showing 6 changed files with 16 additions and 8 deletions.
diff --git a/ui/summit-2023/src/App.scss b/ui/summit-2023/src/App.scss
@@ -14,8 +14,8 @@ html,
 .MainContent {
   flex: 1;
   display: flex;
-  align-items: center; // Centra el contenido verticalmente
-  justify-content: center; // Centra el contenido horizontalmente
+  align-items: center;
+  justify-content: center;
 }
 .background-shape-1 {
   position: absolute;

diff --git a/ui/summit-2023/src/App.tsx b/ui/summit-2023/src/App.tsx
@@ -20,7 +20,7 @@ function App() {
         <div className="App">
           <Header />
           <div className="MainContent">
-            <Container>
+            <Container maxWidth="xl">
               <Box my={2}>
                 <Routes>
                   <Route

diff --git a/ui/summit-2023/src/components/Hero/Hero.scss b/ui/summit-2023/src/components/Hero/Hero.scss
@@ -68,3 +68,8 @@
     transform: scale(1.05);
   }
 }
+
+.hexagon-outer-container {
+  height: auto;
+  overflow: hidden; // Esto es para asegurarse de que nada se desborde del contenedor
+}
diff --git a/ui/summit-2023/src/components/Hero/Hero.tsx b/ui/summit-2023/src/components/Hero/Hero.tsx
@@ -28,16 +28,18 @@ const Hero: React.FC = () => {
         display: 'flex',
         flexDirection: { xs: 'column', sm: 'row' },
         height: { xs: 'auto', sm: '400px' },
+        marginLeft: isMobile ? '0px' : '50px'
       }}
     >
       <Box
         sx={{
           flex: '1',
           padding: '20px',
+          marginRight: isMobile ? '0px' : '40px',
           order: { xs: '1', sm: '1' },
         }}
       >
-        <div className="left-title-container"  style={{ marginTop: isMobile ? '0px' : '50px' }}>
+        <div className="left-title-container"  style={{ marginTop: isMobile ? '0px' : '120px' }}>
           <Typography
             className="title"
             variant="h2"
@@ -64,10 +66,11 @@ const Hero: React.FC = () => {
         sx={{
           flex: '1',
           padding: '20px',
+          marginLeft:  isMobile ? '0px' : '40px',
           order: { xs: '2', sm: '2' },
         }}
       >
-        <div style={{ padding: isMobile ? '0px' : '20px' }}>
+        <div style={{ paddingRight: isMobile ? '0px' : '20%' }}>
           <Hexagon>
             <>
               <div className="right-title-container">

diff --git a/ui/summit-2023/src/components/common/Footer/Footer.tsx b/ui/summit-2023/src/components/common/Footer/Footer.tsx
@@ -14,7 +14,7 @@ const Footer: React.FC = () => {
         <Grid
           item
           xs={12}
-          sm={6}
+          sm={4}
         >
           <Typography variant="body2">
             © {new Date().getFullYear()} Cardano Summit.
@@ -24,7 +24,7 @@ const Footer: React.FC = () => {
         <Grid
           item
           xs={12}
-          sm={6}
+          sm={8}
         >
           <Grid container>
             <Grid

diff --git a/ui/summit-2023/src/pages/Home/Home.tsx b/ui/summit-2023/src/pages/Home/Home.tsx
@@ -8,7 +8,7 @@ const Home = () => {
   return (
     <>
       <Hero />
-      <div style={{ height: isMobile ? '0px' : '200px' }} />
+      <div style={{ marginTop: isMobile ? '0px' : '15%' }} />
     </>
   );
 };