From 8eec3792c3e1f4d7d4cce4062d288238288296a7 Mon Sep 17 00:00:00 2001
From: Marcus Farrell <marcusljf@gmail.com>
Date: Sat, 11 Apr 2026 11:59:39 -0700
Subject: [PATCH 1/2] Consistent page layout and spacing (#3594)

Co-authored-by: Steven Tey <stevensteel97@gmail.com>
---
 .../(dashboard)/payouts/payout-table.tsx      | 20 +++++-----
 .../(enrolled)/bounties/page-client.tsx       |  4 +-
 .../customers/(index)/page-client.tsx         |  2 +-
 .../earnings/earnings-composite-chart.tsx     |  2 +-
 .../(enrolled)/earnings/page.tsx              |  2 +-
 .../(enrolled)/links/page-client.tsx          |  6 ++-
 .../[programSlug]/(enrolled)/page-client.tsx  |  6 +--
 .../programs/marketplace/page-client.tsx      |  2 +-
 .../(ee)/program/analytics/page-client.tsx    |  2 +-
 .../[slug]/(ee)/program/commissions/page.tsx  |  2 +-
 .../(ee)/program/fraud/fraud-group-table.tsx  |  2 +-
 .../(ee)/program/groups/groups-table.tsx      |  2 +-
 .../(ee)/program/network/page-client.tsx      | 33 ++++++++-------
 .../[slug]/(ee)/program/page-client.tsx       |  2 +-
 .../partners/applications/page-client.tsx     |  2 +-
 .../(ee)/program/partners/partners-table.tsx  |  2 +-
 .../(ee)/program/payouts/page-client.tsx      |  2 +-
 .../(ee)/program/payouts/payout-table.tsx     |  2 +-
 .../[slug]/links/folders/page-client.tsx      |  2 +-
 .../(dashboard)/[slug]/links/page-client.tsx  | 26 +++++++-----
 .../[slug]/links/utm/page-client.tsx          |  1 -
 apps/web/ui/analytics/events/index.tsx        |  2 +-
 apps/web/ui/analytics/toggle.tsx              | 40 +++++++++----------
 apps/web/ui/layout/page-content/index.tsx     |  2 +-
 .../page-content-with-side-panel.tsx          |  2 +-
 apps/web/ui/links/links-container.tsx         |  2 +-
 .../program-marketplace-banner.tsx            |  2 +-
 apps/web/ui/shared/search-box.tsx             |  2 +-
 packages/tailwind-config/tailwind.config.ts   |  2 +-
 packages/ui/src/button.tsx                    |  2 +-
 packages/ui/src/date-picker/trigger.tsx       |  2 +-
 packages/ui/src/filter/filter-list.tsx        |  6 +--
 packages/ui/src/filter/filter-select.tsx      |  2 +-
 33 files changed, 98 insertions(+), 92 deletions(-)

diff --git a/apps/web/app/(ee)/partners.dub.co/(dashboard)/payouts/payout-table.tsx b/apps/web/app/(ee)/partners.dub.co/(dashboard)/payouts/payout-table.tsx
index dd938824dc8..6ae17b32e82 100644
--- a/apps/web/app/(ee)/partners.dub.co/(dashboard)/payouts/payout-table.tsx
+++ b/apps/web/app/(ee)/partners.dub.co/(dashboard)/payouts/payout-table.tsx
@@ -230,7 +230,7 @@ export function PayoutTable() {
           payout={detailsSheetState.payout}
         />
       )}
-      <div className="flex flex-col gap-3">
+      <div className="flex flex-col gap-4">
         <PartnerPayoutFilters />
         {payouts?.length !== 0 ? (
           <Table {...table} />
@@ -256,7 +256,7 @@ function PartnerPayoutFilters() {
     usePayoutFilters();
 
   return (
-    <div className="flex flex-col gap-3">
+    <div className="flex flex-col">
       <Filter.Select
         className="w-full md:w-fit"
         filters={filters}
@@ -266,13 +266,15 @@ function PartnerPayoutFilters() {
       />
       <AnimatedSizeContainer height>
         {activeFilters.length > 0 && (
-          <Filter.List
-            filters={filters}
-            activeFilters={activeFilters}
-            onSelect={onSelect}
-            onRemove={onRemove}
-            onRemoveAll={onRemoveAll}
-          />
+          <div className="pt-3">
+            <Filter.List
+              filters={filters}
+              activeFilters={activeFilters}
+              onSelect={onSelect}
+              onRemove={onRemove}
+              onRemoveAll={onRemoveAll}
+            />
+          </div>
         )}
       </AnimatedSizeContainer>
     </div>
diff --git a/apps/web/app/(ee)/partners.dub.co/(dashboard)/programs/[programSlug]/(enrolled)/bounties/page-client.tsx b/apps/web/app/(ee)/partners.dub.co/(dashboard)/programs/[programSlug]/(enrolled)/bounties/page-client.tsx
index 00f7da6fe7e..dc8c8842f49 100644
--- a/apps/web/app/(ee)/partners.dub.co/(dashboard)/programs/[programSlug]/(enrolled)/bounties/page-client.tsx
+++ b/apps/web/app/(ee)/partners.dub.co/(dashboard)/programs/[programSlug]/(enrolled)/bounties/page-client.tsx
@@ -42,7 +42,7 @@ export function BountiesPageClient() {
 
   return (
     <PageWidthWrapper className="pb-10">
-      <div className="mb-6 grid grid-cols-2 gap-2">
+      <div className="mb-4 grid grid-cols-2 gap-2">
         {tabs.map((tab) => {
           const isActive = activeTab === tab.id;
 
@@ -74,7 +74,7 @@ export function BountiesPageClient() {
       </div>
 
       {filteredBounties?.length !== 0 || isLoading ? (
-        <div className="grid grid-cols-1 gap-6 md:grid-cols-2 xl:grid-cols-3">
+        <div className="grid grid-cols-1 gap-5 md:grid-cols-2 xl:grid-cols-3">
           {filteredBounties?.length
             ? filteredBounties?.map((bounty) => (
                 <PartnerBountyCard
diff --git a/apps/web/app/(ee)/partners.dub.co/(dashboard)/programs/[programSlug]/(enrolled)/customers/(index)/page-client.tsx b/apps/web/app/(ee)/partners.dub.co/(dashboard)/programs/[programSlug]/(enrolled)/customers/(index)/page-client.tsx
index 313ba5ff31b..5eec060235e 100644
--- a/apps/web/app/(ee)/partners.dub.co/(dashboard)/programs/[programSlug]/(enrolled)/customers/(index)/page-client.tsx
+++ b/apps/web/app/(ee)/partners.dub.co/(dashboard)/programs/[programSlug]/(enrolled)/customers/(index)/page-client.tsx
@@ -269,7 +269,7 @@ export function ProgramCustomersPageClient() {
   });
 
   return (
-    <div className="flex flex-col gap-3">
+    <div className="flex flex-col gap-4">
       <div>
         <div className="flex flex-col gap-3 md:flex-row md:items-center md:justify-between">
           <Filter.Select
diff --git a/apps/web/app/(ee)/partners.dub.co/(dashboard)/programs/[programSlug]/(enrolled)/earnings/earnings-composite-chart.tsx b/apps/web/app/(ee)/partners.dub.co/(dashboard)/programs/[programSlug]/(enrolled)/earnings/earnings-composite-chart.tsx
index 4f0e1444496..697c378a652 100644
--- a/apps/web/app/(ee)/partners.dub.co/(dashboard)/programs/[programSlug]/(enrolled)/earnings/earnings-composite-chart.tsx
+++ b/apps/web/app/(ee)/partners.dub.co/(dashboard)/programs/[programSlug]/(enrolled)/earnings/earnings-composite-chart.tsx
@@ -116,7 +116,7 @@ export function EarningsCompositeChart() {
   );
 
   return (
-    <div className="flex flex-col gap-6">
+    <div className="flex flex-col gap-4">
       <EarningsTableControls />
       <div className="rounded-lg border border-neutral-200 p-6">
         <div className="flex w-full items-center justify-between">
diff --git a/apps/web/app/(ee)/partners.dub.co/(dashboard)/programs/[programSlug]/(enrolled)/earnings/page.tsx b/apps/web/app/(ee)/partners.dub.co/(dashboard)/programs/[programSlug]/(enrolled)/earnings/page.tsx
index e77514f54c2..bbbd7b6f1ee 100644
--- a/apps/web/app/(ee)/partners.dub.co/(dashboard)/programs/[programSlug]/(enrolled)/earnings/page.tsx
+++ b/apps/web/app/(ee)/partners.dub.co/(dashboard)/programs/[programSlug]/(enrolled)/earnings/page.tsx
@@ -6,7 +6,7 @@ import { EarningsTablePartner } from "./earnings-table";
 export default function ProgramEarning() {
   return (
     <PageContent title="Earnings">
-      <PageWidthWrapper className="flex flex-col gap-6 pb-10">
+      <PageWidthWrapper className="flex flex-col gap-5 pb-10">
         <EarningsCompositeChart />
         <EarningsTablePartner />
       </PageWidthWrapper>
diff --git a/apps/web/app/(ee)/partners.dub.co/(dashboard)/programs/[programSlug]/(enrolled)/links/page-client.tsx b/apps/web/app/(ee)/partners.dub.co/(dashboard)/programs/[programSlug]/(enrolled)/links/page-client.tsx
index 81ab4ab4204..ea4aea10f68 100644
--- a/apps/web/app/(ee)/partners.dub.co/(dashboard)/programs/[programSlug]/(enrolled)/links/page-client.tsx
+++ b/apps/web/app/(ee)/partners.dub.co/(dashboard)/programs/[programSlug]/(enrolled)/links/page-client.tsx
@@ -86,7 +86,7 @@ export function ProgramLinksPageClient() {
     !showDetailedAnalytics || displayOption === "cards";
 
   return (
-    <div className="flex flex-col gap-5">
+    <div className="flex flex-col gap-4">
       <PartnerLinkModal />
       <div className="flex items-center justify-between">
         <SimpleDateRangePicker
@@ -100,7 +100,9 @@ export function ProgramLinksPageClient() {
         <div className="flex items-center gap-3">
           {!!showDetailedAnalytics && (
             <ToggleGroup
-              className="rounded-lg"
+              className="h-10 rounded-lg px-1"
+              optionClassName="px-2 rounded-md"
+              indicatorClassName="border-0 ring-1 ring-inset ring-neutral-200"
               options={[
                 {
                   value: "full",
diff --git a/apps/web/app/(ee)/partners.dub.co/(dashboard)/programs/[programSlug]/(enrolled)/page-client.tsx b/apps/web/app/(ee)/partners.dub.co/(dashboard)/programs/[programSlug]/(enrolled)/page-client.tsx
index 43a757897b2..d94a7cc36d7 100644
--- a/apps/web/app/(ee)/partners.dub.co/(dashboard)/programs/[programSlug]/(enrolled)/page-client.tsx
+++ b/apps/web/app/(ee)/partners.dub.co/(dashboard)/programs/[programSlug]/(enrolled)/page-client.tsx
@@ -123,7 +123,7 @@ export default function ProgramPageClient() {
             >
               <div
                 className={cn(
-                  "relative z-0 mb-4 flex flex-col overflow-hidden rounded-xl border border-neutral-200 p-4 sm:mb-8 md:p-6",
+                  "relative z-0 mb-4 flex flex-col overflow-hidden rounded-xl border border-neutral-200 p-4 sm:mb-5 md:p-6",
                   isDeactivated && "opacity-80",
                 )}
               >
@@ -247,7 +247,7 @@ export default function ProgramPageClient() {
         }}
       >
         <ChartTooltipSync>
-          <div className="grid grid-cols-1 gap-6 lg:grid-cols-3">
+          <div className="grid grid-cols-1 gap-5 lg:grid-cols-3">
             <div className="group rounded-xl border border-neutral-200 p-5 pb-3 pt-4 lg:col-span-2">
               <EarningsChart />
             </div>
@@ -270,7 +270,7 @@ export default function ProgramPageClient() {
             </NumberFlowGroup>
           </div>
         </ChartTooltipSync>
-        <div className="mt-6">
+        <div className="mt-5">
           <div className="flex items-center justify-between">
             <h2 className="text-base font-semibold text-neutral-900">
               Recent earnings
diff --git a/apps/web/app/(ee)/partners.dub.co/(dashboard)/programs/marketplace/page-client.tsx b/apps/web/app/(ee)/partners.dub.co/(dashboard)/programs/marketplace/page-client.tsx
index 9cb484a2c51..4eba39b79cf 100644
--- a/apps/web/app/(ee)/partners.dub.co/(dashboard)/programs/marketplace/page-client.tsx
+++ b/apps/web/app/(ee)/partners.dub.co/(dashboard)/programs/marketplace/page-client.tsx
@@ -48,7 +48,7 @@ export function ProgramMarketplacePageClient() {
   } = useProgramNetworkFilters();
 
   return (
-    <div className="flex flex-col gap-6">
+    <div className="flex flex-col gap-4">
       <FeaturedPrograms />
       <div>
         <div className="xs:flex-row xs:items-center flex flex-col justify-between gap-4">
diff --git a/apps/web/app/app.dub.co/(dashboard)/[slug]/(ee)/program/analytics/page-client.tsx b/apps/web/app/app.dub.co/(dashboard)/[slug]/(ee)/program/analytics/page-client.tsx
index 4f883e37123..735c5dfaa94 100644
--- a/apps/web/app/app.dub.co/(dashboard)/[slug]/(ee)/program/analytics/page-client.tsx
+++ b/apps/web/app/app.dub.co/(dashboard)/[slug]/(ee)/program/analytics/page-client.tsx
@@ -107,7 +107,7 @@ export function ProgramAnalyticsPageClient() {
   );
 
   return (
-    <div className="flex flex-col gap-3 pb-12">
+    <div className="flex flex-col gap-4 pb-12">
       <div>
         <div className="flex w-full flex-col items-center justify-between gap-2 md:flex-row">
           <div className="flex w-full flex-col items-center gap-2 min-[550px]:flex-row">
diff --git a/apps/web/app/app.dub.co/(dashboard)/[slug]/(ee)/program/commissions/page.tsx b/apps/web/app/app.dub.co/(dashboard)/[slug]/(ee)/program/commissions/page.tsx
index 37727d02d10..42064dc29b6 100644
--- a/apps/web/app/app.dub.co/(dashboard)/[slug]/(ee)/program/commissions/page.tsx
+++ b/apps/web/app/app.dub.co/(dashboard)/[slug]/(ee)/program/commissions/page.tsx
@@ -25,7 +25,7 @@ export default function ProgramCommissions() {
     >
       <PageWidthWrapper>
         <CommissionsStats />
-        <div className="mt-6">
+        <div className="mt-4">
           <CommissionsTable />
         </div>
       </PageWidthWrapper>
diff --git a/apps/web/app/app.dub.co/(dashboard)/[slug]/(ee)/program/fraud/fraud-group-table.tsx b/apps/web/app/app.dub.co/(dashboard)/[slug]/(ee)/program/fraud/fraud-group-table.tsx
index 3fa9f5f9b9c..b4989b29f29 100644
--- a/apps/web/app/app.dub.co/(dashboard)/[slug]/(ee)/program/fraud/fraud-group-table.tsx
+++ b/apps/web/app/app.dub.co/(dashboard)/[slug]/(ee)/program/fraud/fraud-group-table.tsx
@@ -312,7 +312,7 @@ export function FraudGroupTable() {
   }, [fraudGroups, detailsSheetState.groupId]);
 
   return (
-    <div className="flex flex-col gap-3">
+    <div className="flex flex-col gap-4">
       <BulkBanPartnersModal />
       <BulkResolveFraudGroupsModal />
       {detailsSheetState.groupId && currentFraudGroup && (
diff --git a/apps/web/app/app.dub.co/(dashboard)/[slug]/(ee)/program/groups/groups-table.tsx b/apps/web/app/app.dub.co/(dashboard)/[slug]/(ee)/program/groups/groups-table.tsx
index f61c61c09f0..4b3f03259ce 100644
--- a/apps/web/app/app.dub.co/(dashboard)/[slug]/(ee)/program/groups/groups-table.tsx
+++ b/apps/web/app/app.dub.co/(dashboard)/[slug]/(ee)/program/groups/groups-table.tsx
@@ -214,7 +214,7 @@ export function GroupsTable() {
   });
 
   return (
-    <div className="flex flex-col gap-6">
+    <div className="flex flex-col gap-4">
       <div className="flex flex-col gap-3 md:flex-row md:items-center md:justify-between">
         <SearchBoxPersisted
           placeholder="Search by name"
diff --git a/apps/web/app/app.dub.co/(dashboard)/[slug]/(ee)/program/network/page-client.tsx b/apps/web/app/app.dub.co/(dashboard)/[slug]/(ee)/program/network/page-client.tsx
index 9cd7d4d04b0..3c93b584be6 100644
--- a/apps/web/app/app.dub.co/(dashboard)/[slug]/(ee)/program/network/page-client.tsx
+++ b/apps/web/app/app.dub.co/(dashboard)/[slug]/(ee)/program/network/page-client.tsx
@@ -120,7 +120,7 @@ export function ProgramPartnerNetworkPageClient({
   }, [partners, detailsSheetState.partnerId]);
 
   return (
-    <div className="flex flex-col gap-6">
+    <div className="flex flex-col">
       {detailsSheetState.partnerId && currentPartner && (
         <NetworkPartnerSheet
           isOpen={detailsSheetState.open}
@@ -148,8 +148,9 @@ export function ProgramPartnerNetworkPageClient({
           }
         />
       )}
+
       {variant !== "ignored" && (
-        <div className="grid grid-cols-3 gap-2">
+        <div className="mt-px grid grid-cols-3 gap-2">
           {tabs.map((tab) => {
             const isActive = status === tab.id;
 
@@ -187,7 +188,7 @@ export function ProgramPartnerNetworkPageClient({
       )}
 
       {status === "discover" && (
-        <div>
+        <div className="mt-[17px]">
           <div className="xs:flex-row xs:items-center flex flex-col gap-4">
             <Filter.Select
               className="h-9 w-full rounded-lg md:w-fit"
@@ -212,19 +213,17 @@ export function ProgramPartnerNetworkPageClient({
             </label>
           </div>
           <AnimatedSizeContainer height>
-            <div>
-              {activeFilters.length > 0 && (
-                <div className="pt-3">
-                  <Filter.List
-                    filters={filters}
-                    activeFilters={activeFilters}
-                    onSelect={onSelect}
-                    onRemove={onRemove}
-                    onRemoveAll={onRemoveAll}
-                  />
-                </div>
-              )}
-            </div>
+            {activeFilters.length > 0 && (
+              <div className="pt-4">
+                <Filter.List
+                  filters={filters}
+                  activeFilters={activeFilters}
+                  onSelect={onSelect}
+                  onRemove={onRemove}
+                  onRemoveAll={onRemoveAll}
+                />
+              </div>
+            )}
           </AnimatedSizeContainer>
         </div>
       )}
@@ -234,7 +233,7 @@ export function ProgramPartnerNetworkPageClient({
           Failed to load partners
         </div>
       ) : !partners || partners?.length ? (
-        <div>
+        <div className="mt-4">
           <div
             className={cn(
               "@5xl/page:grid-cols-4 @3xl/page:grid-cols-3 @xl/page:grid-cols-2 grid grid-cols-1 gap-4 transition-opacity lg:gap-6",
diff --git a/apps/web/app/app.dub.co/(dashboard)/[slug]/(ee)/program/page-client.tsx b/apps/web/app/app.dub.co/(dashboard)/[slug]/(ee)/program/page-client.tsx
index 16cedbe0586..295903754bf 100644
--- a/apps/web/app/app.dub.co/(dashboard)/[slug]/(ee)/program/page-client.tsx
+++ b/apps/web/app/app.dub.co/(dashboard)/[slug]/(ee)/program/page-client.tsx
@@ -70,7 +70,7 @@ export default function ProgramOverviewPageClient() {
   );
 
   return (
-    <div className="@container flex flex-col gap-6">
+    <div className="@container flex flex-col gap-4">
       <SimpleDateRangePicker align="start" className="w-fit" />
       <AnalyticsContext.Provider
         value={{
diff --git a/apps/web/app/app.dub.co/(dashboard)/[slug]/(ee)/program/partners/applications/page-client.tsx b/apps/web/app/app.dub.co/(dashboard)/[slug]/(ee)/program/partners/applications/page-client.tsx
index e6ee1c2aa63..ed51b35c2dd 100644
--- a/apps/web/app/app.dub.co/(dashboard)/[slug]/(ee)/program/partners/applications/page-client.tsx
+++ b/apps/web/app/app.dub.co/(dashboard)/[slug]/(ee)/program/partners/applications/page-client.tsx
@@ -425,7 +425,7 @@ export function ProgramPartnersApplicationsPageClient() {
   }, [partners, detailsSheetState.partnerId]);
 
   return (
-    <div className="flex flex-col gap-6">
+    <div className="flex flex-col gap-4">
       {detailsSheetState.partnerId && currentPartner && (
         <PartnerApplicationSheet
           isOpen={detailsSheetState.open}
diff --git a/apps/web/app/app.dub.co/(dashboard)/[slug]/(ee)/program/partners/partners-table.tsx b/apps/web/app/app.dub.co/(dashboard)/[slug]/(ee)/program/partners/partners-table.tsx
index 469491037d1..fcc68ae11b1 100644
--- a/apps/web/app/app.dub.co/(dashboard)/[slug]/(ee)/program/partners/partners-table.tsx
+++ b/apps/web/app/app.dub.co/(dashboard)/[slug]/(ee)/program/partners/partners-table.tsx
@@ -560,7 +560,7 @@ export function PartnersTable() {
   });
 
   return (
-    <div className="flex flex-col gap-6">
+    <div className="flex flex-col gap-4">
       <ChangeGroupModal />
       <BulkArchivePartnersModal />
       <BulkDeactivatePartnersModal />
diff --git a/apps/web/app/app.dub.co/(dashboard)/[slug]/(ee)/program/payouts/page-client.tsx b/apps/web/app/app.dub.co/(dashboard)/[slug]/(ee)/program/payouts/page-client.tsx
index a1a4d411f59..2ca1ec86a8e 100644
--- a/apps/web/app/app.dub.co/(dashboard)/[slug]/(ee)/program/payouts/page-client.tsx
+++ b/apps/web/app/app.dub.co/(dashboard)/[slug]/(ee)/program/payouts/page-client.tsx
@@ -7,7 +7,7 @@ export function ProgramPayoutsPageClient() {
   return (
     <>
       <PayoutStats />
-      <div className="my-6">
+      <div className="my-4">
         <PayoutTable />
       </div>
     </>
diff --git a/apps/web/app/app.dub.co/(dashboard)/[slug]/(ee)/program/payouts/payout-table.tsx b/apps/web/app/app.dub.co/(dashboard)/[slug]/(ee)/program/payouts/payout-table.tsx
index e6dc966ceb7..ccc6969d995 100644
--- a/apps/web/app/app.dub.co/(dashboard)/[slug]/(ee)/program/payouts/payout-table.tsx
+++ b/apps/web/app/app.dub.co/(dashboard)/[slug]/(ee)/program/payouts/payout-table.tsx
@@ -343,7 +343,7 @@ export function PayoutTable() {
   });
 
   return (
-    <div className="flex flex-col gap-3">
+    <div className="flex flex-col gap-4">
       <PayoutFilters />
       {payouts?.length !== 0 ? (
         <Table {...tableProps} table={table} />
diff --git a/apps/web/app/app.dub.co/(dashboard)/[slug]/links/folders/page-client.tsx b/apps/web/app/app.dub.co/(dashboard)/[slug]/links/folders/page-client.tsx
index a0a33f9609c..9880362fd8a 100644
--- a/apps/web/app/app.dub.co/(dashboard)/[slug]/links/folders/page-client.tsx
+++ b/apps/web/app/app.dub.co/(dashboard)/[slug]/links/folders/page-client.tsx
@@ -41,7 +41,7 @@ export const FoldersPageClient = () => {
 
   return (
     <div className="grid grid-cols-1 gap-4">
-      <div className="grid gap-5">
+      <div className="grid gap-4">
         <div className="flex w-full flex-wrap items-center justify-between gap-3 sm:w-auto">
           <div className="w-full md:w-56 lg:w-64">
             <SearchBoxPersisted
diff --git a/apps/web/app/app.dub.co/(dashboard)/[slug]/links/page-client.tsx b/apps/web/app/app.dub.co/(dashboard)/[slug]/links/page-client.tsx
index 11f233a9256..ffcdf055b06 100644
--- a/apps/web/app/app.dub.co/(dashboard)/[slug]/links/page-client.tsx
+++ b/apps/web/app/app.dub.co/(dashboard)/[slug]/links/page-client.tsx
@@ -149,7 +149,7 @@ function WorkspaceLinks() {
       <LinkBuilder />
       <AddEditTagModal />
       <div className="flex w-full items-center">
-        <PageWidthWrapper className="flex flex-col gap-y-3">
+        <PageWidthWrapper className="flex flex-col">
           <div className="flex flex-wrap items-center justify-between gap-2">
             <div className="flex w-full grow gap-2 md:w-auto">
               {!workspace.isMegaWorkspace && (
@@ -243,18 +243,22 @@ function WorkspaceLinks() {
               )}
             </div>
           </div>
-          <Filter.List
-            filters={filters}
-            activeFilters={activeFilters}
-            onSelect={onSelect}
-            onRemove={onRemove}
-            onRemoveFilter={onRemoveFilter}
-            onRemoveAll={onRemoveAll}
-          />
+          {activeFilters.length > 0 && (
+            <div className="mt-3">
+              <Filter.List
+                filters={filters}
+                activeFilters={activeFilters}
+                onSelect={onSelect}
+                onRemove={onRemove}
+                onRemoveFilter={onRemoveFilter}
+                onRemoveAll={onRemoveAll}
+              />
+            </div>
+          )}
         </PageWidthWrapper>
       </div>
 
-      <div className="mt-3">
+      <div className="mt-4">
         <LinksContainer
           CreateLinkButton={canCreateLinks ? CreateLinkButton : () => <></>}
         />
@@ -389,7 +393,7 @@ const MoreLinkOptions = () => {
         <Button
           onClick={() => setOpenPopover(!openPopover)}
           variant="secondary"
-          className="w-auto px-1.5"
+          className="w-auto px-2"
           icon={<ThreeDots className="h-5 w-5 text-neutral-500" />}
         />
       </Popover>
diff --git a/apps/web/app/app.dub.co/(dashboard)/[slug]/links/utm/page-client.tsx b/apps/web/app/app.dub.co/(dashboard)/[slug]/links/utm/page-client.tsx
index 29577557112..df23b25a9fc 100644
--- a/apps/web/app/app.dub.co/(dashboard)/[slug]/links/utm/page-client.tsx
+++ b/apps/web/app/app.dub.co/(dashboard)/[slug]/links/utm/page-client.tsx
@@ -57,7 +57,6 @@ export default function WorkspaceUtmTemplatesClient() {
         </TemplatesListContext.Provider>
       ) : (
         <AnimatedEmptyState
-          className="mt-6"
           title="No UTM Templates Found"
           description="Create shared templates to streamline UTM campaign management across your team"
           cardContent={
diff --git a/apps/web/ui/analytics/events/index.tsx b/apps/web/ui/analytics/events/index.tsx
index c078af30350..c89b8a493cd 100644
--- a/apps/web/ui/analytics/events/index.tsx
+++ b/apps/web/ui/analytics/events/index.tsx
@@ -27,7 +27,7 @@ export default function AnalyticsEvents({
           {({ dashboardProps }) => (
             <div
               className={cn(
-                "mx-auto flex max-w-screen-xl flex-col gap-3 px-3 lg:px-10",
+                "mx-auto flex max-w-screen-xl flex-col gap-4 px-3 lg:px-10",
                 // TODO: [PageContent] Remove once all pages are migrated to the new PageContent
                 !dashboardProps && !adminPage && "lg:px-6",
               )}
diff --git a/apps/web/ui/analytics/toggle.tsx b/apps/web/ui/analytics/toggle.tsx
index 579fbb619b5..442dd4302aa 100644
--- a/apps/web/ui/analytics/toggle.tsx
+++ b/apps/web/ui/analytics/toggle.tsx
@@ -75,6 +75,8 @@ export function AnalyticsToggle({
     activeFiltersWithStreaming,
   } = useAnalyticsFilters({ partnerPage, dashboardProps });
 
+  const hasActiveFilters = activeFiltersWithStreaming.length > 0;
+
   const filterSelect = (
     <Filter.Select
       className="w-full md:w-fit"
@@ -173,6 +175,7 @@ export function AnalyticsToggle({
           "sticky top-14 z-10 bg-neutral-50": dashboardProps,
           "sticky top-16 z-10 bg-neutral-50": adminPage,
           "shadow-md": scrolled && dashboardProps,
+          "pb-4 md:pb-4": !hasActiveFilters,
         })}
       >
         <div
@@ -280,29 +283,26 @@ export function AnalyticsToggle({
         </div>
       </div>
 
-      <div
-        className={cn(
-          "mx-auto w-full max-w-screen-xl px-3 lg:px-10",
-          isAppPage && "lg:px-6",
-        )}
-      >
-        <Filter.List
-          filters={filters}
-          activeFilters={activeFiltersWithStreaming}
-          onSelect={onSelect}
-          onRemove={onRemove}
-          onRemoveFilter={onRemoveFilter}
-          onRemoveAll={onRemoveAll}
-          onToggleOperator={onToggleOperator}
-          isAdvancedFilter
-        />
+      {hasActiveFilters && (
         <div
           className={cn(
-            "transition-[height] duration-[300ms]",
-            streaming || activeFilters.length ? "h-3" : "h-0",
+            "mx-auto w-full max-w-screen-xl px-3 lg:px-10",
+            isAppPage && "lg:px-6",
           )}
-        />
-      </div>
+        >
+          <Filter.List
+            filters={filters}
+            activeFilters={activeFiltersWithStreaming}
+            onSelect={onSelect}
+            onRemove={onRemove}
+            onRemoveFilter={onRemoveFilter}
+            onRemoveAll={onRemoveAll}
+            onToggleOperator={onToggleOperator}
+            isAdvancedFilter
+          />
+          <div className="h-4 transition-[height] duration-[300ms]" />
+        </div>
+      )}
     </>
   );
 }
diff --git a/apps/web/ui/layout/page-content/index.tsx b/apps/web/ui/layout/page-content/index.tsx
index 4cd98d26abc..a5fdcbe35e0 100644
--- a/apps/web/ui/layout/page-content/index.tsx
+++ b/apps/web/ui/layout/page-content/index.tsx
@@ -28,7 +28,7 @@ export function PageContent({
       <PageContentHeader {...headerProps} />
       <div
         className={cn(
-          "flex-1 rounded-t-[inherit] bg-white pt-3 lg:pt-6",
+          "flex-1 rounded-t-[inherit] bg-white pt-3 lg:pt-5",
           contentWrapperClassName,
         )}
       >
diff --git a/apps/web/ui/layout/page-content/page-content-with-side-panel.tsx b/apps/web/ui/layout/page-content/page-content-with-side-panel.tsx
index d8bdea41a7c..c22d70d5515 100644
--- a/apps/web/ui/layout/page-content/page-content-with-side-panel.tsx
+++ b/apps/web/ui/layout/page-content/page-content-with-side-panel.tsx
@@ -77,7 +77,7 @@ export function PageContentWithSidePanel({
           />
           <div
             className={cn(
-              "grow rounded-t-[inherit] bg-white pt-3 lg:pt-6",
+              "grow rounded-t-[inherit] bg-white pt-3 lg:pt-5",
               individualScrolling && "scrollbar-hide min-h-0 overflow-y-auto",
               contentWrapperClassName,
             )}
diff --git a/apps/web/ui/links/links-container.tsx b/apps/web/ui/links/links-container.tsx
index 0a3fe32f640..e24ce1bc3bd 100644
--- a/apps/web/ui/links/links-container.tsx
+++ b/apps/web/ui/links/links-container.tsx
@@ -133,7 +133,7 @@ function LinksList({
             title={isFiltered ? "No links found" : "No links yet"}
             description={
               isFiltered
-                ? "Bummer! There are no links that match your filters. Adjust your filters to yield more results."
+                ? "There are no links that match your filters. Adjust your filters to yield more results."
                 : "Start creating short links for your marketing campaigns, referral programs, and more."
             }
             cardContent={
diff --git a/apps/web/ui/partners/program-marketplace/program-marketplace-banner.tsx b/apps/web/ui/partners/program-marketplace/program-marketplace-banner.tsx
index ffb454c3754..3f0e4fa7e6e 100644
--- a/apps/web/ui/partners/program-marketplace/program-marketplace-banner.tsx
+++ b/apps/web/ui/partners/program-marketplace/program-marketplace-banner.tsx
@@ -25,7 +25,7 @@ export function ProgramMarketplaceBanner() {
         >
           <div
             className={cn(
-              "border-border-subtle relative mb-4 gap-x-2 overflow-hidden rounded-xl border bg-white sm:h-12 lg:mb-6",
+              "border-border-subtle relative mb-4 gap-x-2 overflow-hidden rounded-xl border bg-white sm:h-12 lg:mb-4",
             )}
           >
             <div className="absolute inset-0">
diff --git a/apps/web/ui/shared/search-box.tsx b/apps/web/ui/shared/search-box.tsx
index 39e12742079..fdf5b7cd6d2 100644
--- a/apps/web/ui/shared/search-box.tsx
+++ b/apps/web/ui/shared/search-box.tsx
@@ -81,7 +81,7 @@ export const SearchBox = forwardRef(
           ref={inputRef}
           type="text"
           className={cn(
-            "peer w-full rounded-md border border-neutral-200 px-10 text-black outline-none placeholder:text-neutral-400 sm:text-sm",
+            "peer w-full rounded-lg border border-neutral-200 px-10 text-black outline-none placeholder:text-neutral-400 sm:text-sm",
             "transition-all focus:border-neutral-500 focus:ring-4 focus:ring-neutral-200",
             inputClassName,
           )}
diff --git a/packages/tailwind-config/tailwind.config.ts b/packages/tailwind-config/tailwind.config.ts
index 86985e1d8c8..d6c88520643 100644
--- a/packages/tailwind-config/tailwind.config.ts
+++ b/packages/tailwind-config/tailwind.config.ts
@@ -256,7 +256,7 @@ const config: Config = {
         "content-error": "rgb(var(--content-error, 220 38 38) / <alpha-value>)",
       },
       dropShadow: {
-        "card-hover": ["0 8px 12px #222A350d", "0 32px 80px #2f30370f"],
+        "card-hover": ["0 2px 4px #222A350d"],
       },
     },
   },
diff --git a/packages/ui/src/button.tsx b/packages/ui/src/button.tsx
index 7be3b2864b5..18836671991 100644
--- a/packages/ui/src/button.tsx
+++ b/packages/ui/src/button.tsx
@@ -105,7 +105,7 @@ const Button = forwardRef<HTMLButtonElement, ButtonProps>(
         // if onClick is passed, it's a "button" type, otherwise it's being used in a form, hence "submit"
         type={props.onClick ? "button" : "submit"}
         className={cn(
-          "group flex h-10 w-full items-center justify-center gap-2 whitespace-nowrap rounded-md border px-4 text-sm",
+          "group flex h-10 w-full items-center justify-center gap-2 whitespace-nowrap rounded-lg border px-3 text-sm",
           props.disabled || loading
             ? "border-border-subtle bg-bg-subtle text-content-subtle cursor-not-allowed outline-none"
             : buttonVariants({ variant }),
diff --git a/packages/ui/src/date-picker/trigger.tsx b/packages/ui/src/date-picker/trigger.tsx
index e688d6760cf..7322b1a75ac 100644
--- a/packages/ui/src/date-picker/trigger.tsx
+++ b/packages/ui/src/date-picker/trigger.tsx
@@ -5,7 +5,7 @@ import { ComponentProps, forwardRef } from "react";
 
 const triggerStyles = cva(
   [
-    "group peer flex appearance-none items-center gap-x-2 truncate rounded-md border px-3 h-10 outline-none transition-all text-sm",
+    "group peer flex appearance-none items-center gap-x-2 truncate rounded-lg border px-3 h-10 outline-none transition-all text-sm",
     "bg-white border-neutral-200 text-neutral-900 placeholder-neutral-400 transition-all",
     "cursor-pointer disabled:cursor-not-allowed",
     "disabled:bg-neutral-100 disabled:text-neutral-400",
diff --git a/packages/ui/src/filter/filter-list.tsx b/packages/ui/src/filter/filter-list.tsx
index 70a8233e190..9ef5f552a1d 100644
--- a/packages/ui/src/filter/filter-list.tsx
+++ b/packages/ui/src/filter/filter-list.tsx
@@ -248,7 +248,7 @@ export function FilterList({
           <button
             type="button"
             className={cn(
-              "group mt-px flex items-center gap-2 whitespace-nowrap rounded-lg border border-transparent px-3 py-2 text-sm text-neutral-500 ring-inset ring-neutral-500",
+              "group mt-px flex h-[38px] items-center gap-2 whitespace-nowrap rounded-lg border border-transparent px-3 py-2 text-sm text-neutral-500 ring-inset ring-neutral-500",
               "transition-[color,border-color,background-color,transform] duration-150 ease-out motion-reduce:transition-none",
               "hover:border-neutral-200 hover:bg-white hover:text-black [@media(hover:none)]:hover:border-transparent [@media(hover:none)]:hover:bg-transparent",
               "active:scale-[0.98] motion-reduce:active:scale-100",
@@ -443,7 +443,7 @@ function OperatorFilterPill({
     <motion.div
       initial={{ opacity: 0, y: 4 }}
       animate={{ opacity: 1, y: 0 }}
-      className="flex items-center divide-x rounded-md border border-neutral-200 bg-white text-sm text-black"
+      className="flex items-center divide-x rounded-lg border border-neutral-200 bg-white text-sm text-black"
     >
       <div className="flex items-center gap-2.5 px-3 py-2">
         <span className="shrink-0 text-neutral-600">
@@ -686,7 +686,7 @@ function OperatorFilterPill({
       <button
         type="button"
         className={cn(
-          "h-full rounded-r-md p-2 text-neutral-500 ring-inset ring-neutral-500",
+          "h-full rounded-r-lg p-2 text-neutral-500 ring-inset ring-neutral-500",
           "transition-[color,background-color,transform] duration-150 ease-out motion-reduce:transition-none",
           "hover:bg-neutral-100 hover:text-neutral-800 [@media(hover:none)]:hover:bg-transparent",
           "active:scale-[0.97] motion-reduce:active:scale-100",
diff --git a/packages/ui/src/filter/filter-select.tsx b/packages/ui/src/filter/filter-select.tsx
index 7a279230385..7e988bf899b 100644
--- a/packages/ui/src/filter/filter-select.tsx
+++ b/packages/ui/src/filter/filter-select.tsx
@@ -395,7 +395,7 @@ export function FilterSelect({
       <button
         type="button"
         className={cn(
-          "group flex h-10 cursor-pointer appearance-none items-center gap-x-2 truncate rounded-md border px-3 text-sm outline-none",
+          "group flex h-10 cursor-pointer appearance-none items-center gap-x-2 truncate rounded-lg border px-3 text-sm outline-none",
           "transition-[color,border-color,box-shadow] duration-150 ease-out motion-reduce:transition-none",
           "border-neutral-200 bg-white text-neutral-900 placeholder-neutral-400",
           "focus-visible:border-neutral-500 data-[state=open]:border-neutral-500 data-[state=open]:ring-4 data-[state=open]:ring-neutral-200",

From 6fd111b804ace890fca40426b63ae2df2c2a94ad Mon Sep 17 00:00:00 2001
From: Steven Tey <stevensteel97@gmail.com>
Date: Sat, 11 Apr 2026 17:13:15 -0700
Subject: [PATCH 2/2] Only `remap-default-links`/`discount-codes` for
 non-`pending` partners (#3738)

---
 apps/web/lib/api/groups/move-partners-to-group.ts | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/apps/web/lib/api/groups/move-partners-to-group.ts b/apps/web/lib/api/groups/move-partners-to-group.ts
index efc7a8ddc63..9adb02be231 100644
--- a/apps/web/lib/api/groups/move-partners-to-group.ts
+++ b/apps/web/lib/api/groups/move-partners-to-group.ts
@@ -56,6 +56,7 @@ export async function movePartnersToGroup({
     select: {
       id: true,
       partnerId: true,
+      status: true,
       partnerGroup: {
         select: {
           id: true,
@@ -170,7 +171,10 @@ export async function movePartnersToGroup({
           body: {
             programId,
             groupId: group.id,
-            partnerIds,
+            // skip remap-default-links / remap-discount-codes for pending applications (no links yet)
+            partnerIds: programEnrollments
+              .filter(({ status }) => status !== "pending")
+              .map(({ partnerId }) => partnerId),
             userId: workspaceUserId,
             isGroupDeleted,
           },