mirror of
https://github.com/kremalicious/metamask-extension.git
synced 2024-12-23 09:52:26 +01:00
Style send token screen
This commit is contained in:
parent
395e8bfce0
commit
663cb758b3
@ -232,6 +232,8 @@ class AccountDropdowns extends Component {
|
||||
const dropdownMenuItemStyle = {
|
||||
fontFamily: 'DIN OT',
|
||||
fontSize: 16,
|
||||
lineHeight: '24px',
|
||||
padding: '8px',
|
||||
}
|
||||
|
||||
return h(
|
||||
@ -347,15 +349,9 @@ class AccountDropdowns extends Component {
|
||||
[
|
||||
enableAccountsSelector && h(
|
||||
'i.fa.fa-angle-down',
|
||||
// 'div.cursor-pointer.color-orange.accounts-selector',
|
||||
{
|
||||
style: {
|
||||
// fontSize: '135%',
|
||||
// background: 'url(images/switch_acc.svg) white center center no-repeat',
|
||||
// height: '25px',
|
||||
// width: '25px',
|
||||
// transform: 'scale(0.75)',
|
||||
// marginRight: '3px',
|
||||
cursor: 'pointer',
|
||||
},
|
||||
onClick: (event) => {
|
||||
event.stopPropagation()
|
||||
@ -372,6 +368,7 @@ class AccountDropdowns extends Component {
|
||||
{
|
||||
style: {
|
||||
fontSize: '135%',
|
||||
cursor: 'pointer',
|
||||
},
|
||||
onClick: (event) => {
|
||||
event.stopPropagation()
|
||||
|
@ -40,7 +40,11 @@ class Dropdown extends Component {
|
||||
h(
|
||||
'style',
|
||||
`
|
||||
li.dropdown-menu-item:hover { color:rgb(225, 225, 225); }
|
||||
li.dropdown-menu-item:hover {
|
||||
color:rgb(225, 225, 225);
|
||||
background-color: rgba(255, 255, 255, 0.05);
|
||||
border-radius: 4px;
|
||||
}
|
||||
li.dropdown-menu-item { color: rgb(185, 185, 185); }
|
||||
`
|
||||
),
|
||||
|
@ -49,6 +49,7 @@ InputNumber.prototype.render = function () {
|
||||
onClick: () => this.setValue(value + step),
|
||||
}),
|
||||
h('i.fa.fa-angle-down', {
|
||||
style: { cursor: 'pointer' },
|
||||
onClick: () => this.setValue(value - step),
|
||||
}),
|
||||
]),
|
||||
|
@ -39,21 +39,17 @@ module.exports = connect(mapStateToProps, mapDispatchToProps)(AccountDetailsModa
|
||||
AccountDetailsModal.prototype.render = function () {
|
||||
const { selectedIdentity, network } = this.props
|
||||
|
||||
return h('div', {}, [
|
||||
h('div.account-details-modal-wrapper', {
|
||||
}, [
|
||||
return h('div', { style: { borderRadius: '4px' }}, [
|
||||
h('div.account-details-modal-wrapper', [
|
||||
|
||||
h('div', {}, [
|
||||
h('div', [
|
||||
|
||||
// Needs a border; requires changes to svg
|
||||
h(
|
||||
Identicon,
|
||||
{
|
||||
address: selectedIdentity.address,
|
||||
diameter: 64,
|
||||
style: {},
|
||||
},
|
||||
),
|
||||
h(Identicon, {
|
||||
address: selectedIdentity.address,
|
||||
diameter: 64,
|
||||
style: {},
|
||||
}),
|
||||
|
||||
]),
|
||||
|
||||
@ -66,26 +62,20 @@ AccountDetailsModal.prototype.render = function () {
|
||||
message: this.props.selectedIdentity.name,
|
||||
data: this.props.selectedIdentity.address,
|
||||
},
|
||||
}, []),
|
||||
}),
|
||||
|
||||
// divider
|
||||
h('div.account-details-modal-divider', {
|
||||
style: {},
|
||||
}, []),
|
||||
h('div.account-details-modal-divider'),
|
||||
|
||||
h('button.btn-clear', {
|
||||
onClick: () => {
|
||||
const url = genAccountLink(selectedIdentity.address, network)
|
||||
global.platform.openWindow({ url })
|
||||
},
|
||||
}, [
|
||||
'View account on Etherscan',
|
||||
]),
|
||||
}, [ 'View account on Etherscan' ]),
|
||||
|
||||
// Holding on redesign for Export Private Key functionality
|
||||
h('button.btn-clear', {}, [
|
||||
'Export private key',
|
||||
]),
|
||||
h('button.btn-clear', [ 'Export private key' ]),
|
||||
|
||||
]),
|
||||
])
|
||||
|
@ -62,6 +62,9 @@ const MODALS = {
|
||||
boxShadow: 'rgba(0, 0, 0, 0.15) 0px 2px 2px 2px',
|
||||
borderRadius: '4px',
|
||||
},
|
||||
contentStyle: {
|
||||
borderRadius: '4px',
|
||||
}
|
||||
},
|
||||
|
||||
NEW_ACCOUNT: {
|
||||
@ -117,6 +120,7 @@ Modal.prototype.render = function () {
|
||||
|
||||
const children = modal.contents
|
||||
const modalStyle = modal[isMobileView() ? 'mobileModalStyle' : 'laptopModalStyle']
|
||||
const contentStyle = modal.contentStyle || {};
|
||||
|
||||
return h(FadeModal,
|
||||
{
|
||||
@ -127,6 +131,7 @@ Modal.prototype.render = function () {
|
||||
this.modalRef = ref
|
||||
},
|
||||
modalStyle,
|
||||
contentStyle,
|
||||
backdropStyle: BACKDROPSTYLE,
|
||||
},
|
||||
children,
|
||||
|
@ -180,6 +180,10 @@
|
||||
border: 1px solid $silver;
|
||||
border-radius: 4px;
|
||||
font-family: 'Montserrat UltraLight';
|
||||
|
||||
button {
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
.account-details-modal-wrapper .qr-header {
|
||||
@ -231,7 +235,12 @@
|
||||
}
|
||||
|
||||
.account-details-modal-wrapper .identicon {
|
||||
margin-top: -55.5%;
|
||||
position: relative;
|
||||
left: 0;
|
||||
right: 0;
|
||||
margin: 0 auto;
|
||||
top: -32px;
|
||||
margin-bottom: -32px;
|
||||
}
|
||||
|
||||
.account-details-modal-close::after {
|
||||
@ -241,6 +250,7 @@
|
||||
position: absolute;
|
||||
top: 10px;
|
||||
right: 12px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
// New Account Modal
|
||||
|
@ -243,4 +243,23 @@
|
||||
line-height: 40px;
|
||||
margin-top: 13px;
|
||||
}
|
||||
|
||||
.send-screen-input-wrapper {
|
||||
.fa-bolt {
|
||||
padding-right: 4px;
|
||||
}
|
||||
|
||||
.large-input {
|
||||
border: 1px solid $dusty-gray;
|
||||
border-radius: 4px;
|
||||
margin: 4px 0 20px;
|
||||
font-size: 16px;
|
||||
line-height: 22.4px;
|
||||
font-family: "DIN OT";
|
||||
}
|
||||
|
||||
.send-screen-gas-input {
|
||||
border: 1px solid transparent;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
Loading…
Reference in New Issue
Block a user