From 28c4fa160c844bb0891ae0ae4677b672e971013b Mon Sep 17 00:00:00 2001
From: keyan <keyan.kousha+huumn@gmail.com>
Date: Thu, 11 Jul 2024 16:58:55 -0500
Subject: [PATCH] fix item spacing

---
 components/comment.js                 | 2 +-
 components/comment.module.css         | 3 +--
 components/item.js                    | 4 ++--
 components/item.module.css            | 3 ++-
 components/items.js                   | 2 +-
 components/link-to-context.module.css | 4 ++++
 components/more-footer.js             | 2 +-
 components/nav/desktop/second-bar.js  | 2 +-
 components/recent-header.js           | 2 +-
 components/territory-header.js        | 2 +-
 components/top-header.js              | 2 +-
 11 files changed, 16 insertions(+), 12 deletions(-)

diff --git a/components/comment.js b/components/comment.js
index 7cd079f8..baac8eb0 100644
--- a/components/comment.js
+++ b/components/comment.js
@@ -77,7 +77,7 @@ export function CommentFlat ({ item, rank, siblingComments, ...props }) {
           </div>)
         : <div />}
       <LinkToContext
-        className={siblingComments ? 'py-3' : 'py-2'}
+        className='py-2'
         onClick={e => {
           router.push(href, as)
         }}
diff --git a/components/comment.module.css b/components/comment.module.css
index ccef5d82..14744fb5 100644
--- a/components/comment.module.css
+++ b/components/comment.module.css
@@ -1,12 +1,11 @@
 .item {
     align-items: flex-start;
     margin-bottom: 0 !important;
-    padding-bottom: 0 !important;
+    padding-top: 0 !important;
 }
 
 .upvote {
     margin-top: 9px;
-    margin-left: .25rem;
     margin-right: 0rem;
 }
 
diff --git a/components/item.js b/components/item.js
index f0f830e0..8bddf513 100644
--- a/components/item.js
+++ b/components/item.js
@@ -46,7 +46,7 @@ export function SearchTitle ({ title }) {
 }
 
 export default function Item ({
-  item, rank, belowTitle, right, full, children, siblingComments,
+  item, rank, belowTitle, right, full, children, itemClassName,
   onQuoteReply, pinnable
 }) {
   const titleRef = useRef()
@@ -62,7 +62,7 @@ export default function Item ({
             {rank}
           </div>)
         : <div />}
-      <div className={`${styles.item} ${siblingComments ? 'pt-3' : ''}`}>
+      <div className={classNames(styles.item, itemClassName)}>
         {item.position && (pinnable || !item.subName)
           ? <Pin width={24} height={24} className={styles.pin} />
           : item.meDontLikeSats > item.meSats
diff --git a/components/item.module.css b/components/item.module.css
index a2a13524..c3d191da 100644
--- a/components/item.module.css
+++ b/components/item.module.css
@@ -118,7 +118,7 @@ a.link:visited {
     display: flex;
     justify-content: flex-start;
     min-width: 0;
-    padding-bottom: .5rem;
+    padding-top: .5rem;
 }
 
 .item .companyImage {
@@ -170,6 +170,7 @@ a.link:visited {
 
 .children {
     margin-left: 28px;
+    padding-top: .5rem;
 }
 
 .rank {
diff --git a/components/items.js b/components/items.js
index dce714c7..6a2064c7 100644
--- a/components/items.js
+++ b/components/items.js
@@ -51,7 +51,7 @@ export default function Items ({ ssrData, variables = {}, query, destructureData
     <>
       <div className={styles.grid}>
         {itemsWithPins.filter(filter).map((item, i) => (
-          <ListItem key={item.id} item={item} rank={rank && i + 1} siblingComments={variables.includeComments} pinnable={isHome ? false : pins?.length > 0} />
+          <ListItem key={item.id} item={item} rank={rank && i + 1} itemClassName={variables.includeComments ? 'py-2' : ''} pinnable={isHome ? false : pins?.length > 0} />
         ))}
       </div>
       <Foooter
diff --git a/components/link-to-context.module.css b/components/link-to-context.module.css
index 1fcf9d56..e4954e80 100644
--- a/components/link-to-context.module.css
+++ b/components/link-to-context.module.css
@@ -12,6 +12,10 @@
 
 .linkBoxParent {
     position: relative;
+    margin-left: -0.5rem;
+    padding-left: 0.5rem;
+    margin-right: -0.5rem;
+    padding-right: 0.5rem;
 }
 
 .linkBoxParent > * {
diff --git a/components/more-footer.js b/components/more-footer.js
index 8630425b..9675b03e 100644
--- a/components/more-footer.js
+++ b/components/more-footer.js
@@ -33,7 +33,7 @@ export default function MoreFooter ({ cursor, count, fetchMore, Skeleton, invisi
     )
   }
 
-  return <div className={`d-flex justify-content-center mt-3 mb-1 ${invisible ? 'invisible' : ''}`}><Footer /></div>
+  return <div className={`d-flex justify-content-center mt-4 mb-1 ${invisible ? 'invisible' : ''}`}><Footer /></div>
 }
 
 export function NavigateFooter ({ cursor, count, fetchMore, href, text, invisible, noMoreText = 'NO MORE' }) {
diff --git a/components/nav/desktop/second-bar.js b/components/nav/desktop/second-bar.js
index 8b0395da..4120c306 100644
--- a/components/nav/desktop/second-bar.js
+++ b/components/nav/desktop/second-bar.js
@@ -6,7 +6,7 @@ export default function SecondBar (props) {
   const { prefix, topNavKey, sub } = props
   if (!hasNavSelect(props)) return null
   return (
-    <Navbar className='pt-0 pb-3'>
+    <Navbar className='pt-0 pb-2'>
       <Nav
         className={styles.navbarNav}
         activeKey={topNavKey}
diff --git a/components/recent-header.js b/components/recent-header.js
index b961ea38..23bb5c33 100644
--- a/components/recent-header.js
+++ b/components/recent-header.js
@@ -15,7 +15,7 @@ export default function RecentHeader ({ type, sub }) {
 
   type ||= router.query.type || type || 'posts'
   return (
-    <div className='text-muted fw-bold mt-1 mb-3 d-flex justify-content-start align-items-center'>
+    <div className='text-muted fw-bold my-1 d-flex justify-content-start align-items-center'>
       <Select
         groupClassName='mb-2'
         className='w-auto'
diff --git a/components/territory-header.js b/components/territory-header.js
index eb4b8cea..2bba5d9a 100644
--- a/components/territory-header.js
+++ b/components/territory-header.js
@@ -81,7 +81,7 @@ export default function TerritoryHeader ({ sub }) {
   return (
     <>
       <TerritoryPaymentDue sub={sub} />
-      <div className='mb-3'>
+      <div className='mb-2 mt-1'>
         <div>
           <TerritoryDetails sub={sub}>
             <div className='d-flex my-2 justify-content-end'>
diff --git a/components/top-header.js b/components/top-header.js
index 638cc300..1a4bf8a2 100644
--- a/components/top-header.js
+++ b/components/top-header.js
@@ -46,7 +46,7 @@ export default function TopHeader ({ sub, cat }) {
         initial={{ what, by, when, from: '', to: '' }}
         onSubmit={top}
       >
-        <div className='text-muted fw-bold mt-1 mb-3 d-flex align-items-center flex-wrap'>
+        <div className='text-muted fw-bold my-1 d-flex align-items-center flex-wrap'>
           <div className='text-muted fw-bold mb-2 d-flex align-items-center'>
             <Select
               groupClassName='me-2 mb-0'