diff --git a/src/components/dashboard/DashboardLayout.tsx b/src/components/dashboard/DashboardLayout.tsx
index ec1a7e7c..3b3a5b86 100644
--- a/src/components/dashboard/DashboardLayout.tsx
+++ b/src/components/dashboard/DashboardLayout.tsx
@@ -172,77 +172,78 @@ export function DashboardLayout({
           <DashboardSidebar>
             {(isOpen) => (
               <>
-                <div className="mb-2 px-5 pt-3 pb-2 text-2xl font-extrabold flex items-center">
-                  <div className="inline-block w-9 h-9 mr-3">
-                    <Logo
-                      type="lottie"
-                      width={36}
-                      height={36}
-                      autoplay={false}
+                <div className="flex-1 min-h-0 flex flex-col">
+                  <div className="mb-2 px-5 pt-3 pb-2 text-2xl font-extrabold flex items-center">
+                    <div className="inline-block w-9 h-9 mr-3">
+                      <Logo
+                        type="lottie"
+                        width={36}
+                        height={36}
+                        autoplay={false}
+                      />
+                    </div>
+                    {isOpen && "xLog"}
+                  </div>
+                  {userSite.data?.[0]?.username &&
+                    subdomain &&
+                    userSite.data[0].username !== subdomain && (
+                      <div className="mb-2 px-5 pt-3 pb-2 bg-orange-50 text-center">
+                        <div className="mb-2">
+                          {isOpen && "You are operating"}
+                        </div>
+                        <Avatar
+                          images={site.data?.avatars || []}
+                          size={isOpen ? 60 : 40}
+                          name={site.data?.name}
+                        />
+                        {isOpen && (
+                          <span className="flex flex-col justify-center">
+                            <span className="block">{site.data?.name}</span>
+                            <span className="block text-sm text-zinc-400">
+                              @{site.data?.username}
+                            </span>
+                          </span>
+                        )}
+                      </div>
+                    )}
+                  <div className="mb-2 px-2 pt-3 pb-2">
+                    <ConnectButton
+                      left={true}
+                      size="base"
+                      hideNotification={true}
+                      hideName={!isOpen}
                     />
                   </div>
-                  {isOpen && "xLog"}
-                </div>
-                {userSite.data?.[0]?.username &&
-                  subdomain &&
-                  userSite.data[0].username !== subdomain && (
-                    <div className="mb-2 px-5 pt-3 pb-2 bg-orange-50 text-center">
-                      <div className="mb-2">
-                        {isOpen && "You are operating"}
-                      </div>
-                      <Avatar
-                        images={site.data?.avatars || []}
-                        size={isOpen ? 60 : 40}
-                        name={site.data?.name}
-                      />
-                      {isOpen && (
-                        <span className="flex flex-col justify-center">
-                          <span className="block">{site.data?.name}</span>
-                          <span className="block text-sm text-zinc-400">
-                            @{site.data?.username}
-                          </span>
-                        </span>
-                      )}
-                    </div>
-                  )}
-                <div className="mb-2 px-2 pt-3 pb-2">
-                  <ConnectButton
-                    left={true}
-                    size="base"
-                    hideNotification={true}
-                    hideName={!isOpen}
-                  />
-                </div>
 
-                <div className="px-3 space-y-[2px] text-zinc-500">
-                  {links.map((link) => {
-                    const active =
-                      link.href &&
-                      link.isActive({
-                        pathname: router.asPath,
-                        href: link.href,
-                      })
-                    return (
-                      <UniLink
-                        href={link.href}
-                        key={link.text}
-                        className={cn(
-                          `flex px-4 h-12 items-center rounded-md space-x-2 w-full transition-colors`,
-                          active
-                            ? `bg-slate-200 font-medium text-accent`
-                            : `hover:bg-slate-200 hover:bg-opacity-50`,
-                          !isOpen && "justify-center",
-                        )}
-                        onClick={link.onClick}
-                      >
-                        <span className={cn(link.icon, "text-xl")}></span>
-                        {isOpen && <span>{t(link.text)}</span>}
-                      </UniLink>
-                    )
-                  })}
+                  <div className="px-3 space-y-[2px] text-zinc-500 flex-1 min-h-0 overflow-y-auto">
+                    {links.map((link) => {
+                      const active =
+                        link.href &&
+                        link.isActive({
+                          pathname: router.asPath,
+                          href: link.href,
+                        })
+                      return (
+                        <UniLink
+                          href={link.href}
+                          key={link.text}
+                          className={cn(
+                            `flex px-4 h-12 items-center rounded-md space-x-2 w-full transition-colors`,
+                            active
+                              ? `bg-slate-200 font-medium text-accent`
+                              : `hover:bg-slate-200 hover:bg-opacity-50`,
+                            !isOpen && "justify-center",
+                          )}
+                          onClick={link.onClick}
+                        >
+                          <span className={cn(link.icon, "text-xl")}></span>
+                          {isOpen && <span>{t(link.text)}</span>}
+                        </UniLink>
+                      )
+                    })}
+                  </div>
                 </div>
-
-                <div className="absolute bottom-5 left-0 right-0 flex items-center px-4 flex-col">
+                <div className="flex items-center px-4 flex-col pb-4">
                   <UniLink
                     href={DISCORD_LINK}
                     className="space-x-1 text-zinc-500 hover:text-zinc-800 flex w-full h-12 items-center justify-center transition-colors mb-2"
diff --git a/src/components/dashboard/DashboardSidebar.tsx b/src/components/dashboard/DashboardSidebar.tsx
index ed81badc..d163c6c2 100644
--- a/src/components/dashboard/DashboardSidebar.tsx
+++ b/src/components/dashboard/DashboardSidebar.tsx
@@ -23,7 +23,7 @@ export const DashboardSidebar: React.FC<{
     <div
       className={`${
         isOpen ? `w-sidebar` : "w-20"
-      } relative bg-slate-50 z-10 h-full transition-all`}
+      } relative bg-slate-50 z-10 h-full transition-all flex flex-col`}
     >
       {children(isOpen)}
       <div className="w-[1px] bg-border absolute top-0 right-0 bottom-0"></div>
diff --git a/src/pages/index.tsx b/src/pages/index.tsx
index 791e950a..320f0992 100644
--- a/src/pages/index.tsx
+++ b/src/pages/index.tsx
@@ -251,7 +251,7 @@ function Home() {
   return (
     <div className="max-w-screen-lg px-5 mx-auto">
       <div className="h-screen w-full flex justify-center flex-col relative text-center">
-        <h2 className="text-7xl sm:text-8xl font-bold mb-5">
+        <h2 className="text-6xl sm:text-8xl font-bold mb-5">
           {features.map((feature) => (
             <span
               key={feature.title}
@@ -262,7 +262,7 @@ function Home() {
             </span>
           ))}
         </h2>
-        <h3 className="mt-5 text-zinc-800 text-2xl sm:text-4xl font-light">
+        <h3 className="mt-3 sm:mt-5 text-zinc-800 text-2xl sm:text-4xl font-light">
           <Trans i18nKey="description" ns="index">
             <strong className="font-medium">xLog</strong> is the best{" "}
             <UniLink
@@ -281,7 +281,7 @@ function Home() {
             blogging community for everyone.
           </Trans>
         </h3>
-        <div className="my-6 sm:my-12 flex items-center justify-center sm:flex-row flex-col">
+        <div className="my-4 sm:my-12 flex items-center justify-center sm:flex-row flex-col">
           <Button
             className="text-accent h-10 mt-4 flex items-center"
             onClick={tryNow}
@@ -318,8 +318,8 @@ function Home() {
             </span>
           </Button>
         </div>
-        <div className="text-center absolute bottom-14 w-full flex items-center justify-center flex-col">
-          <span className="mb-3">{t("Explore the xLog way")}</span>
+        <div className="text-center absolute bottom-4 sm:bottom-14 w-full flex items-center justify-center flex-col">
+          <span className="mb-1 sm:mb-3">{t("Explore the xLog way")}</span>
           <Link
             to="Features"
             spy={true}