m/metamask-extension
1
0
Fork 0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-12-23 09:52:26 +01:00
Code

Dark mode: Removing double and single arrows svg icons for confirm-page-container-navigation (#14136)

Browse Source
This commit is contained in:
George Marshall 2022-03-23 08:48:48 -07:00 committed by GitHub
parent e260bd95fc
commit cbaedf55e1
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 17 additions and 30 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
app/images/double-arrow.svg
View File

@ -1,5 +0,0 @@
<svg height="8" width="12" xmlns="http://www.w3.org/2000/svg">
<g fill="#5f5c5d" fill-rule="evenodd">
<path d="M12 0v8L6 4zM6 0v8L0 4z"/>
</g>
</svg>
Side by Side

Before

Width:  |  Height:  |  Size: 166 B

3
app/images/single-arrow.svg
View File

@ -1,3 +0,0 @@
<svg height="8" width="6" xmlns="http://www.w3.org/2000/svg">
<path d="M6 0v8L0 4z" fill="#5f5c5d" fill-rule="evenodd"/>
</svg>
Side by Side

Before

Width:  |  Height:  |  Size: 132 B

32
ui/components/app/confirm-page-container/confirm-page-container-navigation/confirm-page-container-navigation.component.js
View File

@ -28,20 +28,20 @@ const ConfirmPageContainerNavigation = (props) => {
visibility: prevTxId ? 'initial' : 'hidden', visibility: prevTxId ? 'initial' : 'hidden',
}} }}
> >
<div <button
className="confirm-page-container-navigation__arrow" className="confirm-page-container-navigation__arrow"
data-testid="first-page" data-testid="first-page"
onClick={() => onNextTx(firstTx)} onClick={() => onNextTx(firstTx)}
> >
<img src="./images/double-arrow.svg" alt="" /> <i className="fa fa-angle-double-left fa-2x" />
</div> </button>
<div <button
className="confirm-page-container-navigation__arrow" className="confirm-page-container-navigation__arrow"
data-testid="previous-page" data-testid="previous-page"
onClick={() => onNextTx(prevTxId)} onClick={() => onNextTx(prevTxId)}
> >
<img src="./images/single-arrow.svg" alt="" /> <i className="fa fa-angle-left fa-2x" />
</div> </button>
</div> </div>
<div className="confirm-page-container-navigation__textcontainer"> <div className="confirm-page-container-navigation__textcontainer">
<div className="confirm-page-container-navigation__navtext"> <div className="confirm-page-container-navigation__navtext">
@ -57,28 +57,20 @@ const ConfirmPageContainerNavigation = (props) => {
visibility: nextTxId ? 'initial' : 'hidden', visibility: nextTxId ? 'initial' : 'hidden',
}} }}
> >
<div <button
className="confirm-page-container-navigation__arrow" className="confirm-page-container-navigation__arrow"
data-testid="next-page" data-testid="next-page"
onClick={() => onNextTx(nextTxId)} onClick={() => onNextTx(nextTxId)}
> >
<img <i className="fa fa-angle-right fa-2x" />
className="confirm-page-container-navigation__imageflip" </button>
src="./images/single-arrow.svg" <button
alt=""
/>
</div>
<div
className="confirm-page-container-navigation__arrow" className="confirm-page-container-navigation__arrow"
data-testid="last-page" data-testid="last-page"
onClick={() => onNextTx(lastTx)} onClick={() => onNextTx(lastTx)}
> >
<img <i className="fa fa-angle-double-right fa-2x" />
className="confirm-page-container-navigation__imageflip" </button>
src="./images/double-arrow.svg"
alt=""
/>
</div>
</div> </div>
</div> </div>
); );

7
ui/components/app/confirm-page-container/confirm-page-container-navigation/index.scss
View File

@ -13,8 +13,11 @@
&__arrow { &__arrow {
cursor: pointer; cursor: pointer;
display: flex; display: flex;
padding-left: 5px; padding-left: 4px;
padding-right: 5px; padding-right: 4px;
background: none;
border: none;
color: var(--color-icon-default);
} }
&__arrow:hover { &__arrow:hover {