update channel details spacing, update grid spacing on mobile

1ifeworld · Feb 22, 2024 · 3bc7ed9 · 3bc7ed9
1 parent 3cd8270
commit 3bc7ed9
Show file tree

Hide file tree

Showing 4 changed files with 4 additions and 4 deletions.
diff --git a/apps/site/app/(base)/layout.tsx b/apps/site/app/(base)/layout.tsx
@@ -13,7 +13,7 @@ export default function BaseLayout({
       <div className="hidden md:block fixed top-[var(--header-height)] z-50 w-full">
         <MarqueeWrapper />
       </div>
-      <Flex className="px-5 pt-[70px] md:pt-[104px]">
+      <Flex className="px-[15px] md:px-5 pt-[57px] md:pt-[104px]">
         <div className="hidden md:w-[19%] md:block">
           <RecentChannels params={params} />
         </div>

diff --git a/apps/site/app/channel/[id]/page.tsx b/apps/site/app/channel/[id]/page.tsx
@@ -33,7 +33,7 @@ export default async function Channel({
       <div className="hidden md:block fixed top-[var(--header-height)] z-50 w-full">
         <MarqueeWrapper />
       </div>
-      <Flex className="px-5 pt-[70px] md:pt-[104px]">
+      <Flex className="px-[15px] md:px-5 pt-[57px] md:pt-[104px]">
         <div className="hidden md:w-[19%] md:block">
           <RecentChannels params={params} />
         </div>

diff --git a/apps/site/components/client/Header.tsx b/apps/site/components/client/Header.tsx
@@ -62,7 +62,7 @@ export function Header() {
     <div className="bg-popover fixed z-50 w-screen">
       {/* Header */}
       <Flex
-        className={`py-[11px] px-5 items-center justify-between border-b border-border ${
+        className={`py-[11px] px-[15px] md:px-5 items-center justify-between border-b border-border ${
           params.index || params.username ? '' : 'md:border-none'
         }`}
       >

diff --git a/apps/site/components/server/channel/ChannelDetails.tsx b/apps/site/components/server/channel/ChannelDetails.tsx
@@ -6,7 +6,7 @@ export async function ChannelDetails({ channel }: { channel: Channel }) {
   const length = channel.adds?.items ? channel.adds?.items.length : 0
 
   return (
-    <Stack className="py-8 md:ml-2">
+    <Stack className="py-8 md:ml-2 gap-y-[3px]">
       {/* Number of items */}
       <Typography className="text-secondary-foreground">
         {pluralize(length, 'item', 'items')}