From 139a775d3cf59d61e4bdd9394fbbc2930fb19d2e Mon Sep 17 00:00:00 2001 From: UncleBill Date: Fri, 27 Oct 2023 17:10:09 +0800 Subject: [PATCH] fix: color of some text on dark mode (#11045) --- packages/icons/general/Lock.svg | 7 +- packages/icons/icon-generated-as-jsx.js | 34 +++++- packages/mask/shared-ui/locales/en-US.json | 4 +- .../InjectedComponents/ProfileTabContent.tsx | 1 + .../popups/modals/AddContactModal/index.tsx | 2 +- .../popups/modals/EditContactModal/index.tsx | 2 +- .../extension/popups/pages/Settings/index.tsx | 22 ++-- .../NextID/src/components/Actions/index.tsx | 9 +- .../NextID/src/components/NextIdPage.tsx | 8 +- .../Snapshot/src/SiteAdaptor/Snapshot.tsx | 111 ++++++++++-------- .../Snapshot/src/SiteAdaptor/VotesCard.tsx | 2 +- .../UI/components/PluginCardFrame/index.tsx | 1 + .../ProfileTab/WalletSettingEntry.tsx | 6 +- 13 files changed, 127 insertions(+), 82 deletions(-) diff --git a/packages/icons/general/Lock.svg b/packages/icons/general/Lock.svg index 79a1f7e5de78..95c3b16efb9c 100644 --- a/packages/icons/general/Lock.svg +++ b/packages/icons/general/Lock.svg @@ -1 +1,6 @@ - \ No newline at end of file + + + + + + diff --git a/packages/icons/icon-generated-as-jsx.js b/packages/icons/icon-generated-as-jsx.js index 07a19fffd6ac..4e458ba74cc7 100644 --- a/packages/icons/icon-generated-as-jsx.js +++ b/packages/icons/icon-generated-as-jsx.js @@ -2205,11 +2205,35 @@ export const LocalBackup = /*#__PURE__*/ __createIcon('LocalBackup', [ u: () => new URL('./general/LocalBackup.png', import.meta.url), }, ]) -export const Lock = /*#__PURE__*/ __createIcon('Lock', [ - { - u: () => new URL('./general/Lock.svg', import.meta.url), - }, -]) +export const Lock = /*#__PURE__*/ __createIcon( + 'Lock', + [ + { + u: () => new URL('./general/Lock.svg', import.meta.url), + j: () => + /*#__PURE__*/ _jsx('svg', { + xmlns: 'http://www.w3.org/2000/svg', + fill: 'none', + viewBox: '0 0 24 25', + children: /*#__PURE__*/ _jsxs('g', { + fill: 'currentColor', + fillRule: 'evenodd', + clipRule: 'evenodd', + children: [ + /*#__PURE__*/ _jsx('path', { + d: 'M7.748 5.01c-.697.866-.948 2.132-.948 3.74v2a.8.8 0 0 1-1.6 0v-2c0-1.704.25-3.438 1.302-4.744C7.585 2.662 9.363 1.95 12 1.95s4.416.713 5.498 2.057C18.55 5.312 18.8 7.046 18.8 8.75v2a.8.8 0 0 1-1.6 0v-2c0-1.607-.25-2.873-.948-3.74-.667-.828-1.889-1.46-4.252-1.46s-3.584.632-4.252 1.46zM12 15.05a1.7 1.7 0 1 0 0 3.4 1.7 1.7 0 0 0 0-3.4zm-3.3 1.7a3.3 3.3 0 1 1 6.6 0 3.3 3.3 0 0 1-6.6 0z', + }), + /*#__PURE__*/ _jsx('path', { + d: 'M3.566 12.315c-.496.495-.766 1.428-.766 3.434v2c0 2.006.27 2.939.766 3.434.495.496 1.428.766 3.434.766h10c2.006 0 2.939-.27 3.434-.766.496-.495.766-1.428.766-3.434v-2c0-2.006-.27-2.939-.765-3.434-.496-.496-1.43-.766-3.435-.766H7c-2.006 0-2.939.27-3.434.766zm-1.131-1.131C3.439 10.178 5.005 9.949 7 9.949h10c1.994 0 3.561.23 4.566 1.235 1.004 1.004 1.234 2.57 1.234 4.565v2c0 1.995-.23 3.562-1.234 4.566-1.005 1.004-2.572 1.234-4.566 1.234H7c-1.994 0-3.561-.23-4.565-1.234C1.43 21.31 1.2 19.743 1.2 17.749v-2c0-1.994.23-3.561 1.235-4.566z', + }), + ], + }), + }), + s: true, + }, + ], + [24, 25], +) export const MaskAvatar = /*#__PURE__*/ __createIcon('MaskAvatar', [ { c: ['dark'], diff --git a/packages/mask/shared-ui/locales/en-US.json b/packages/mask/shared-ui/locales/en-US.json index 17276351719f..0b06e90c35ae 100644 --- a/packages/mask/shared-ui/locales/en-US.json +++ b/packages/mask/shared-ui/locales/en-US.json @@ -261,7 +261,7 @@ "export": "Export", "confirm_swap_risk": "Confirm swap risk", "wallet_load_retry": "Failed to load {{symbol}}. Click to retry.", - "wallet_name": "Wallet Name", + "name": "Name", "wallet_rename": "Rename Wallet", "wallet_loading_nft_contract": "Loading NFT contract...", "wallet_search_contract_no_result": "No results or contract address does not meet the query criteria.", @@ -1157,7 +1157,7 @@ "wallet_edit_contact_successfully": "Edit contact successfully.", "wallet_delete_contact": "Delete Contact", "wallet_delete_contact_successfully": "Delete contact successfully.", - "wallet_name_wallet": "Name your wallet", + "wallet_name": "Name your wallet", "wallet_account": "Wallet Account", "wallet_imported": "Imported", "scan_address_to_payment": "Scan QR code to receive payment", diff --git a/packages/mask/src/components/InjectedComponents/ProfileTabContent.tsx b/packages/mask/src/components/InjectedComponents/ProfileTabContent.tsx index 701d2208c5ca..608da0844157 100644 --- a/packages/mask/src/components/InjectedComponents/ProfileTabContent.tsx +++ b/packages/mask/src/components/InjectedComponents/ProfileTabContent.tsx @@ -57,6 +57,7 @@ import Services from '#services' const useStyles = makeStyles()((theme) => ({ root: { width: Sniffings.is_facebook_page ? 876 : 'auto', + color: theme.palette.maskColor.main, }, container: { background: diff --git a/packages/mask/src/extension/popups/modals/AddContactModal/index.tsx b/packages/mask/src/extension/popups/modals/AddContactModal/index.tsx index 1a3f64f5374d..4c79bcb7c339 100644 --- a/packages/mask/src/extension/popups/modals/AddContactModal/index.tsx +++ b/packages/mask/src/extension/popups/modals/AddContactModal/index.tsx @@ -97,7 +97,7 @@ function AddContactDrawer({ onConfirm, address, name, setName, setAddress, ...re { diff --git a/packages/mask/src/extension/popups/modals/EditContactModal/index.tsx b/packages/mask/src/extension/popups/modals/EditContactModal/index.tsx index e843c547d2eb..4af97f445a3c 100644 --- a/packages/mask/src/extension/popups/modals/EditContactModal/index.tsx +++ b/packages/mask/src/extension/popups/modals/EditContactModal/index.tsx @@ -134,7 +134,7 @@ function EditContactDrawer({ onConfirm, address, name, setName, type, ...rest }: inputProps={{ style: { textAlign: 'center' } }} classes={{ root: classes.inputRoot }} spellCheck={false} - placeholder={t('wallet_name_wallet')} + placeholder={t('name')} className={classes.input} value={name} onChange={(ev) => { diff --git a/packages/mask/src/extension/popups/pages/Settings/index.tsx b/packages/mask/src/extension/popups/pages/Settings/index.tsx index 35a63a82b7cb..c8a6bf24f6f5 100644 --- a/packages/mask/src/extension/popups/pages/Settings/index.tsx +++ b/packages/mask/src/extension/popups/pages/Settings/index.tsx @@ -1,24 +1,24 @@ +import Services from '#services' +import { env } from '@masknet/flags' +import { Icons } from '@masknet/icons' +import { Appearance, LanguageOptions } from '@masknet/public-api' +import { DashboardRoutes, PopupModalRoutes, Sniffings } from '@masknet/shared-base' +import { openWindow } from '@masknet/shared-base-ui' +import { makeStyles } from '@masknet/theme' +import { Box, List, ListItem, ListItemText, Typography, useTheme } from '@mui/material' import { memo, useCallback, useMemo } from 'react' import { Trans } from 'react-i18next' -import { Box, List, ListItem, ListItemText, Typography, useTheme } from '@mui/material' +import { UserContext, useAppearance, useLanguage } from '../../../../../shared-ui/index.js' import { useI18N } from '../../../../utils/i18n-next-ui.js' -import { useTitle } from '../../hooks/useTitle.js' -import { makeStyles } from '@masknet/theme' -import { Icons } from '@masknet/icons' import { NormalHeader, useModalNavigate } from '../../components/index.js' -import { env } from '@masknet/flags' -import { UserContext, useAppearance, useLanguage } from '../../../../../shared-ui/index.js' -import { Appearance, LanguageOptions } from '@masknet/public-api' -import { openWindow } from '@masknet/shared-base-ui' -import { DashboardRoutes, PopupModalRoutes, Sniffings } from '@masknet/shared-base' import { useSupportedSites } from '../../hooks/useSupportedSites.js' -import Services from '#services' +import { useTitle } from '../../hooks/useTitle.js' const useStyles = makeStyles()((theme) => ({ container: { padding: theme.spacing(2), flex: 1, - maxHeight: 474, + paddingBottom: 80, overflow: 'auto', display: 'flex', flexDirection: 'column', diff --git a/packages/plugins/NextID/src/components/Actions/index.tsx b/packages/plugins/NextID/src/components/Actions/index.tsx index 31543ac52b74..c2b9a6158f65 100644 --- a/packages/plugins/NextID/src/components/Actions/index.tsx +++ b/packages/plugins/NextID/src/components/Actions/index.tsx @@ -1,6 +1,6 @@ import { memo } from 'react' import { makeStyles } from '@masknet/theme' -import { Button, Stack, Typography } from '@mui/material' +import { Button, Stack, Typography, useTheme } from '@mui/material' import { Icons } from '@masknet/icons' import { useI18N } from '../../locales/index.js' import { PersonaSelectPanel } from '@masknet/shared' @@ -64,11 +64,11 @@ interface AddWalletPersonaActionProps { export const AddWalletPersonaAction = memo(({ onAddWallet }) => { const t = useI18N() - const { classes } = useStyles() + const { classes, theme } = useStyles() return ( <> - + {t.add_wallet_intro()} @@ -84,9 +84,10 @@ export const AddWalletPersonaAction = memo(({ onAdd export const OtherLackWalletAction = memo(() => { const t = useI18N() + const theme = useTheme() return ( - + {t.others_lack_wallet()} diff --git a/packages/plugins/NextID/src/components/NextIdPage.tsx b/packages/plugins/NextID/src/components/NextIdPage.tsx index 71d5b3679e33..387273d0abd6 100644 --- a/packages/plugins/NextID/src/components/NextIdPage.tsx +++ b/packages/plugins/NextID/src/components/NextIdPage.tsx @@ -82,11 +82,11 @@ export const NextIdPage = memo(function NextIdPage() { return ( <> - - + + {ActionComponent} - - + + {openBindDialog && currentPersona && isOwn ? ( { return { @@ -101,57 +108,63 @@ export function Snapshot() { - - - + + + + {proposal.space.name} + + } + placement="top" + classes={{ tooltip: classes.tooltip, arrow: classes.arrow }} + arrow> + + {proposal.space.name} + + + + + by + + + {proposal.space.id} + + + + + - {proposal.space.name} - - } + title={{proposal.title}} placement="top" classes={{ tooltip: classes.tooltip, arrow: classes.arrow }} arrow> - - {proposal.space.name} - - - - by - - - {proposal.space.id} + fontWeight="700" + color={theme.palette.maskColor.publicSecond} + sx={{ width: 300, whiteSpace: 'nowrap', textOverflow: 'ellipsis', overflow: 'hidden' }}> + {proposal.title} - + - - {proposal.title}} - placement="top" - classes={{ tooltip: classes.tooltip, arrow: classes.arrow }} - arrow> - - {proposal.title} - - - + }> - {votes.map(function voteItemIter(v) { + {votes?.map(function voteItemIter(v) { const isAverageWeight = v.choices?.every((c) => c.weight === 1) const fullChoiceText = v.totalWeight && v.choices diff --git a/packages/shared/src/UI/components/PluginCardFrame/index.tsx b/packages/shared/src/UI/components/PluginCardFrame/index.tsx index fe6b91d88a4c..8b90574ca59e 100644 --- a/packages/shared/src/UI/components/PluginCardFrame/index.tsx +++ b/packages/shared/src/UI/components/PluginCardFrame/index.tsx @@ -10,6 +10,7 @@ const useStyles = makeStyles()((theme) => ({ display: 'flex', alignItems: 'center', justifyContent: 'center', + color: theme.palette.maskColor.main, }, container: { background: diff --git a/packages/shared/src/UI/components/ProfileTabContent/ProfileTab/WalletSettingEntry.tsx b/packages/shared/src/UI/components/ProfileTabContent/ProfileTab/WalletSettingEntry.tsx index 475a54037525..2987fd8b5c9a 100644 --- a/packages/shared/src/UI/components/ProfileTabContent/ProfileTab/WalletSettingEntry.tsx +++ b/packages/shared/src/UI/components/ProfileTabContent/ProfileTab/WalletSettingEntry.tsx @@ -1,8 +1,8 @@ +import { memo } from 'react' import { Icons } from '@masknet/icons' import { CrossIsolationMessages } from '@masknet/shared-base' import { makeStyles } from '@masknet/theme' import { Button, Stack, Typography } from '@mui/material' -import { memo } from 'react' import { useSharedI18N } from '../../../../locales/index.js' const useStyles = makeStyles()((theme) => ({ @@ -22,12 +22,12 @@ function openWeb3ProfileSettingDialog() { } export const WalletSettingEntry = memo(function WalletSettingEntry() { const t = useSharedI18N() - const { classes } = useStyles() + const { classes, theme } = useStyles() return ( <> - + {t.show_wallet_setting_intro()}