ui:(platform): fix spacing issue in the collections panel

firecamp-dev · Oct 7, 2023 · afa7557 · afa7557
1 parent c3064e3
commit afa7557
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 5 deletions.
diff --git a/platform/firecamp-platform/src/components/activity-bar/explorer/treeItemRenderer.tsx b/platform/firecamp-platform/src/components/activity-bar/explorer/treeItemRenderer.tsx
@@ -44,11 +44,11 @@ export default {
             <div className={cx(text, 'collection_leaf-node-type', 'm-r-4')} {...context.arrowProps}>{text}</div>
           );
         case ERequestTypes.GraphQL:
-          return <FcIconGraphQL className="text-graphql" size={24}  {...context.arrowProps} />;
+          return <FcIconGraphQL className={cx("request-icon","text-graphql")} size={24}  {...context.arrowProps} />;
         case ERequestTypes.WebSocket:
-          return <FcIconWebSocket className="" size={24} {...context.arrowProps} />;
+          return <FcIconWebSocket className="request-icon" size={24} {...context.arrowProps} />;
         case ERequestTypes.SocketIO:
-          return <FcIconSocketIoSquare className="" size={24} {...context.arrowProps} />;
+          return <FcIconSocketIoSquare className="request-icon" size={24} {...context.arrowProps} />;
         default:
           return <></>;
       }
@@ -223,4 +223,4 @@ export default {
       </li>
     );
   },
-};
+};
diff --git a/platform/firecamp-ui/src/components/tree/tree.scss b/platform/firecamp-ui/src/components/tree/tree.scss
@@ -64,9 +64,17 @@
 .collection_leaf-node-type {
   font-size: 12px;
   font-weight: 700;
-  width: 2.5rem /* 40px */;
+  width: 3.4rem /* 54px */;
   flex: none;
   height: 1rem /* 16px */;
+  text-align: right;
+  margin-right: 0.5rem;
+}
+
+.request-icon{
+  width: 3.4rem /* 54px */;
+  margin-right: 0.5rem;
+  padding-left: 1.9rem; /* width(3.4) - icon-size(1.5) */
 }
 .rct-tree-item-title-container {
   align-items: center;