Bug Fix: Decreased border radius of badge and changed badge parent div padding to margin (#7835)

## What does this PR do?
Decreased the border-radius of the badge and changed the padding-top and
padding-bottom of the badge parent div to margin-top and margin-bottom

Fixes #7811

<img width="1470" alt="Screenshot 2024-10-19 at 12 27 49 AM"
src="https://github.com/user-attachments/assets/2ecb2e18-127e-4093-ba82-34b6e71656a8">
<img width="1470" alt="Screenshot 2024-10-19 at 12 28 37 AM"
src="https://github.com/user-attachments/assets/ef6b4b8d-7f9d-452f-885b-971e2ac658b9">

## How should this be tested?
Create any task, notes, or files.

---------

Co-authored-by: ehconitin <nitinkoche03@gmail.com>
This commit is contained in:
Anis Hamal
2024-10-19 15:27:43 +05:45
committed by GitHub
parent 36e59d80c4
commit 8368f14fb9
2 changed files with 6 additions and 6 deletions

View File

@ -20,8 +20,8 @@ const StyledActivityGroup = styled.div`
`;
const StyledActivityGroupContainer = styled.div`
padding-bottom: ${({ theme }) => theme.spacing(2)};
padding-top: ${({ theme }) => theme.spacing(2)};
margin-bottom: ${({ theme }) => theme.spacing(3)};
margin-top: ${({ theme }) => theme.spacing(3)};
position: relative;
`;
@ -29,7 +29,7 @@ const StyledActivityGroupBar = styled.div`
align-items: center;
background: ${({ theme }) => theme.background.secondary};
border: 1px solid ${({ theme }) => theme.border.color.light};
border-radius: ${({ theme }) => theme.border.radius.xl};
border-radius: ${({ theme }) => theme.border.radius.md};
display: flex;
flex-direction: column;
height: 100%;

View File

@ -61,13 +61,13 @@ const StyledGreyBox = styled.div<{ isInRightDrawer: boolean }>`
const StyledButtonContainer = styled.div`
align-items: center;
bottom: 0;
background: ${({ theme }) => theme.background.secondary};
border-top: 1px solid ${({ theme }) => theme.border.color.light};
bottom: 0;
box-sizing: border-box;
display: flex;
justify-content: flex-end;
padding: ${({ theme }) => theme.spacing(2)};
width: 100%;
box-sizing: border-box;
position: absolute;
width: 100%;
`;