From cf03fcf3101c65d1c70ef7564341746afa1dfa13 Mon Sep 17 00:00:00 2001
From: Pouria Delfanazari <pdelfan@gmail.com>
Date: Tue, 12 Mar 2024 10:41:47 -0700
Subject: [PATCH] Remove extra borders on list and feed items

---
 src/components/contentDisplay/feedList/FeedListSkeleton.tsx     | 2 +-
 src/components/contentDisplay/lists/ListsSkeleton.tsx           | 2 +-
 src/components/contentDisplay/profileHeader/ProfileHeader.tsx   | 2 +-
 .../contentDisplay/savedFeedList/SavedFeedListSkeleton.tsx      | 2 +-
 src/components/inputs/editor/Editor.tsx                         | 2 +-
 5 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/src/components/contentDisplay/feedList/FeedListSkeleton.tsx b/src/components/contentDisplay/feedList/FeedListSkeleton.tsx
index f1bb7861..77e82efb 100644
--- a/src/components/contentDisplay/feedList/FeedListSkeleton.tsx
+++ b/src/components/contentDisplay/feedList/FeedListSkeleton.tsx
@@ -1,6 +1,6 @@
 function Skeleton() {
   return (
-    <article className="border-skin-base flex flex-col gap-2 border p-3 last:border-b md:first:rounded-t-2xl md:last:rounded-b-2xl odd:[&:not(:last-child)]:border-b-0 even:[&:not(:last-child)]:border-b-0">
+    <article className="border-skin-base flex flex-col gap-2 border border-x-0 p-3 last:border-b md:border-x md:first:rounded-t-2xl md:last:rounded-b-2xl odd:[&:not(:last-child)]:border-b-0 even:[&:not(:last-child)]:border-b-0">
       <div className="flex flex-wrap items-center gap-3">
         <div className="bg-skin-muted h-10 w-10 rounded-lg" />
         <div className="flex flex-col gap-3">
diff --git a/src/components/contentDisplay/lists/ListsSkeleton.tsx b/src/components/contentDisplay/lists/ListsSkeleton.tsx
index ab477ace..8dcc81af 100644
--- a/src/components/contentDisplay/lists/ListsSkeleton.tsx
+++ b/src/components/contentDisplay/lists/ListsSkeleton.tsx
@@ -6,7 +6,7 @@ function Skeleton(props: Props) {
   const { rounded = true } = props;
   return (
     <article
-      className={`border-skin-base flex flex-col gap-2 border p-3 last:border-b ${
+      className={`border-skin-base flex flex-col gap-2 border border-x-0 p-3 last:border-b md:border-x ${
         rounded ? "first:border-t md:first:rounded-t-2xl" : "first:border-t-0"
       } md:last:rounded-b-2xl odd:[&:not(:last-child)]:border-b-0 even:[&:not(:last-child)]:border-b-0`}
     >
diff --git a/src/components/contentDisplay/profileHeader/ProfileHeader.tsx b/src/components/contentDisplay/profileHeader/ProfileHeader.tsx
index 0d5ae351..f5c98b63 100644
--- a/src/components/contentDisplay/profileHeader/ProfileHeader.tsx
+++ b/src/components/contentDisplay/profileHeader/ProfileHeader.tsx
@@ -52,7 +52,7 @@ export default function ProfileHeader(props: Props) {
         <ProfileHeaderSkeleton />
       )}
       {profile && contentFilter && (
-        <section className="md:border-skin-base overflow-hidden border-0 border-y md:rounded-t-2xl md:border-x">
+        <section className="border-skin-base overflow-hidden border-0 border-y md:rounded-t-2xl md:border-x">
           <div className="relative">
             {isBlocked || hasBlockedYou ? (
               <Image
diff --git a/src/components/contentDisplay/savedFeedList/SavedFeedListSkeleton.tsx b/src/components/contentDisplay/savedFeedList/SavedFeedListSkeleton.tsx
index 2c94cd77..674f93c1 100644
--- a/src/components/contentDisplay/savedFeedList/SavedFeedListSkeleton.tsx
+++ b/src/components/contentDisplay/savedFeedList/SavedFeedListSkeleton.tsx
@@ -1,6 +1,6 @@
 function Skeleton() {
   return (
-    <article className="border-skin-base flex animate-pulse items-center justify-between gap-2 border p-3 last:border-b md:first:rounded-t-2xl md:last:rounded-b-2xl odd:[&:not(:last-child)]:border-b-0 even:[&:not(:last-child)]:border-b-0">
+    <article className="border-skin-base flex animate-pulse items-center justify-between gap-2 border border-x-0 p-3 last:border-b md:border-x md:first:rounded-t-2xl md:last:rounded-b-2xl odd:[&:not(:last-child)]:border-b-0 even:[&:not(:last-child)]:border-b-0">
       <div className="flex flex-wrap items-center gap-3">
         <div className="bg-skin-muted h-10 w-10 rounded-lg" />
         <div className="bg-skin-muted h-4 w-32 rounded-full" />
diff --git a/src/components/inputs/editor/Editor.tsx b/src/components/inputs/editor/Editor.tsx
index 0563d18c..5e3aa903 100644
--- a/src/components/inputs/editor/Editor.tsx
+++ b/src/components/inputs/editor/Editor.tsx
@@ -120,7 +120,7 @@ export default function Editor(props: Props) {
   if (!editor) return null;
 
   return (
-    <section className="border-skin-base animate-fade-up animate-duration-200 bg-skin-base md:border-skin-base fixed bottom-0 z-50 h-full w-full overflow-auto rounded-t-3xl p-3 shadow-2xl md:h-fit md:max-h-[80svh] md:border-t">
+    <section className="border-skin-base animate-fade-up animate-duration-200 bg-skin-base fixed bottom-0 z-50 h-full w-full overflow-auto rounded-t-3xl p-3 shadow-2xl md:h-fit md:max-h-[80svh] md:border-t">
       <div className="mx-auto max-w-2xl">
         <TopEditorBar
           onClose={onCancel}