From 74e9330fc2fb886f28cd60e0b3cad29fe1e1e137 Mon Sep 17 00:00:00 2001 From: Ahmed Hussien Date: Wed, 7 Aug 2024 18:05:46 +0300 Subject: [PATCH 1/3] add metadata icon --- packages/icons/src/index.ts | 1 + packages/icons/src/metadata.tsx | 26 ++++++++++++++++++++++++++ 2 files changed, 27 insertions(+) create mode 100644 packages/icons/src/metadata.tsx diff --git a/packages/icons/src/index.ts b/packages/icons/src/index.ts index 78a28774..60a215fd 100644 --- a/packages/icons/src/index.ts +++ b/packages/icons/src/index.ts @@ -457,3 +457,4 @@ export { Workspace } from './workspace'; export { Ai } from './ai'; export { Denied } from './denied'; export { Congratulations } from './congratulations'; +export { Metadata } from './metadata'; diff --git a/packages/icons/src/metadata.tsx b/packages/icons/src/metadata.tsx new file mode 100644 index 00000000..1af055cc --- /dev/null +++ b/packages/icons/src/metadata.tsx @@ -0,0 +1,26 @@ +import React from 'react'; +import { intrinsicComponent } from './utils/functions'; +import type { IconProps } from './icon.props'; + +export const Metadata = intrinsicComponent( + ({ color = 'currentColor', size = 28, ...rest }, ref): JSX.Element => ( + + + + + + + + + + + ) +); From 6717dcf15dd5982b3792cc516dfb2eeb974ac43f Mon Sep 17 00:00:00 2001 From: Ahmed Hussien Date: Thu, 8 Aug 2024 13:38:54 +0300 Subject: [PATCH 2/3] add metadata icon --- packages/icons/src/metadata.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/icons/src/metadata.tsx b/packages/icons/src/metadata.tsx index 1af055cc..1644504d 100644 --- a/packages/icons/src/metadata.tsx +++ b/packages/icons/src/metadata.tsx @@ -3,7 +3,7 @@ import { intrinsicComponent } from './utils/functions'; import type { IconProps } from './icon.props'; export const Metadata = intrinsicComponent( - ({ color = 'currentColor', size = 28, ...rest }, ref): JSX.Element => ( + ({ color = 'currentColor', size = 14, ...rest }, ref): JSX.Element => ( Date: Mon, 12 Aug 2024 13:15:28 +0300 Subject: [PATCH 3/3] polish(Menu): change design menu [FRA-5701] --- packages/ui/src/core/date-picker/date-picker.styles.ts | 2 -- packages/ui/src/core/menu-item/menu-item.component.tsx | 3 ++- packages/ui/src/core/menu-item/menu-item.styles.ts | 2 ++ packages/ui/src/utils/functions/scrollbar.ts | 5 +---- 4 files changed, 5 insertions(+), 7 deletions(-) diff --git a/packages/ui/src/core/date-picker/date-picker.styles.ts b/packages/ui/src/core/date-picker/date-picker.styles.ts index 22291cda..528fbe27 100644 --- a/packages/ui/src/core/date-picker/date-picker.styles.ts +++ b/packages/ui/src/core/date-picker/date-picker.styles.ts @@ -65,8 +65,6 @@ const DatePickerIconButton = styled(IconButton).attrs({ className: generateClassNames(baseClassName, 'dropdown'), })` border: none; - width: 30px; - height: 30px; padding: 0; z-index: 1; `; diff --git a/packages/ui/src/core/menu-item/menu-item.component.tsx b/packages/ui/src/core/menu-item/menu-item.component.tsx index f567d032..4cdb2de6 100644 --- a/packages/ui/src/core/menu-item/menu-item.component.tsx +++ b/packages/ui/src/core/menu-item/menu-item.component.tsx @@ -4,6 +4,7 @@ import Arrow from '@scaleflex/icons/arrow'; import { intrinsicComponent } from '../../utils/functions'; import type { MenuItemProps, MenuItemListType } from './menu-item.props'; import Menu from '../menu'; +import EllipsedText from '../ellipsed-text'; import Styled from './menu-item.styles'; const MenuItem = intrinsicComponent( @@ -134,7 +135,7 @@ const MenuItem = intrinsicComponent( disabled={disabled} isFocused={isFocused} > - {children} + {children} ); diff --git a/packages/ui/src/core/menu-item/menu-item.styles.ts b/packages/ui/src/core/menu-item/menu-item.styles.ts index 5cb45872..0d808762 100644 --- a/packages/ui/src/core/menu-item/menu-item.styles.ts +++ b/packages/ui/src/core/menu-item/menu-item.styles.ts @@ -46,7 +46,9 @@ const MenuItemWrapper = styled.div.attrs({ height: 1px; background: ${theme.palette[PColor.BordersSecondary]}; box-sizing: border-box; + margin: 4px 0; `} + ${($noOptionsText || disabled) && css` color: ${theme.palette[PColor.ButtonDisabledText]}; diff --git a/packages/ui/src/utils/functions/scrollbar.ts b/packages/ui/src/utils/functions/scrollbar.ts index c13e280f..c94ecbcc 100644 --- a/packages/ui/src/utils/functions/scrollbar.ts +++ b/packages/ui/src/utils/functions/scrollbar.ts @@ -4,9 +4,6 @@ import type { WithTheme } from '../../theme/entity'; import { Color as PaletteColor } from '../types/palette'; export const scrollBar = ({ theme: { palette } }: WithTheme) => css` - scrollbar-color: ${palette[PaletteColor.IconsMuted]} ${palette[PaletteColor.ActiveSecondary]}; - scrollbar-width: thin; - ::-webkit-scrollbar { width: 12px; } @@ -16,7 +13,7 @@ export const scrollBar = ({ theme: { palette } }: WithTheme) => css` } ::-webkit-scrollbar-thumb { - background: ${palette[PaletteColor.Extra_0_3_Overlay]}; + background: ${palette[PaletteColor.BorderPrimaryStateless]}; border: 4px solid ${palette[PaletteColor.ActiveSecondary]}; border-radius: 99px; padding: 4px 6px;