From 778eba33522631a7d4fb844f75be8d47ec318658 Mon Sep 17 00:00:00 2001 From: mdshamoon Date: Thu, 26 Oct 2023 12:27:20 +0530 Subject: [PATCH] added some cleanups --- .../images/icons/Chat/UnselectedDark.svg | 13 +- .../images/icons/Configure/UnselectedDark.svg | 26 +- src/assets/images/icons/DownArrow.svg | 10 +- src/assets/images/icons/Flow/Duplicate.svg | 24 +- src/assets/images/icons/Flow/Export.svg | 25 +- src/assets/images/icons/Sheets/Link.svg | 4 +- .../images/icons/Sheets/Updatesheet.svg | 4 +- src/assets/images/icons/View.svg | 2 +- src/common/utils.ts | 8 + .../UI/HelpIcon/HelpIcon.module.css | 34 +- src/components/UI/HelpIcon/HelpIcon.tsx | 62 ++-- .../SideDrawer/SideDrawer.module.css | 6 +- .../Navigation/SideDrawer/SideDrawer.tsx | 6 +- .../ChatInterface/ChatInterface.module.css | 8 +- .../Chat/ChatInterface/ChatInterface.tsx | 4 +- .../CollectionContactList.module.css | 2 +- .../CollectionContactList.tsx | 3 - .../CollectionInformation.module.css | 24 +- .../CollectionInformation.tsx | 1 - .../CollectionList/CollectionList.module.css | 10 + .../CollectionList/CollectionList.tsx | 7 +- src/containers/Flow/FlowList/FlowList.tsx | 7 +- src/containers/List/List.module.css | 17 + src/containers/List/List.tsx | 319 ++++++++---------- .../NotificationList.module.css | 2 +- .../SheetIntegrationList.module.css | 2 +- src/i18n/en/en.json | 4 +- 27 files changed, 321 insertions(+), 313 deletions(-) diff --git a/src/assets/images/icons/Chat/UnselectedDark.svg b/src/assets/images/icons/Chat/UnselectedDark.svg index 658f41bcf..8c8035733 100644 --- a/src/assets/images/icons/Chat/UnselectedDark.svg +++ b/src/assets/images/icons/Chat/UnselectedDark.svg @@ -1 +1,12 @@ - Icon/Chat/Unselected \ No newline at end of file + + + Icon/Chat/Unselected + + + + + + diff --git a/src/assets/images/icons/Configure/UnselectedDark.svg b/src/assets/images/icons/Configure/UnselectedDark.svg index 3daa56121..bd991457c 100644 --- a/src/assets/images/icons/Configure/UnselectedDark.svg +++ b/src/assets/images/icons/Configure/UnselectedDark.svg @@ -1,11 +1,15 @@ - - - Icon/Configure/Unselected Dark - - - - - - - - \ No newline at end of file + + + + + + + + + + + diff --git a/src/assets/images/icons/DownArrow.svg b/src/assets/images/icons/DownArrow.svg index f0a5fe4d3..869c29850 100644 --- a/src/assets/images/icons/DownArrow.svg +++ b/src/assets/images/icons/DownArrow.svg @@ -5,14 +5,14 @@ - - - + + + ரு - + - \ No newline at end of file + diff --git a/src/assets/images/icons/Flow/Duplicate.svg b/src/assets/images/icons/Flow/Duplicate.svg index 6d55607bf..42acd3e0a 100644 --- a/src/assets/images/icons/Flow/Duplicate.svg +++ b/src/assets/images/icons/Flow/Duplicate.svg @@ -1,16 +1,8 @@ - - - - Copy Flow - Created with Sketch. - - - - - - - - - - - \ No newline at end of file + + + + diff --git a/src/assets/images/icons/Flow/Export.svg b/src/assets/images/icons/Flow/Export.svg index 17f06badf..e985689b8 100644 --- a/src/assets/images/icons/Flow/Export.svg +++ b/src/assets/images/icons/Flow/Export.svg @@ -1,15 +1,10 @@ - - - Export flow - - - - - - - - - - - - \ No newline at end of file + + + + + + + + diff --git a/src/assets/images/icons/Sheets/Link.svg b/src/assets/images/icons/Sheets/Link.svg index 5f2e31c17..6044578ab 100644 --- a/src/assets/images/icons/Sheets/Link.svg +++ b/src/assets/images/icons/Sheets/Link.svg @@ -2,11 +2,11 @@ Icon/Link/Dark Copy - + - \ No newline at end of file + diff --git a/src/assets/images/icons/Sheets/Updatesheet.svg b/src/assets/images/icons/Sheets/Updatesheet.svg index cc624d114..627e6ddc0 100644 --- a/src/assets/images/icons/Sheets/Updatesheet.svg +++ b/src/assets/images/icons/Sheets/Updatesheet.svg @@ -4,7 +4,7 @@ - + @@ -16,4 +16,4 @@ - \ No newline at end of file + diff --git a/src/assets/images/icons/View.svg b/src/assets/images/icons/View.svg index 3efc1f07a..a21a1953e 100644 --- a/src/assets/images/icons/View.svg +++ b/src/assets/images/icons/View.svg @@ -12,4 +12,4 @@ - \ No newline at end of file + diff --git a/src/common/utils.ts b/src/common/utils.ts index a18ac55c0..2799e3aa7 100644 --- a/src/common/utils.ts +++ b/src/common/utils.ts @@ -201,4 +201,12 @@ export const getAddOrRemoveRoleIds = (roles: any, payload: any) => { return { ...rest, addRoleIds, deleteRoleIds }; }; +export const trimStringWithMaxLength = (input: string, maxLength: number): string => { + if (input.length <= maxLength) { + return input; + } + const trimmedString = input.slice(0, maxLength - 3); + return trimmedString + '...'; +}; + export default getObject; diff --git a/src/components/UI/HelpIcon/HelpIcon.module.css b/src/components/UI/HelpIcon/HelpIcon.module.css index b4f485803..8e9ce5088 100644 --- a/src/components/UI/HelpIcon/HelpIcon.module.css +++ b/src/components/UI/HelpIcon/HelpIcon.module.css @@ -1,37 +1,18 @@ .InfoIcon { - margin-left: 10px !important; height: 18px; width: 18px; cursor: pointer; } -.Hover { - position: relative; - z-index: 1000; -} - -.Triangle { - width: 0; - height: 0; - border-left: 12px solid transparent; - border-right: 12px solid transparent; - border-bottom: 14px solid #fff; - margin-left: 10px; -} - .HoverPopUp { position: absolute; } .HoverPopUpText { - background-color: white; + padding: 12px; max-width: 387px; - box-shadow: 0px 4px 4px 0px #00000014; color: #555555; font-size: 12px; - padding: 18px; - border-radius: 5px; - line-height: 18px; font-weight: 400; } @@ -42,3 +23,16 @@ justify-content: flex-end; cursor: pointer; } + +.Popper { + background-color: white; + box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.08); +} + +.PopperArrow { + color: white; +} + +.InfoIconContainer { + display: flex; +} diff --git a/src/components/UI/HelpIcon/HelpIcon.tsx b/src/components/UI/HelpIcon/HelpIcon.tsx index bee533f84..a72c496e0 100644 --- a/src/components/UI/HelpIcon/HelpIcon.tsx +++ b/src/components/UI/HelpIcon/HelpIcon.tsx @@ -1,6 +1,6 @@ -import { useState } from 'react'; import styles from './HelpIcon.module.css'; import InfoIcon from 'assets/images/info.svg?react'; +import { Tooltip } from '@mui/material'; export interface HelpDataProps { heading: string; @@ -19,37 +19,39 @@ export const HelpIcon = ({ link: '', }, }: HelpIconProps) => { - const [isPopupOpen, setIsPopupOpen] = useState(false); - - const handleMouseEnter = () => { - setIsPopupOpen(true); - }; - - const handleMouseLeave = () => { - setIsPopupOpen(false); - }; - return ( -
- - {isPopupOpen && helpData && ( -
-
-
- {helpData.heading} - {helpData.body} -
{ - window.location.replace(helpData.link); - }} - > - Learn more + + {helpData && ( +
+
+ {helpData.heading} + {helpData.body} +
{ + window.open(helpData.link); + }} + > + Learn more +
+
-
-
- )} -
+ )} + + } + arrow + > + + + + ); }; diff --git a/src/components/UI/Layout/Navigation/SideDrawer/SideDrawer.module.css b/src/components/UI/Layout/Navigation/SideDrawer/SideDrawer.module.css index 8fd076c47..f7c02c4b0 100644 --- a/src/components/UI/Layout/Navigation/SideDrawer/SideDrawer.module.css +++ b/src/components/UI/Layout/Navigation/SideDrawer/SideDrawer.module.css @@ -30,7 +30,7 @@ } .AnotherToolBar { - padding: 22px 16px; + padding: 12px 16px; } .Drawer { @@ -67,9 +67,7 @@ .Title { align-self: center; } -.IconButton { - padding: 0px 10px !important; -} + .ClosedIcon { margin: 12px 12px 12px 15px; } diff --git a/src/components/UI/Layout/Navigation/SideDrawer/SideDrawer.tsx b/src/components/UI/Layout/Navigation/SideDrawer/SideDrawer.tsx index 55fe97c4d..d5772fd0c 100644 --- a/src/components/UI/Layout/Navigation/SideDrawer/SideDrawer.tsx +++ b/src/components/UI/Layout/Navigation/SideDrawer/SideDrawer.tsx @@ -26,11 +26,7 @@ export const SideDrawer = () => { Glific - setDrawerOpen(false)} - data-testid="drawer-button" - > + setDrawerOpen(false)} data-testid="drawer-button">
diff --git a/src/containers/Chat/ChatInterface/ChatInterface.module.css b/src/containers/Chat/ChatInterface/ChatInterface.module.css index 6a38f493d..a4e79d55e 100644 --- a/src/containers/Chat/ChatInterface/ChatInterface.module.css +++ b/src/containers/Chat/ChatInterface/ChatInterface.module.css @@ -31,8 +31,8 @@ .Title { display: flex; + align-items: center; width: calc(100% - 30px); - text-align: center; color: #191c1a; font-size: 20px; font-weight: 700; @@ -74,6 +74,8 @@ color: #191c1a; cursor: pointer; font-size: 13px; + display: flex; + align-items: center; font-style: normal; font-weight: 700; } @@ -100,3 +102,7 @@ right: 0; bottom: 0; } + +.Heading { + margin-right: 10px; +} diff --git a/src/containers/Chat/ChatInterface/ChatInterface.tsx b/src/containers/Chat/ChatInterface/ChatInterface.tsx index a25f57662..c1f8293a6 100644 --- a/src/containers/Chat/ChatInterface/ChatInterface.tsx +++ b/src/containers/Chat/ChatInterface/ChatInterface.tsx @@ -144,8 +144,8 @@ export const ChatInterface = ({ savedSearches, collectionType }: ChatInterfacePr
- {heading} - +
{heading}
+ , link: '' }} />
diff --git a/src/containers/Collection/CollectionContact/CollectionContactList/CollectionContactList.module.css b/src/containers/Collection/CollectionContact/CollectionContactList/CollectionContactList.module.css index 894dff218..2ed4c0cfb 100644 --- a/src/containers/Collection/CollectionContact/CollectionContactList/CollectionContactList.module.css +++ b/src/containers/Collection/CollectionContact/CollectionContactList/CollectionContactList.module.css @@ -31,7 +31,7 @@ .RedirectArrow { width: 15px; - color: #119656; + color: #777; } .CollectionsText { diff --git a/src/containers/Collection/CollectionContact/CollectionContactList/CollectionContactList.tsx b/src/containers/Collection/CollectionContact/CollectionContactList/CollectionContactList.tsx index 02a8ef625..454410976 100644 --- a/src/containers/Collection/CollectionContact/CollectionContactList/CollectionContactList.tsx +++ b/src/containers/Collection/CollectionContact/CollectionContactList/CollectionContactList.tsx @@ -137,7 +137,6 @@ export const CollectionContactList = ({ label: t('View profile'), link: '/contact-profile', parameter: 'id', - hasMoreOption: true, }, ]; const removeCollectionButton = ( @@ -174,9 +173,7 @@ export const CollectionContactList = ({ pageLink="contact" listIcon={collectionIcon} deleteModifier={{ - icon: 'cross', variables: getDeleteQueryVariables, - label: t('Remove from this collection'), }} editSupport={false} dialogMessage={dialogMessage} diff --git a/src/containers/Collection/CollectionInformation/CollectionInformation.module.css b/src/containers/Collection/CollectionInformation/CollectionInformation.module.css index 2b5d593fd..bb14ac716 100644 --- a/src/containers/Collection/CollectionInformation/CollectionInformation.module.css +++ b/src/containers/Collection/CollectionInformation/CollectionInformation.module.css @@ -3,22 +3,23 @@ font-size: 12px; line-height: 10px; color: #cacaca; - align-items: center; - display: flex; - align-items: center; } .SessionInfo { - color: #999; - font-size: 14px; - font-weight: 500; + color: #555; + font-size: 12px; line-height: 20px; } .SessionCount { + margin-left: 4px; + display: inline-flex; + justify-content: center; + align-items: center; color: #555; - font-family: Heebo; - font-size: 14px; + padding: 4px 8px; + background-color: #ecf7f1; + border-radius: 5px; font-style: normal; font-weight: 700; line-height: 20px; @@ -42,8 +43,8 @@ } .InfoWrapper { - align-items: flex-end; - flex-direction: column; + display: flex; + align-items: center; } .Message { @@ -65,8 +66,7 @@ .MessageInfo { display: flex; - gap: 0 72px; - margin: 0 29px 0 17px; + gap: 0 16px; } @media only screen and (max-width: 768px) { diff --git a/src/containers/Collection/CollectionInformation/CollectionInformation.tsx b/src/containers/Collection/CollectionInformation/CollectionInformation.tsx index 959be9417..421d559a0 100644 --- a/src/containers/Collection/CollectionInformation/CollectionInformation.tsx +++ b/src/containers/Collection/CollectionInformation/CollectionInformation.tsx @@ -111,7 +111,6 @@ export const CollectionInformation = ({ return (
- {/*
{t('Contacts qualified for')}
*/}
{Object.keys(display).map((data: any) => (
diff --git a/src/containers/Collection/CollectionList/CollectionList.module.css b/src/containers/Collection/CollectionList/CollectionList.module.css index 8ce62ca84..e400b6c85 100644 --- a/src/containers/Collection/CollectionList/CollectionList.module.css +++ b/src/containers/Collection/CollectionList/CollectionList.module.css @@ -58,3 +58,13 @@ height: 12px; width: 12px; } + +.ViewButton { + color: #777; + text-align: center; + font-size: 13px; + font-style: normal; + font-weight: 400; + line-height: 20px; + border-radius: 16px; +} diff --git a/src/containers/Collection/CollectionList/CollectionList.tsx b/src/containers/Collection/CollectionList/CollectionList.tsx index a74e4eeae..463a6feb1 100644 --- a/src/containers/Collection/CollectionList/CollectionList.tsx +++ b/src/containers/Collection/CollectionList/CollectionList.tsx @@ -191,9 +191,9 @@ export const CollectionList = () => { const additionalAction = () => [ { + label: t('View details'), icon: viewButton, parameter: 'id', - textButton: 'View', dialog: viewCollection, }, { @@ -203,11 +203,11 @@ export const CollectionList = () => { dialog: setContactsDialog, }, { - label: t('Export collection'), + label: t('Export'), icon: , parameter: 'id', dialog: exportCollection, - hasMoreOption: true, + insideMore: true, }, ]; @@ -254,7 +254,6 @@ export const CollectionList = () => { listIcon={collectionIcon} dialogMessage={dialogMessage} additionalAction={additionalAction} - cardLink={cardLink} {...queries} {...columnAttributes} /> diff --git a/src/containers/Flow/FlowList/FlowList.tsx b/src/containers/Flow/FlowList/FlowList.tsx index af4617915..6d5f3d442 100644 --- a/src/containers/Flow/FlowList/FlowList.tsx +++ b/src/containers/Flow/FlowList/FlowList.tsx @@ -140,21 +140,22 @@ export const FlowList = () => { label: t('Configure'), icon: configureIcon, parameter: 'uuid', + link: '/flow/configure', }, { label: t('Make a copy'), icon: , parameter: 'id', + dialog: setDialog, }, { - label: t('Export flow'), + label: t('Export'), icon: , parameter: 'id', dialog: exportFlow, - hasMoreOption: true, - name: 'Export', + insideMore: true, }, ]; diff --git a/src/containers/List/List.module.css b/src/containers/List/List.module.css index 1c89946ee..8f1cec331 100644 --- a/src/containers/List/List.module.css +++ b/src/containers/List/List.module.css @@ -260,3 +260,20 @@ display: flex; align-items: center; } + +.TitleText { + margin-right: 12px; +} + +.MenuList { + padding: 0px; +} + +.MenuItem { + padding: 0px 6px; +} + +.Divider { + margin-top: 0px !important; + margin-bottom: 0px !important; +} diff --git a/src/containers/List/List.tsx b/src/containers/List/List.tsx index 3efe874f2..07229254a 100644 --- a/src/containers/List/List.tsx +++ b/src/containers/List/List.tsx @@ -1,11 +1,12 @@ -import { useState, useEffect, useCallback } from 'react'; +import { useState, useEffect, useCallback, MouseEvent, Fragment } from 'react'; import { Link, Navigate, useSearchParams } from 'react-router-dom'; import { useTranslation } from 'react-i18next'; import { useQuery, useMutation, DocumentNode, useLazyQuery } from '@apollo/client'; import { - ClickAwayListener, Divider, IconButton, + Menu, + MenuItem, TableFooter, TablePagination, TableRow, @@ -17,11 +18,9 @@ import { DialogBox } from 'components/UI/DialogBox/DialogBox'; import { SearchBar } from 'components/UI/SearchBar/SearchBar'; import { Tooltip } from 'components/UI/Tooltip/Tooltip'; -import InfoIcon from 'assets/images/info.svg?react'; import MoreOptions from 'assets/images/icons/MoreOptions.svg?react'; import DeleteIcon from 'assets/images/icons/Delete/Red.svg?react'; import EditIcon from 'assets/images/icons/Edit.svg?react'; -import CrossIcon from 'assets/images/icons/Cross.svg?react'; import BackIcon from 'assets/images/icons/Back.svg?react'; import { GET_CURRENT_USER } from 'graphql/queries/User'; import { getUserRole, getUserRolePermissions } from 'context/role'; @@ -30,7 +29,81 @@ import { getUpdatedList, setListSession, getLastListSessionValues } from 'servic import styles from './List.module.css'; import Track from 'services/TrackService'; import Loading from 'components/UI/Layout/Loading/Loading'; +import HelpIcon from 'components/UI/HelpIcon/HelpIcon'; + +const actionListMap = (item: any, actionList: any, hasMoreOption: boolean) => { + return actionList.map((action: any, index: number) => { + // check if we are dealing with nested element + let additionalActionParameter: any; + const params: any = action.parameter.split('.'); + if (params.length > 1) { + additionalActionParameter = item[params[0]][params[1]]; + } else { + additionalActionParameter = item[params[0]]; + } + const key = index; + + if (hasMoreOption) { + return ( + + + +
action.dialog(additionalActionParameter, item)} + > +
+ {action.icon} +
{action.label}
+
+
+
+
+ ); + } + if (action.textButton) { + return ( +
action.dialog(additionalActionParameter, item)} + key={key} + > + {action.textButton} +
+ ); + } + + if (action.link) { + return ( + + + + {action.icon} + + + + ); + } + if (action.dialog) { + return ( + action.dialog(additionalActionParameter, item)} + key={key} + > + + {action.icon} + + + ); + } + return null; + }); +}; export interface ColumnNames { name?: string; label: string; @@ -72,7 +145,6 @@ export interface ListProps { filters?: Object | null; filterList?: any; displayListType?: string; - cardLink?: Object | null; editSupport?: boolean; additionalAction?: (listValues: any) => Array<{ icon: any; @@ -83,9 +155,7 @@ export interface ListProps { button?: any; }>; deleteModifier?: { - icon: string; variables: any; - label?: string; }; dialogTitle?: string; backLinkButton?: { @@ -136,13 +206,12 @@ export const List = ({ show: true, label: 'Add New', }, - deleteModifier = { icon: 'normal', variables: null, label: 'Delete' }, + deleteModifier = { variables: null }, editSupport = true, searchParameter = ['label'], filters = null, refreshList = false, displayListType = 'list', - cardLink = null, additionalAction = () => [], backLinkButton, restrictedAction, @@ -156,8 +225,14 @@ export const List = ({ const { t } = useTranslation(); const [showMoreOptions, setShowMoreOptions] = useState(''); - // Hover popoup state - const [isPopupOpen, setIsPopupOpen] = useState(false); + const [anchorEl, setAnchorEl] = useState(null); + const open = Boolean(anchorEl); + const handleClick = (event: MouseEvent) => { + setAnchorEl(event.currentTarget); + }; + const handleClose = () => { + setAnchorEl(null); + }; // DialogBox states const [deleteItemID, setDeleteItemID] = useState(null); @@ -436,26 +511,6 @@ export const List = ({ } let moreButton = null; - moreButton = ( - { - event.stopPropagation(); - if (showMoreOptions == id) { - setShowMoreOptions(''); - } else { - setShowMoreOptions(id); - } - }} - > - -
- -
-
-
- ); - let editButton = null; if (editSupport) { editButton = allowedAction.edit && ( @@ -477,120 +532,73 @@ export const List = ({ data-testid="DeleteIcon" onClick={() => showDialogHandler(Id, text)} > - {deleteModifier.icon === 'cross' ? ( - - ) : ( -
- -
Delete
-
- )} +
+ +
Delete
+
) : null; - const actionsInsideMore = additionalAction(item).filter((action: any) => action?.hasMoreOption); - const actionsOutsideMore = additionalAction(item).filter( - (action: any) => !action?.hasMoreOption - ); - - const actionListMap = (actionList: any, hasMoreOption: boolean) => { - return actionList.map((action: any, index: number) => { - // check if we are dealing with nested element - let additionalActionParameter: any; - const params: any = action.parameter.split('.'); - if (params.length > 1) { - additionalActionParameter = item[params[0]][params[1]]; - } else { - additionalActionParameter = item[params[0]]; - } - const key = index; - - if (hasMoreOption) { - return ( -
- -
action.dialog(additionalActionParameter, item)} - > -
- {action.icon} -
{action.name}
-
-
-
- ); - } - - if (action.textButton) { - return ( -
action.dialog(additionalActionParameter, item)} - key={key} - > - {action.textButton} + const actionsInsideMore = additionalAction(item).filter((action: any) => action?.insideMore); + const actionsOutsideMore = additionalAction(item).filter((action: any) => !action?.insideMore); + + if (actionsInsideMore.length > 0 || allowedAction.edit || allowedAction.delete) { + moreButton = ( + { + setAnchorEl(event.currentTarget); + if (showMoreOptions == id) { + setShowMoreOptions(''); + } else { + setShowMoreOptions(id); + } + }} + > + +
+
- ); - } - - if (action.link) { - return ( - - - - {action.icon} - - - - ); - } - if (action.dialog) { - return ( - action.dialog(additionalActionParameter, item)} - key={key} - > - - {action.icon} - - - ); - } - return null; - }); - }; +
+
+ ); + } if (id) { return ( - { - showMoreOptions && setShowMoreOptions(''); - }} - > -
- {actionListMap(actionsOutsideMore, false)} - - {/* do not display edit & delete for staff role in collection */} - {userRolePermissions.manageCollections || item !== 'collections' ? ( -
- {moreButton} - {showMoreOptions == id && ( -
- {editButton} - - {deleteButton(id, labelValue)} - {actionListMap(actionsInsideMore, true)} -
- )} -
- ) : null} -
-
+
+ {actionListMap(item, actionsOutsideMore, false)} + + {/* do not display edit & delete for staff role in collection */} + {userRolePermissions.manageCollections || item !== 'collections' ? ( +
+ {moreButton} + {showMoreOptions == id && ( + + {editButton} + + {deleteButton(id, labelValue)} + {actionListMap(item, actionsInsideMore, true)} + + )} +
+ ) : null} +
); } return null; @@ -760,37 +768,6 @@ export const List = ({ buttonDisplay =
{buttonContent}
; } - const handleMouseEnter = () => { - setIsPopupOpen(true); - }; - - const handleMouseLeave = () => { - setIsPopupOpen(false); - }; - - const infoIcon = ( -
- - {isPopupOpen && helpData && ( -
-
-
- {helpData.heading} - {helpData.body} -
{ - window.location.replace(helpData.link); - }} - > - Learn more -
-
-
- )} -
- ); - return ( <> {showHeader && ( @@ -798,8 +775,8 @@ export const List = ({
- {title} - {infoIcon} +
{title}
+
diff --git a/src/containers/NotificationList/NotificationList.module.css b/src/containers/NotificationList/NotificationList.module.css index 6d312b04e..8234a5ae2 100644 --- a/src/containers/NotificationList/NotificationList.module.css +++ b/src/containers/NotificationList/NotificationList.module.css @@ -85,7 +85,7 @@ .RedirectArrow { width: 16px; - color: #119656; + color: #777; } .Mark { diff --git a/src/containers/SheetIntegration/SheetIntegrationList/SheetIntegrationList.module.css b/src/containers/SheetIntegration/SheetIntegrationList/SheetIntegrationList.module.css index 956ca0617..9ad3c197e 100644 --- a/src/containers/SheetIntegration/SheetIntegrationList/SheetIntegrationList.module.css +++ b/src/containers/SheetIntegration/SheetIntegrationList/SheetIntegrationList.module.css @@ -8,7 +8,7 @@ } .Actions { - justify-content: flex-end; + text-align: end; margin-left: auto; min-width: 200px; } diff --git a/src/i18n/en/en.json b/src/i18n/en/en.json index e6cc5d272..873767083 100644 --- a/src/i18n/en/en.json +++ b/src/i18n/en/en.json @@ -431,5 +431,7 @@ "Date and Time": "Date and Time", "Wallet balance": "Wallet balance", "Created at": "Created at", - "Webhook Logs": "Webhook Logs" + "Webhook Logs": "Webhook Logs", + "Export": "Export", + "View details": "View details" }