fix: Phone dropdown field has extra width

[harshit078]

Description

This PR solves the issue #6865

Current Behaviour

Expected behavior

[greptile-apps]

PR Summary

This PR addresses the issue of extra width in the phone dropdown field within the activity tab by modifying the DropdownMenu component.

• Modified DropdownMenu.tsx to add position: absolute and overflow: visible to the styled component
• Changes aim to fix layout issues and prevent unwanted expansion of the dropdown menu
• Affects the phone country picker dropdown in the activity tab
• Improves UI consistency by aligning dropdown width with the input field

_{1 file(s) reviewed, no comment(s)
Edit PR Review Bot Settings}

[greptile-apps]

PR Summary

(updates since last review)

This PR addresses the issue of extra width in the phone dropdown field by modifying the DropdownMenu component in DropdownMenu.tsx.

• Removed position: absolute and overflow: visible from the StyledDropdownMenu component
• Added max-width: 200px to constrain the dropdown menu's width
• These changes should prevent the dropdown from extending beyond the desired size
• The modification directly impacts the PhoneCountryPickerDropdownSelect component
• It's important to verify that these changes don't negatively affect other dropdown menus in the application

_{1 file(s) reviewed, 1 comment(s)
Edit PR Review Bot Settings}

[Bonapara]

Hi @harshit078, thanks for noticing this one! Can you make the picker as large as the input?

I've created another issue to improve the detail page inputs style: #6870

[harshit078]

Sure @Bonapara , will do that

[martmull]

Think it is not enough, we have the issue on currency picker also, the issue comes from https://github.com/twentyhq/twenty/pull/6166/files

[harshit078]

Hi @martmull, Is the ARR field currency picker that you are referring too ?

[martmull]

@harshit078 yes, the input is too large also

[harshit078]

Yes, This issue is already referenced under #6870 and I have already created an PR for this #6899.

[harshit078]

Since this issue comes under the existing #6870 hence it wouldn't require max-width component and only width=auto will work.

[bosiraphael]

LGTM, thank you @harshit078 for your contribution.

Outdated

[github-actions]

Thanks @harshit078 for your contribution!
This marks your 15th PR on the repo. You're top 2% of all our contributors 🎉
See contributor page - Share on LinkedIn - Share on Twitter