add styles to workspace header

Author: GenosseOtt

bun.lockb

@@ -35,7 +35,7 @@ export function ControlPlaneCard({ controlPlane, workspace, projectName }: Props
 
   return (
     <>
-      <Card key={`${name}--${namespace}`}>
+      <Card style={{ margin: "12px 12px 12px 0" }} key={`${name}--${namespace}`}>
         <div style={{ padding: "20px" }}>
           <FlexBox direction="Column">
             <FlexBox direction="Row" justifyContent="SpaceBetween">

src/components/ControlPlanes/ControlPlaneCard.tsx

@@ -77,13 +77,14 @@ export function ControlPlaneListWorkspaceGridTile({ projectName, workspace }: Pr
       >
         <Panel
           headerLevel="H2"
+          style={{ margin: "12px 12px 12px 0" }}
           collapsed={controlplanes?.length === 0}
           header={
             <div
               style={{
                 width: "100%",
                 display: "grid",
-                gridTemplateColumns: "1fr 1fr 1fr auto",
+                gridTemplateColumns: "0.3fr 0.24fr auto 0.05fr",
                 gap: "1rem",
                 alignItems: "center",
               }}

src/components/ControlPlanes/List/ControlPlaneListWorkspaceGridTile.tsx

@@ -29,8 +29,8 @@ export function MembersAvatarView({ members, project, workspace }: Props) {
   }
 
   return (
-    <div style={{ maxWidth: "300px" }}>
-      <AvatarGroup type={AvatarGroupType.Group} onClick={handleOnClick} ref={openerRef}>
+    <div style={{display: "flex", justifyContent: "flex-end"}}>
+      <AvatarGroup style={{maxWidth:"200px"}} type={AvatarGroupType.Group} onClick={handleOnClick} ref={openerRef}>
         {avatars}
       </AvatarGroup>
       <Popover