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

Align copy tooltip text and icon (#8861)

Browse Source 
Add style prop to ReactTippy to override the inline display to flex display and align items to center
This commit is contained in:
Thomas Huang 2020-06-24 15:34:18 -07:00 committed by GitHub
parent 242db43700
commit 85c81a5cfe
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 10 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
ui/app/css/itcss/components/request-decrypt-message.scss
View File

@ -173,12 +173,12 @@
padding: 5px; padding: 5px;
border-radius: 5px; border-radius: 5px;
position: relative; position: relative;
&-text { &-text {
font-size: 0.7em; font-size: 0.7em;
height: 115px; height: 115px;
} }
&-cover { &-cover {
background-color: white; background-color: white;
opacity: 0.75; opacity: 0.75;
@ -187,7 +187,7 @@
width: 100%; width: 100%;
top: 0px; top: 0px;
} }
&-lock { &-lock {
position: absolute; position: absolute;
height: 100%; height: 100%;
@ -202,12 +202,12 @@
top: calc(50% - 34px); top: calc(50% - 34px);
border-radius: 3px; border-radius: 3px;
} }
&--pressed { &--pressed {
display: none; display: none;
} }
} }
&-lock-text { &-lock-text {
width: 200px; width: 200px;
font-size: 0.75em; font-size: 0.75em;
@ -219,7 +219,7 @@
line-height: 1em; line-height: 1em;
border-radius: 3px; border-radius: 3px;
} }
&-copy { &-copy {
justify-content: space-evenly; justify-content: space-evenly;
font-size: 0.75em; font-size: 0.75em;
@ -228,12 +228,12 @@
display: flex; display: flex;
cursor: pointer; cursor: pointer;
} }
&-copy-text { &-copy-text {
margin-right: 10px; margin-right: 10px;
display: inline; display: inline;
} }
&-copy-tooltip { &-copy-tooltip {
float: right; float: right;
} }
@ -258,7 +258,7 @@
margin-right: 1.2rem; margin-right: 1.2rem;
} }
} }
&__visual { &__visual {
display: flex; display: flex;
flex-direction: row; flex-direction: row;

1
ui/app/pages/confirm-decrypt-message/confirm-decrypt-message.component.js
View File

@ -268,6 +268,7 @@ export default class ConfirmDecryptMessage extends Component {
position="bottom" position="bottom"
title={hasCopied ? t('copiedExclamation') : t('copyToClipboard')} title={hasCopied ? t('copiedExclamation') : t('copyToClipboard')}
wrapperClassName="request-decrypt-message__message-copy-tooltip" wrapperClassName="request-decrypt-message__message-copy-tooltip"
style={{ display: 'flex', alignItems: 'center' }}
> >
<div <div
className="request-decrypt-message__message-copy-text" className="request-decrypt-message__message-copy-text"