fix: fixed UI issues of discussion for incontext sidebar (#633)

* fix: fixed UI issues of discussion for incontext sidebar

* refactor: added paragon class

* refactor: improved actionBar UI

---------

Co-authored-by: Awais Ansari <awais.ansari63@gmail.com>

Author: sundasnoreen12

src/discussions/discussions-home/DiscussionsHome.jsx

@@ -86,7 +86,7 @@ const DiscussionsHome = () => {
           >
             <div
               className={classNames('d-flex flex-row justify-content-between navbar fixed-top', {
-                'pl-4 pr-3 py-0': enableInContextSidebar,
+                'pl-4 pr-2 py-0': enableInContextSidebar,
               })}
             >
               {!enableInContextSidebar && (

src/discussions/posts/post-actions-bar/PostActionsBar.jsx

@@ -67,15 +67,14 @@ const PostActionsBar = () => {
       )}
       {enableInContextSidebar && (
         <>
-          <div className="border-right border-light-300 mr-3 ml-1.5 my-10px" />
-          <div className="justify-content-center mt-2.5 mx-3px">
+          <div className="border-right border-light-300 mr-2 my-10px" />
+          <div className="d-flex align-items-center justify-content-center">
             <IconButton
               src={Close}
+              size="sm"
               iconAs={Icon}
               onClick={handleCloseInContext}
               alt={intl.formatMessage(messages.close)}
-              iconClassNames="spinner-dimensions"
-              className="spinner-dimensions"
             />
           </div>
         </>

src/discussions/posts/post-actions-bar/actionBar.scss

@@ -1,3 +1,4 @@
 .small-font {
   font-size: .875rem !important;
 }
+

src/index.scss

@@ -140,11 +140,6 @@ $fa-font-path: "~font-awesome/fonts";
   margin-left: 2px;
 }
 
-.mx-3px {
-  margin-left: 3px;
-  margin-right: 3px;
-}
-
 .mt-14px {
   margin-top: 14px;
 }