admin/twenty
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

(5943) Match country selector button's background to phone number input's background (#5956)

Browse Source 
Fixes #5943

### Before
Light
<img width="218" alt="Screenshot 2024-06-19 at 12 37 22 PM"
src="https://github.com/twentyhq/twenty/assets/57673080/981d1877-be4e-4071-9a8d-9d0ed7e933ab">
Dark
<img width="223" alt="Screenshot 2024-06-19 at 12 39 42 PM"
src="https://github.com/twentyhq/twenty/assets/57673080/a3730ef5-21ba-4d90-998d-d330aec350ad">


### After
Light
<img width="216" alt="Screenshot 2024-06-19 at 12 39 00 PM"
src="https://github.com/twentyhq/twenty/assets/57673080/eef3b743-1b28-43a5-8c1c-bd944a4915c7">
Dark
<img width="228" alt="Screenshot 2024-06-19 at 12 39 29 PM"
src="https://github.com/twentyhq/twenty/assets/57673080/5bf10e51-5a07-4d55-99f1-734517b22781">
This commit is contained in:
Joshua Zacek
2024-06-19 13:46:47 +01:00
committed by GitHub
parent 1c685e8a31
commit 60b60bd4b3
2 changed files with 2 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
packages/twenty-front/src/modules/ui/field/input/components/PhoneInput.tsx
View File

@ -28,7 +28,7 @@ const StyledCustomPhoneInput = styled(ReactPhoneNumberInput)`
padding: 0; padding: 0;
.PhoneInputInput { .PhoneInputInput {
background: ${({ theme }) => theme.background.transparent.secondary}; background: none;
border: none; border: none;
color: ${({ theme }) => theme.font.color.primary}; color: ${({ theme }) => theme.font.color.primary};

2
packages/twenty-front/src/modules/ui/input/components/internal/phone/components/PhoneCountryPickerDropdownButton.tsx
View File

@ -21,7 +21,7 @@ type StyledDropdownButtonProps = {
export const StyledDropdownButtonContainer = styled.div<StyledDropdownButtonProps>` export const StyledDropdownButtonContainer = styled.div<StyledDropdownButtonProps>`
align-items: center; align-items: center;
background: ${({ theme }) => theme.background.primary}; background: none;
border-radius: ${({ theme }) => theme.border.radius.xs} 0 0 border-radius: ${({ theme }) => theme.border.radius.xs} 0 0
${({ theme }) => theme.border.radius.xs}; ${({ theme }) => theme.border.radius.xs};
color: ${({ color }) => color ?? 'none'}; color: ${({ color }) => color ?? 'none'};