1
0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-12-23 01:39:44 +01:00

Fix/14230 dark mode fixes (#14305)

* Dark mode fixes

* removing unused icon svg
This commit is contained in:
George Marshall 2022-03-31 13:11:06 -07:00 committed by GitHub
parent f088db99a3
commit 8edeb9a281
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
8 changed files with 81 additions and 36 deletions

View File

@ -1,8 +0,0 @@
<svg height="32" width="33" xmlns="http://www.w3.org/2000/svg">
<g fill="none" fill-rule="evenodd">
<path d="M19.132 2.854l12.44 22.748a3 3 0 01-2.632 4.44H4.06a3 3 0 01-2.632-4.44l12.44-22.748a3 3 0 015.264 0z" stroke="#ff001f" stroke-width="2"/>
<g fill="#ff001f">
<path d="M15 8h3v13h-3zM15 23h3v3h-3z"/>
</g>
</g>
</svg>

Before

Width:  |  Height:  |  Size: 369 B

View File

@ -97,7 +97,6 @@ export default class AppHeader extends PureComponent {
render() {
const {
history,
isUnlocked,
hideNetworkIndicator,
disableNetworkIndicator,
disabled,
@ -105,11 +104,7 @@ export default class AppHeader extends PureComponent {
} = this.props;
return (
<div
className={classnames('app-header', {
'app-header--back-drop': isUnlocked,
})}
>
<div className="app-header">
<div className="app-header__contents">
<MetaFoxLogo
unsetIconHeight

View File

@ -0,0 +1,49 @@
import React from 'react';
import AppHeader from '.';
export default {
title: 'Components/App/AppHeader',
id: __filename,
argTypes: {
history: {
control: 'object',
},
networkDropdownOpen: {
control: 'boolean',
},
showNetworkDropdown: {
action: 'showNetworkDropdown',
},
hideNetworkDropdown: {
action: 'hideNetworkDropdown',
},
toggleAccountMenu: {
action: 'toggleAccountMenu',
},
selectedAddress: {
control: 'text',
},
isUnlocked: {
control: 'boolean',
},
hideNetworkIndicator: {
control: 'boolean',
},
disabled: {
control: 'boolean',
},
disableNetworkIndicator: {
control: 'boolean',
},
isAccountMenuOpen: {
control: 'boolean',
},
onClick: {
action: 'onClick',
},
},
};
export const DefaultStory = (args) => <AppHeader {...args} />;
DefaultStory.storyName = 'Default';

View File

@ -16,17 +16,6 @@
@media screen and (min-width: $break-large) {
height: 75px;
justify-content: center;
&--back-drop {
&::after {
content: '';
position: absolute;
width: 100%;
height: 32px;
background: var(--color-background-alternative);
bottom: -32px;
}
}
}
&__metafox-logo {

View File

@ -152,7 +152,7 @@
}
&__warning-container {
background: var(--color-warning-muted);
background: var(--color-error-muted);
padding: 20px;
display: flex;
align-items: start;
@ -168,6 +168,7 @@
&__warning-icon {
padding-top: 5px;
color: var(--color-error-default);
}
}

View File

@ -89,29 +89,30 @@ input.form-control {
padding-left: 10px;
font-size: 14px;
height: 40px;
border: 1px solid var(--color-border-muted);
border: 1px solid var(--color-border-default);
color: 1px solid var(--color-text-default);
background: transparent;
border-radius: 3px;
width: 100%;
&::-webkit-input-placeholder {
font-weight: 100;
color: var(--color-text-alternative);
color: var(--color-text-muted);
}
&::-moz-placeholder {
font-weight: 100;
color: var(--color-text-alternative);
color: var(--color-text-muted);
}
&:-ms-input-placeholder {
font-weight: 100;
color: var(--color-text-alternative);
color: var(--color-text-muted);
}
&:-moz-placeholder {
font-weight: 100;
color: var(--color-text-alternative);
color: var(--color-text-muted);
}
&--error {

View File

@ -40,11 +40,7 @@ class RevealSeedPage extends Component {
renderWarning() {
return (
<div className="page-container__warning-container">
<img
className="page-container__warning-icon"
src="images/warning.svg"
alt=""
/>
<i className="fa fa-exclamation-triangle fa-2x page-container__warning-icon" />
<div className="page-container__warning-message">
<div className="page-container__warning-title">
{this.context.t('revealSeedWordsWarningTitle')}

View File

@ -0,0 +1,22 @@
import React from 'react';
import RevealSeedPage from './reveal-seed';
export default {
title: 'Pages/Keychains/RevealSeedPage',
id: __filename,
argTypes: {
requestRevealSeedWords: {
action: 'requestRevealSeedWords',
},
history: {
control: 'object',
},
mostRecentOverviewPage: {
control: 'text',
},
},
};
export const DefaultStory = (args) => <RevealSeedPage {...args} />;
DefaultStory.storyName = 'Default';