Protei/PromucFlow_constructor
2
0
Fork 0
Code Issues Pull Requests Actions 2 Packages Projects Releases Wiki Activity

chore: Fix button position and left padding of WDS modal (#39941)

Browse Source 
## Description

Fixes #39767 

| Before | After |
|--------|--------|
|<img width="504" alt="Screenshot 2025-03-26 at 15 41 37"
src="https://github.com/user-attachments/assets/3d090b2e-2397-495f-8aea-e97462cc0bed"
/>|<img width="478" alt="Screenshot 2025-03-26 at 15 58 30"
src="https://github.com/user-attachments/assets/bd7d5681-5e71-4ae3-a04c-a00d2b0ad727"
/>|
|<img width="509" alt="Screenshot 2025-03-26 at 15 41 40"
src="https://github.com/user-attachments/assets/7565e6cb-8005-40f7-8771-b0d36be5fa88"
/>|<img width="493" alt="Screenshot 2025-03-26 at 15 58 34"
src="https://github.com/user-attachments/assets/be759205-7f87-490e-8573-30787627074d"
/>|
|<img width="504" alt="Screenshot 2025-03-26 at 15 43 25"
src="https://github.com/user-attachments/assets/ffc3bcb4-cb4e-44d0-854e-641b49e8b92a"
/>|<img width="477" alt="Screenshot 2025-03-26 at 15 55 57"
src="https://github.com/user-attachments/assets/b5a156bc-cecf-4672-8839-ddcd19275ed6"
/>|

## Automation

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

### 🔍 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/14086541712>
> Commit: 3d64e014ff432460b456471ed9eb3a0041e40754
> <a
href="https://internal.appsmith.com/app/cypress-dashboard/rundetails-65890b3c81d7400d08fa9ee5?branch=master&workflowId=14086541712&attempt=1"
target="_blank">Cypress dashboard</a>.
> Tags: `@tag.Sanity`
> Spec:
> <hr>Wed, 26 Mar 2025 15:44:12 UTC
<!-- end of auto-generated comment: Cypress test results  -->


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


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

## Summary by CodeRabbit

- **Style**
- Refined the modal's visual layout for enhanced spacing and alignment.
- Adjusted horizontal padding and inter-element gaps in the modal
content.
- Updated header margins and improved button vertical positioning for a
more polished interface.

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
This commit is contained in:
vadim 2025-03-26 16:48:08 +01:00 committed by GitHub
parent e49fb48077
commit c6b1b9ae61
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 7 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
app/client/packages/design-system/widgets/src/components/Modal/src/styles.module.css
View File

@ -14,16 +14,19 @@
outline: none;
display: flex;
flex-direction: column;
padding-inline: var(--outer-spacing-4);
padding-inline: var(--outer-spacing-5) var(--outer-spacing-4);
padding-block: var(--outer-spacing-4);
gap: var(--outer-spacing-2);
gap: var(--outer-spacing-3);
flex: 1;
}
.overlay .content .header {
/* Needed to align the close button */
padding-inline: 0 calc(var(--outer-spacing-2));
margin-inline: 0 calc(-1 * var(--outer-spacing-4));
margin-inline: 0 calc(-0.5 * var(--inner-spacing-3));
}
.overlay .content .header button {
margin-block: calc(-0.5 * var(--inner-spacing-3)) 0;
}
.overlay .content .body {