mirror of
https://github.com/kremalicious/metamask-extension.git
synced 2024-12-22 17:33:23 +01:00
swap hex colors in ui/components/app folder (#14189)
This commit is contained in:
parent
e8d4f11cbf
commit
06e196441a
@ -113,7 +113,7 @@ const AddNetwork = ({
|
||||
</a>
|
||||
</>
|
||||
}
|
||||
iconFillColor="#f8c000"
|
||||
iconFillColor="var(--color-warning-default)"
|
||||
useIcon
|
||||
withRightButton
|
||||
/>
|
||||
|
@ -18,7 +18,10 @@ const AppLoadingSpinner = ({ className }) => {
|
||||
role="alert"
|
||||
aria-busy="true"
|
||||
>
|
||||
<Spinner color="#F7C06C" className="app-loading-spinner__inner" />
|
||||
<Spinner
|
||||
color="var(--color-secondary-muted)"
|
||||
className="app-loading-spinner__inner"
|
||||
/>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
@ -311,7 +311,7 @@ export default function CollectibleDetails({ collectible }) {
|
||||
{copied ? (
|
||||
t('copiedExclamation')
|
||||
) : (
|
||||
<Copy size={15} color="#6a737d" />
|
||||
<Copy size={15} color="var(--color-icon-default)" />
|
||||
)}
|
||||
</button>
|
||||
</Box>
|
||||
|
@ -146,7 +146,7 @@ export default function EditGasDisplay({
|
||||
<ActionableMessage
|
||||
className="actionable-message--warning"
|
||||
message={warningMessage}
|
||||
iconFillColor="#f8c000"
|
||||
iconFillColor="var(--color-warning-default)"
|
||||
useIcon
|
||||
/>
|
||||
</div>
|
||||
@ -156,7 +156,7 @@ export default function EditGasDisplay({
|
||||
<ActionableMessage
|
||||
className="actionable-message--warning"
|
||||
message={t('gasDisplayDappWarning', [transaction.origin])}
|
||||
iconFillColor="#f8c000"
|
||||
iconFillColor="var(--color-warning-default)"
|
||||
useIcon
|
||||
/>
|
||||
</div>
|
||||
@ -166,7 +166,7 @@ export default function EditGasDisplay({
|
||||
<ActionableMessage
|
||||
className="actionable-message--warning"
|
||||
message={t('networkIsBusy')}
|
||||
iconFillColor="#f8c000"
|
||||
iconFillColor="var(--color-warning-default)"
|
||||
useIcon
|
||||
/>
|
||||
</div>
|
||||
|
@ -136,7 +136,9 @@ const EditGasItem = ({ priorityLevel }) => {
|
||||
<div className="edit-gas-item__maxfee">
|
||||
<LoadingHeartBeat
|
||||
backgroundColor={
|
||||
priorityLevel === estimateUsed ? '#f2f3f4' : '#fff'
|
||||
priorityLevel === estimateUsed
|
||||
? 'var(--color-background-alternative)'
|
||||
: 'var(--color-background-default)'
|
||||
}
|
||||
estimateUsed={priorityLevel}
|
||||
/>
|
||||
|
@ -250,7 +250,9 @@ export default class QrScanner extends Component {
|
||||
display: ready === READY_STATE.READY ? 'block' : 'none',
|
||||
}}
|
||||
/>
|
||||
{ready === READY_STATE.READY ? null : <Spinner color="#F7C06C" />}
|
||||
{ready === READY_STATE.READY ? null : (
|
||||
<Spinner color="var(--color-secondary-muted)" />
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
<div className="qr-scanner__status">{message}</div>
|
||||
|
@ -55,7 +55,7 @@ const EnhancedReader = ({ handleScan }) => {
|
||||
filter: 'blur(4px)',
|
||||
}}
|
||||
/>
|
||||
{canplay ? null : <Spinner color="#F7C06C" />}
|
||||
{canplay ? null : <Spinner color="var(--color-secondary-muted)" />}
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
@ -63,7 +63,7 @@ class SelectedAccount extends Component {
|
||||
<div className="selected-account__address">
|
||||
{shortenAddress(checksummedAddress)}
|
||||
<div className="selected-account__copy">
|
||||
<CopyIcon size={11} color="#989a9b" />
|
||||
<CopyIcon size={11} color="var(--color-icon-default)" />
|
||||
</div>
|
||||
</div>
|
||||
</button>
|
||||
|
@ -127,7 +127,7 @@ export default function SrpInput({ onChange }) {
|
||||
</label>
|
||||
<ActionableMessage
|
||||
className="import-srp__paste-tip"
|
||||
iconFillColor="#037dd6" // This is `--color-info-default`
|
||||
iconFillColor="var(--color-info-default)"
|
||||
message={t('srpPasteTip')}
|
||||
useIcon
|
||||
/>
|
||||
@ -197,7 +197,7 @@ export default function SrpInput({ onChange }) {
|
||||
{srpError ? (
|
||||
<ActionableMessage
|
||||
className="import-srp__srp-error"
|
||||
iconFillColor="#d73a49" // This is `--color-error-default`
|
||||
iconFillColor="var(--color-error-default)"
|
||||
message={srpError}
|
||||
type="danger"
|
||||
useIcon
|
||||
@ -206,7 +206,7 @@ export default function SrpInput({ onChange }) {
|
||||
{pasteFailed ? (
|
||||
<ActionableMessage
|
||||
className="import-srp__srp-too-many-words-error"
|
||||
iconFillColor="#d73a49" // This is `--color-error-default`
|
||||
iconFillColor="var(--color-error-default)"
|
||||
message={t('srpPasteFailedTooManyWords')}
|
||||
primaryAction={{
|
||||
label: t('dismiss'),
|
||||
|
@ -29,7 +29,7 @@ export default function TokenCell({
|
||||
rel="noopener noreferrer"
|
||||
target="_blank"
|
||||
onClick={(event) => event.stopPropagation()}
|
||||
style={{ color: '#F7861C' }}
|
||||
style={{ color: 'var(--color-secondary-default)' }}
|
||||
>
|
||||
{t('here')}
|
||||
</a>
|
||||
|
@ -20,7 +20,7 @@ const CopyRawData = ({ data }) => {
|
||||
className="copy-raw-data__button"
|
||||
>
|
||||
<div className="copy-raw-data__icon">
|
||||
<CopyIcon size={12} color="#BBC0C5" />
|
||||
<CopyIcon size={12} color="var(--color-icon-default)" />
|
||||
</div>
|
||||
<div className="copy-raw-data__label">
|
||||
{t('copyRawTransactionData')}
|
||||
|
@ -202,7 +202,7 @@ export default function TransactionDecoding({ to = '', inputData: data = '' }) {
|
||||
if (loading) {
|
||||
return (
|
||||
<div className="tx-insight-loading">
|
||||
<Spinner color="#F7C06C" />
|
||||
<Spinner color="var(--color-secondary-muted)" />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
@ -23,9 +23,9 @@ const ICON_MAP = {
|
||||
[TRANSACTION_GROUP_CATEGORIES.SWAP]: Swap,
|
||||
};
|
||||
|
||||
const FAIL_COLOR = '#D73A49';
|
||||
const PENDING_COLOR = '#6A737D';
|
||||
const OK_COLOR = '#2F80ED';
|
||||
const FAIL_COLOR = 'var(--color-error-default)';
|
||||
const PENDING_COLOR = 'var(--color-icon-default)';
|
||||
const OK_COLOR = 'var(--color-primary-default)';
|
||||
|
||||
const COLOR_MAP = {
|
||||
[TRANSACTION_GROUP_STATUSES.PENDING]: PENDING_COLOR,
|
||||
|
Loading…
Reference in New Issue
Block a user