From 8368f6ea526ec141f4bb1722cf0c1453eeb6c938 Mon Sep 17 00:00:00 2001
From: Nick Winters <nick@pogseal.com>
Date: Wed, 8 Jan 2025 18:32:57 -0800
Subject: [PATCH] Column 4 UI updates

---
 app/routes/_exploreuser+/components/Discover.tsx | 12 ------------
 app/routes/_site+/_components/Column-4.tsx       | 16 ++--------------
 app/routes/_site+/_components/Contributors.tsx   |  4 ++--
 app/routes/_site+/_components/SiteHeader.tsx     | 15 ++-------------
 4 files changed, 6 insertions(+), 41 deletions(-)

diff --git a/app/routes/_exploreuser+/components/Discover.tsx b/app/routes/_exploreuser+/components/Discover.tsx
index 2a98268b6..fe1865e4e 100644
--- a/app/routes/_exploreuser+/components/Discover.tsx
+++ b/app/routes/_exploreuser+/components/Discover.tsx
@@ -217,18 +217,6 @@ export function Discover() {
                                     {site.about}
                                  </div>
                                  <div className="flex items-center justify-between pt-1">
-                                    {site?.followers && (
-                                       <div className="text-[10px] flex items-center gap-1">
-                                          <Icon
-                                             name="users-2"
-                                             size={12}
-                                             className="text-1"
-                                          />
-                                          <span className="dark:text-zinc-500 text-zinc-400">
-                                             {site?.followers}
-                                          </span>
-                                       </div>
-                                    )}
                                     <span className="text-xs dark:text-zinc-500 text-zinc-400 flex items-center gap-1">
                                        <Icon
                                           name="link-2"
diff --git a/app/routes/_site+/_components/Column-4.tsx b/app/routes/_site+/_components/Column-4.tsx
index 3982fca3b..4003f1de1 100644
--- a/app/routes/_site+/_components/Column-4.tsx
+++ b/app/routes/_site+/_components/Column-4.tsx
@@ -52,7 +52,7 @@ function AboutSection({
          )}
          <div
             className={clsx(
-               hasTrending ? "" : "border-b pt-2 pb-5 border-color",
+               hasTrending ? "" : "border-b mb-4 pt-2 pb-5 border-color",
                "space-y-1",
             )}
          >
@@ -116,19 +116,7 @@ export function ColumnFour() {
          >
             <div className="flex flex-col justify-between flex-grow">
                <div>
-                  {/* <div>Remove Ads</div> */}
-                  <section className="grid grid-cols-3 gap-4 py-4 relative z-20 max-laptop:max-w-[728px] max-tablet:px-4 max-laptop:mx-auto mx-4 max-laptop:w-full">
-                     <div
-                        className="dark:bg-dark400 dark:laptop:bg-bg3Dark max-laptop:dark:border-zinc-600/50 bg-white max-laptop:dark:shadow-zinc-800/60
-                       dark:laptop:shadow-zinc-800 shadow-sm border border-color px-3 py-1.5 rounded-lg"
-                     >
-                        <div className="text-xs font-bold text-center">
-                           {site.followers ? site.followers : "-"}
-                        </div>
-                        <div className="text-xs text-1 text-center">
-                           Followers
-                        </div>
-                     </div>
+                  <section className="grid grid-cols-2 gap-4 py-4 relative z-20 max-laptop:max-w-[728px] max-tablet:px-4 max-laptop:mx-auto mx-4 max-laptop:w-full">
                      <div
                         className="dark:bg-dark400 dark:laptop:bg-bg3Dark max-laptop:dark:border-zinc-600/50 bg-white max-laptop:dark:shadow-zinc-800/60
                        dark:laptop:shadow-zinc-800 shadow-sm border border-color px-3 py-1.5 rounded-lg"
diff --git a/app/routes/_site+/_components/Contributors.tsx b/app/routes/_site+/_components/Contributors.tsx
index 141940bf4..1de733dd4 100644
--- a/app/routes/_site+/_components/Contributors.tsx
+++ b/app/routes/_site+/_components/Contributors.tsx
@@ -15,8 +15,8 @@ export function Contributors({
       <>
          <section
             className={clsx(
-               site?.trendingPages?.length == 0 ? "w-full py-4" : "pb-4",
-               "relative z-20 mx-auto max-laptop:max-w-[728px] laptop:px-4  max-tablet:px-4",
+               site?.trendingPages?.length == 0 ? "w-full py-4" : "",
+               "relative z-20 mx-auto max-laptop:max-w-[728px] py-4 laptop:px-4  max-tablet:px-4",
             )}
          >
             <div className="flex items-center pb-3">
diff --git a/app/routes/_site+/_components/SiteHeader.tsx b/app/routes/_site+/_components/SiteHeader.tsx
index 7a4343bce..3049a0cb7 100644
--- a/app/routes/_site+/_components/SiteHeader.tsx
+++ b/app/routes/_site+/_components/SiteHeader.tsx
@@ -59,7 +59,7 @@ export function SiteHeader({
                      >
                         <div
                            className="dark:bg-dark450 border dark:border-zinc-600 shadow-1 bg-zinc-50 overflow-hidden flex-none
-                              text-1 flex size-11 items-center justify-center dark:group-hover:border-zinc-600 border-zinc-300/60
+                              text-1 flex size-10 items-center justify-center dark:group-hover:border-zinc-600 border-zinc-300/60
                               rounded-xl shadow-sm transition duration-300 active:translate-y-0.5 group-hover:border-zinc-300"
                         >
                            {site?.icon?.url ? (
@@ -76,21 +76,10 @@ export function SiteHeader({
                               </>
                            )}
                         </div>
-                        <div className="truncate pl-3 text-sm">
+                        <div className="truncate pl-3 font-header">
                            <div className="font-bold truncate group-hover:underline decoration-zinc-300 underline-offset-2 dark:decoration-zinc-600">
                               {site.name}
                            </div>
-                           {site?.followers && (
-                              <div className="text-[10px] flex items-center gap-1">
-                                 <Icon
-                                    name="users-2"
-                                    className="text-1 size-3"
-                                 />
-                                 <span className="dark:text-zinc-500 text-zinc-400">
-                                    {site?.followers}
-                                 </span>
-                              </div>
-                           )}
                         </div>
                      </Link>
                   </div>