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

Fix: Inline Phone Field Menu (#4383)

Browse Source 
* #4343 fix: phone menu display on page

* Add the possibility to send width as %

---------

Co-authored-by: Thomas Trompette <thomast@twenty.com>
This commit is contained in:
Jeet Desai
2024-03-11 21:08:37 +05:30
committed by GitHub
parent c82c60b448
commit 7231ea1e72
3 changed files with 3 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@ -120,6 +120,7 @@ export const CountryPickerDropdownButton = ({
return ( return (
<Dropdown <Dropdown
dropdownMenuWidth={'100%'}
dropdownId="country-picker-dropdown-id" dropdownId="country-picker-dropdown-id"
dropdownHotkeyScope={{ scope: CountryPickerHotkeyScope.CountryPicker }} dropdownHotkeyScope={{ scope: CountryPickerHotkeyScope.CountryPicker }}
clickableComponent={ clickableComponent={

2
packages/twenty-front/src/modules/ui/layout/dropdown/components/Dropdown.tsx
View File

@ -33,7 +33,7 @@ type DropdownProps = {
dropdownHotkeyScope: HotkeyScope; dropdownHotkeyScope: HotkeyScope;
dropdownId: string; dropdownId: string;
dropdownPlacement?: Placement; dropdownPlacement?: Placement;
dropdownMenuWidth?: `${string}px` | 'auto' | number; dropdownMenuWidth?: `${string}px` | `${number}%` | 'auto' | number;
dropdownOffset?: { x?: number; y?: number }; dropdownOffset?: { x?: number; y?: number };
onClickOutside?: () => void; onClickOutside?: () => void;
onClose?: () => void; onClose?: () => void;

2
packages/twenty-front/src/modules/ui/layout/dropdown/components/DropdownMenu.tsx
View File

@ -2,7 +2,7 @@ import styled from '@emotion/styled';
const StyledDropdownMenu = styled.div<{ const StyledDropdownMenu = styled.div<{
disableBlur?: boolean; disableBlur?: boolean;
width?: `${string}px` | 'auto' | number; width?: `${string}px` | `${number}%` | 'auto' | number;
}>` }>`
backdrop-filter: ${({ disableBlur }) => (disableBlur ? 'none' : 'blur(8px)')}; backdrop-filter: ${({ disableBlur }) => (disableBlur ? 'none' : 'blur(8px)')};
background: ${({ theme }) => theme.background.transparent.secondary}; background: ${({ theme }) => theme.background.transparent.secondary};