Merge pull request #4 from CambioML/jojo-dev

update hero and navbar
CambioML · May 13, 2024 · 64ac219 · 64ac219
2 parents 0fc7996 + 40cf8dd
commit 64ac219
Show file tree

Hide file tree

Showing 3 changed files with 25 additions and 36 deletions.
diff --git a/app/components/Hero.tsx b/app/components/Hero.tsx
@@ -1,8 +1,6 @@
 'use client';
 
 import Container from './Container';
-import Image from 'next/image';
-import { imgPrefix } from '@/app/hooks/useImgPrefix';
 
 interface HeroProps {
   title: string;
@@ -14,27 +12,9 @@ interface HeroProps {
 const Hero = ({ title, subtitle, center, image }: HeroProps) => {
   return (
     <div
-      className={`w-full h-full overflow-hidden relative mix-blend-overlay ${!image && 'bg-gradient-to-r from-slate-900 to-slate-600'}`}
+      className={`pt-20 pb-10 w-full h-full overflow-hidden relative mix-blend-overlay ${!image && 'bg-gradient-to-r from-slate-900 to-slate-600'}`}
     >
-      {image && (
-        <>
-          <Image
-            src={imgPrefix + image}
-            alt="Hero"
-            fill
-            style={{
-              objectFit: 'cover',
-              zIndex: -1,
-              backgroundPosition: 'center',
-              filter: 'blur(2px)',
-              opacity: 0.5,
-            }}
-            quality={100}
-          />
-          <div className="absolute -z-10 bg-gradient-to-r from-cambio-blue from-10% via-white to-cambio-blue to-90% h-full w-full" />
-        </>
-      )}
-      <Container styles="h-[30vh] min-h-[200px]">
+      <Container styles="h-[25vh] min-h-[150px]">
         <div className={`flex flex-col justify-center ${center && 'items-center'} h-full w-full`}>
           <div className="max-w-[900px]">
             <h1 className={`text-6xl font-bold text-neutral-100 pt-4 pb-5 ${center && 'text-center'}`}>{title}</h1>

diff --git a/app/components/Navbar.tsx b/app/components/Navbar.tsx
@@ -1,7 +1,6 @@
 'use client';
 
 import { useWindowScroll } from '@/app/hooks/useWindowScroll';
-import Container from './Container';
 
 const Navbar = () => {
   const isScrolled = useWindowScroll(50);
@@ -15,22 +14,32 @@ const Navbar = () => {
         py-4
         "
       >
-        <Container>
+        <div
+          className={`
+                max-w-screen-2xl
+                mx-auto
+                xl:px-20
+                md:px-10
+                sm:px-4
+                px-4
+                h-full
+                `}
+        >
           <div
             className="
-                    flex
-                    flex-row
-                    items-center
-                    justify-between
-                    gap-3
-                    md: gap-0
-                    text-xl
-                    text-neutral-100
-                    "
+          flex
+          flex-row
+          items-center
+          justify-between
+          gap-3
+          md: gap-0
+          text-xl
+          text-neutral-100
+          "
           >
             KDD Workshop 2024
           </div>
-        </Container>
+        </div>
       </div>
     </div>
   );

diff --git a/app/page.tsx b/app/page.tsx
@@ -24,10 +24,10 @@ export default function Home() {
         />
       </Section>
       <Agenda />
+      <Speakers />
       <Section title="Slides">
-        <TextContainer text="Slides will be available here." />
+        <TextContainer text="Slides will be available here after the workshop." />
       </Section>
-      <Speakers />
     </div>
   );
 }