feat: add post divider, remove vertical divider (#2212)

* feat: add post borders back * feat: get rid of divider * feat: remove vertical divider
zer0-os · Aug 28, 2024 · fb9db5d · fb9db5d
1 parent e705185
commit fb9db5d
Show file tree

Hide file tree

Showing 4 changed files with 26 additions and 19 deletions.
diff --git a/src/apps/messenger/Main.module.scss b/src/apps/messenger/Main.module.scss
@@ -0,0 +1,5 @@
+.Split {
+  display: flex;
+  width: 100%;
+  gap: 8px;
+}
diff --git a/src/apps/messenger/Main.tsx b/src/apps/messenger/Main.tsx
@@ -9,6 +9,8 @@ import { MessengerFeed } from '../../components/messenger/feed';
 import { DevPanelContainer } from '../../components/dev-panel/container';
 import { FeatureFlag } from '../../components/feature-flag';
 
+import styles from './Main.module.scss';
+
 export interface Properties {
   context: {
     isAuthenticated: boolean;
@@ -31,11 +33,13 @@ export class Container extends React.Component<Properties> {
           <>
             <Sidekick />
 
-            <FeatureFlag featureFlag='enableChannels'>
-              <MessengerFeed />
-            </FeatureFlag>
+            <div className={styles.Split}>
+              <FeatureFlag featureFlag='enableChannels'>
+                <MessengerFeed />
+              </FeatureFlag>
 
-            <MessengerChat />
+              <MessengerChat />
+            </div>
             <Sidekick variant='secondary' />
 
             <FeatureFlag featureFlag='enableDevPanel'>

diff --git a/src/components/messenger/feed/components/posts/styles.module.scss b/src/components/messenger/feed/components/posts/styles.module.scss
@@ -5,5 +5,7 @@
 
   > li {
     padding: 16px 8px;
+
+    border-top: 1px solid rgba(245, 245, 245, 0.12);
   }
 }
diff --git a/src/components/messenger/feed/index.tsx b/src/components/messenger/feed/index.tsx
@@ -74,21 +74,17 @@ export class Container extends React.Component<Properties> {
     }
 
     return (
-      <>
-        <div {...cn('')}>
-          <ScrollbarContainer variant='on-hover'>
-            <CreatePost
-              avatarUrl={this.props.user.data?.profileSummary.profileImage}
-              onSubmit={this.submitPost}
-              isSubmitting={this.isSubmitting}
-            />
-
-            <FeedViewContainer channelId={activeConversationId} />
-          </ScrollbarContainer>
-        </div>
-
-        <div {...cn('divider')} />
-      </>
+      <div {...cn('')}>
+        <ScrollbarContainer variant='on-hover'>
+          <CreatePost
+            avatarUrl={this.props.user.data?.profileSummary.profileImage}
+            onSubmit={this.submitPost}
+            isSubmitting={this.isSubmitting}
+          />
+
+          <FeedViewContainer channelId={activeConversationId} />
+        </ScrollbarContainer>
+      </div>
     );
   }
 }
-Original file line number
+Diff line change
@@ Expand Up / @@ -5,5 +5,7 @@ @@
       > li {
         padding: 16px 8px;
+        border-top: 1px solid rgba(245, 245, 245, 0.12);
       }
     }