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

1584/fix/dropdown item width not correct (#1950)

Browse Source 
* added full width to new button

* removed scrollbar width in dropdown item

* Fix dropdown width issue

* Fix lint

---------

Co-authored-by: Charles Bochet <charles@twenty.com>
This commit is contained in:
Abhishek Thory
2023-10-10 02:07:26 +05:30
committed by GitHub
parent e1c0cb7821
commit 29c013f826
24 changed files with 137 additions and 109 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
front/src/modules/ui/board/components/BoardColumnEditTitleMenu.tsx
View File

@ -2,7 +2,7 @@ import { ChangeEvent, useCallback, useState } from 'react';
import styled from '@emotion/styled';
import { useRecoilState } from 'recoil';
import { StyledDropdownMenuItemsContainer } from '@/ui/dropdown/components/StyledDropdownMenuItemsContainer';
import { DropdownMenuItemsContainer } from '@/ui/dropdown/components/DropdownMenuItemsContainer';
import { StyledDropdownMenuSeparator } from '@/ui/dropdown/components/StyledDropdownMenuSeparator';
import { IconTrash } from '@/ui/icon';
import { MenuItem } from '@/ui/menu-item/components/MenuItem';
@ -114,7 +114,7 @@ export const BoardColumnEditTitleMenu = ({
}, [onClose, onDelete, setBoardColumns, stageId]);
return (
<StyledDropdownMenuItemsContainer>
<DropdownMenuItemsContainer>
<StyledEditTitleContainer>
<StyledEditModeInput
value={internalValue}
@ -142,6 +142,6 @@ export const BoardColumnEditTitleMenu = ({
text="Delete"
accent="danger"
/>
</StyledDropdownMenuItemsContainer>
</DropdownMenuItemsContainer>
);
};

6
front/src/modules/ui/board/components/BoardColumnMenu.tsx
View File

@ -4,8 +4,8 @@ import { Key } from 'ts-key-enum';
import { useCreateCompanyProgress } from '@/companies/hooks/useCreateCompanyProgress';
import { useFilteredSearchCompanyQuery } from '@/companies/hooks/useFilteredSearchCompanyQuery';
import { DropdownMenuItemsContainer } from '@/ui/dropdown/components/DropdownMenuItemsContainer';
import { StyledDropdownMenu } from '@/ui/dropdown/components/StyledDropdownMenu';
import { StyledDropdownMenuItemsContainer } from '@/ui/dropdown/components/StyledDropdownMenuItemsContainer';
import { IconArrowLeft, IconArrowRight, IconPencil, IconPlus } from '@/ui/icon';
import { SingleEntitySelect } from '@/ui/input/relation-picker/components/SingleEntitySelect';
import { relationPickerSearchFilterScopedState } from '@/ui/input/relation-picker/states/relationPickerSearchFilterScopedState';
@ -135,7 +135,7 @@ export const BoardColumnMenu = ({
<StyledMenuContainer ref={boardColumnMenuRef}>
<StyledDropdownMenu data-select-disable>
{currentMenu === 'actions' && (
<StyledDropdownMenuItemsContainer>
<DropdownMenuItemsContainer>
<MenuItem
onClick={() => setMenu('title')}
LeftIcon={IconPencil}
@ -156,7 +156,7 @@ export const BoardColumnMenu = ({
LeftIcon={IconPlus}
text="New opportunity"
/>
</StyledDropdownMenuItemsContainer>
</DropdownMenuItemsContainer>
)}
{currentMenu === 'title' && (
<BoardColumnEditTitleMenu

10
front/src/modules/ui/board/components/BoardOptionsDropdownContent.tsx
View File

@ -12,9 +12,9 @@ import { BoardContext } from '@/companies/states/contexts/BoardContext';
import { DropdownMenuHeader } from '@/ui/dropdown/components/DropdownMenuHeader';
import { DropdownMenuInput } from '@/ui/dropdown/components/DropdownMenuInput';
import { DropdownMenuInputContainer } from '@/ui/dropdown/components/DropdownMenuInputContainer';
import { DropdownMenuItemsContainer } from '@/ui/dropdown/components/DropdownMenuItemsContainer';
import { DropdownMenuSearchInput } from '@/ui/dropdown/components/DropdownMenuSearchInput';
import { StyledDropdownMenu } from '@/ui/dropdown/components/StyledDropdownMenu';
import { StyledDropdownMenuItemsContainer } from '@/ui/dropdown/components/StyledDropdownMenuItemsContainer';
import { StyledDropdownMenuSeparator } from '@/ui/dropdown/components/StyledDropdownMenuSeparator';
import { useDropdown } from '@/ui/dropdown/hooks/useDropdown';
import {
@ -191,7 +191,7 @@ export const BoardOptionsDropdownContent = ({
/>
</DropdownMenuInputContainer>
<StyledDropdownMenuSeparator />
<StyledDropdownMenuItemsContainer>
<DropdownMenuItemsContainer>
<MenuItemNavigate
onClick={() => handleMenuNavigate('fields')}
LeftIcon={IconTag}
@ -202,7 +202,7 @@ export const BoardOptionsDropdownContent = ({
LeftIcon={IconLayoutKanban}
text="Stages"
/>
</StyledDropdownMenuItemsContainer>
</DropdownMenuItemsContainer>
</>
)}
{currentMenu === 'stages' && (
@ -211,13 +211,13 @@ export const BoardOptionsDropdownContent = ({
Stages
</DropdownMenuHeader>
<StyledDropdownMenuSeparator />
<StyledDropdownMenuItemsContainer>
<DropdownMenuItemsContainer>
<MenuItem
onClick={() => setCurrentMenu('stage-creation')}
LeftIcon={IconPlus}
text="Add stage"
/>
</StyledDropdownMenuItemsContainer>
</DropdownMenuItemsContainer>
</>
)}
{currentMenu === 'stage-creation' && (