From 50bbc49053b2f041cc006c9c03c11efbe9399e32 Mon Sep 17 00:00:00 2001
From: Ankita Kinger <ankita@appsmith.com>
Date: Wed, 4 Sep 2024 14:22:25 +0530
Subject: [PATCH] fix: Updating the CSS to place the meatball icon in the
 correct place for Application Card (#36112)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

## Description

Updating the CSS to place the meatball icon in the correct place for
Application Card

Fixes [#36084 ](https://github.com/appsmithorg/appsmith/issues/36084)

## Automation

/ok-to-test tags="@tag.Sanity"

### :mag: Cypress test results
<!-- This is an auto-generated comment: Cypress test results  -->
> [!TIP]
> 🟢 🟢 🟢 All cypress tests have passed! 🎉 🎉 🎉
> Workflow run:
<https://github.com/appsmithorg/appsmith/actions/runs/10697709457>
> Commit: 8750fd87ad3d1eb8f94e446e6491d9dfa41c88e2
> <a
href="https://internal.appsmith.com/app/cypress-dashboard/rundetails-65890b3c81d7400d08fa9ee5?branch=master&workflowId=10697709457&attempt=2"
target="_blank">Cypress dashboard</a>.
> Tags: `@tag.Sanity`
> Spec:
> <hr>Wed, 04 Sep 2024 08:41:00 UTC
<!-- end of auto-generated comment: Cypress test results  -->


## Communication
Should the DevRel and Marketing teams inform users about this change?
- [ ] Yes
- [ ] No


<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->

## Summary by CodeRabbit

- **New Features**
- Enhanced the layout of the Card component's footer for a more balanced
appearance.

- **Style**
- Introduced a new CSS property to improve spacing between elements in
the CardFooter.

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
---
 app/client/src/components/common/Card.tsx | 1 +
 1 file changed, 1 insertion(+)

diff --git a/app/client/src/components/common/Card.tsx b/app/client/src/components/common/Card.tsx
index 8d7b30336be..cb77fd8d7ed 100644
--- a/app/client/src/components/common/Card.tsx
+++ b/app/client/src/components/common/Card.tsx
@@ -260,6 +260,7 @@ const CardFooter = styled.div`
   display: flex;
   align-items: center;
   margin: 4px 0 0 0;
+  justify-content: space-between;
   width: ${(props) => props.theme.card.minWidth}px;
 
   @media screen and (min-width: 1500px) {