fix: home page

Signed-off-by: Innei <i@innei.in>
Innei · Jul 7, 2023 · 1bda357 · 1bda357 · vercel · Jul 7, 2023
1 parent 79398af
commit 1bda357
Show file tree

Hide file tree

Showing 3 changed files with 11 additions and 12 deletions.
diff --git a/src/app/(home)/page.tsx b/src/app/(home)/page.tsx
@@ -47,7 +47,7 @@ const Screen = forwardRef<
       ref={ref}
       style={isDev ? debugStyle : undefined}
       className={clsxm(
-        'relative flex h-screen flex-col center',
+        'relative flex h-screen min-h-[900px] flex-col center',
         props.className,
       )}
     >
@@ -120,7 +120,7 @@ const Welcome = () => {
     }, 0) * 50
   return (
     <Screen className="mt-20 lg:mt-[-4.5rem]">
-      <TwoColumnLayout>
+      <TwoColumnLayout leftContainerClassName="mt-[120px] lg:mt-0 h-[15rem] lg:h-1/2">
         <>
           <m.div
             className="group relative leading-[4] [&_*]:inline-block"
@@ -213,7 +213,7 @@ const PostScreen = () => {
   const { posts } = useHomeQueryData()
   return (
     <Screen className="h-[120vh]">
-      <TwoColumnLayout leftContainerClassName="h-1/4 lg:h-1/2">
+      <TwoColumnLayout leftContainerClassName="h-[30rem] lg:h-1/2">
         <m.h2
           initial={{
             opacity: 0.0001,
@@ -325,7 +325,7 @@ const NoteScreen = () => {
   return (
     <Screen>
       <TwoColumnLayout leftContainerClassName="block lg:flex">
-        <div>
+        <div className="mt-12 lg:mt-0">
           <section className="flex flex-col justify-end">
             <m.h3
               className="mb-6 text-center text-xl"

diff --git a/src/components/layout/header/internal/HeaderContent.tsx b/src/components/layout/header/internal/HeaderContent.tsx
@@ -41,11 +41,10 @@ const AccessibleMenu: Component = () => {
         {showShow && (
           <m.div
             layout
-            layoutRoot
-            initial={{ y: -64 }}
+            initial={{ y: -20 }}
             animate={{ y: 0 }}
             exit={{ y: -20, opacity: 0 }}
-            className="fixed left-0 right-0 top-[6rem] z-10 flex justify-center duration-[100ms]"
+            className="fixed left-0 right-0 top-[3rem] z-10 flex justify-center duration-[100ms]"
           >
             <ForDesktop />
           </m.div>
@@ -97,8 +96,7 @@ const ForDesktop: Component<{
   const background = useMotionTemplate`radial-gradient(${radius}px circle at ${mouseX}px ${mouseY}px, var(--spotlight-color) 0%, transparent 65%)`
 
   return (
-    <m.nav
-      layout="size"
+    <nav
       onMouseMove={handleMouseMove}
       className={clsxm(
         'relative',
@@ -137,7 +135,7 @@ const ForDesktop: Component<{
           )
         })}
       </div>
-    </m.nav>
+    </nav>
   )
 }
 
@@ -154,13 +152,13 @@ const HeaderMenuItem = memo<{
       <AnimatedItem
         href={href}
         isActive={isActive}
-        className={clsx('transition-[padding]')}
+        className="transition-[padding]"
       >
         <span className="relative flex items-center">
           {isActive && (
             <m.span
               layoutId={iconLayout ? 'header-menu-icon' : undefined}
-              className={clsxm('mr-2 flex items-center')}
+              className="mr-2 flex items-center"
             >
               {subItemActive?.icon ?? section.icon}
             </m.span>

diff --git a/src/components/ui/link-card/LinkCard.tsx b/src/components/ui/link-card/LinkCard.tsx
@@ -24,6 +24,7 @@ export interface LinkCardProps {
 }
 
 export const LinkCard = (props: LinkCardProps) => {
+  console.log('LinkCard', props)
   const isClient = useIsClientTransition()
 
   if (!isClient) return null