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

Fix styling on confirm-send-ether and confirm-send-token (#3600)

Browse Source
This commit is contained in:
Alexander Tseung 2018-03-16 16:39:00 -07:00 committed by GitHub
parent 3bc8493166
commit 4512243290
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 247 additions and 241 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
test/integration/lib/send-new-ui.js
View File

@ -167,7 +167,7 @@ async function runSendFlowTest(assert, done) {
// TODO: Need a way to mock background so that we can test correct transition from editing to confirm // TODO: Need a way to mock background so that we can test correct transition from editing to confirm
selectState.val('confirm new ui') selectState.val('confirm new ui')
reactTriggerChange(selectState[0]) reactTriggerChange(selectState[0])
const confirmScreenConfirmButton = await queryAsync($, '.confirm-screen-confirm-button') const confirmScreenConfirmButton = await queryAsync($, '.btn-confirm.page-container__footer-button')
console.log(`+++++++++++++++++++++++++++++++= confirmScreenConfirmButton[0]`, confirmScreenConfirmButton[0]); console.log(`+++++++++++++++++++++++++++++++= confirmScreenConfirmButton[0]`, confirmScreenConfirmButton[0]);
confirmScreenConfirmButton[0].click() confirmScreenConfirmButton[0].click()

2
ui/app/components/pending-tx/confirm-deploy-contract.js
View File

@ -293,7 +293,7 @@ class ConfirmDeployContract extends Component {
]), ]),
h('form#pending-tx-form', { h('form#pending-tx-form', {
onClick: event => this.onSubmit(event), onSubmit: event => this.onSubmit(event),
}, [ }, [
h('.page-container__footer', [ h('.page-container__footer', [
// Cancel Button // Cancel Button

156
ui/app/components/pending-tx/confirm-send-ether.js
View File

@ -224,6 +224,7 @@ ConfirmSendEther.prototype.render = function () {
h('div.page-container__title', 'Confirm'), h('div.page-container__title', 'Confirm'),
h('div.page-container__subtitle', `Please review your transaction.`), h('div.page-container__subtitle', `Please review your transaction.`),
]), ]),
h('.page-container__content', [
h('div.flex-row.flex-center.confirm-screen-identicons', [ h('div.flex-row.flex-center.confirm-screen-identicons', [
h('div.confirm-screen-account-wrapper', [ h('div.confirm-screen-account-wrapper', [
h( h(
@ -292,7 +293,7 @@ ConfirmSendEther.prototype.render = function () {
]), ]),
h('section.flex-row.flex-center.confirm-screen-total-box ', [ h('section.flex-row.flex-center.confirm-screen-row.confirm-screen-total-box ', [
h('div.confirm-screen-section-column', [ h('div.confirm-screen-section-column', [
h('span.confirm-screen-label', [ t('total') + ' ' ]), h('span.confirm-screen-label', [ t('total') + ' ' ]),
h('div.confirm-screen-total-box__subtitle', [ t('amountPlusGas') ]), h('div.confirm-screen-total-box__subtitle', [ t('amountPlusGas') ]),
@ -305,92 +306,93 @@ ConfirmSendEther.prototype.render = function () {
]), ]),
]), ]),
// These are latest errors handling from master // These are latest errors handling from master
// Leaving as comments as reference when we start implementing error handling // Leaving as comments as reference when we start implementing error handling
// h('style', ` // h('style', `
// .conf-buttons button { // .conf-buttons button {
// margin-left: 10px; // margin-left: 10px;
// text-transform: uppercase; // text-transform: uppercase;
// } // }
// `), // `),
// txMeta.simulationFails ? // txMeta.simulationFails ?
// h('.error', { // h('.error', {
// style: { // style: {
// marginLeft: 50, // marginLeft: 50,
// fontSize: '0.9em', // fontSize: '0.9em',
// }, // },
// }, 'Transaction Error. Exception thrown in contract code.') // }, 'Transaction Error. Exception thrown in contract code.')
// : null, // : null,
// !isValidAddress ? // !isValidAddress ?
// h('.error', { // h('.error', {
// style: { // style: {
// marginLeft: 50, // marginLeft: 50,
// fontSize: '0.9em', // fontSize: '0.9em',
// }, // },
// }, 'Recipient address is invalid. Sending this transaction will result in a loss of ETH.') // }, 'Recipient address is invalid. Sending this transaction will result in a loss of ETH.')
// : null, // : null,
// insufficientBalance ? // insufficientBalance ?
// h('span.error', { // h('span.error', {
// style: { // style: {
// marginLeft: 50, // marginLeft: 50,
// fontSize: '0.9em', // fontSize: '0.9em',
// }, // },
// }, 'Insufficient balance for transaction') // }, 'Insufficient balance for transaction')
// : null, // : null,
// // send + cancel // // send + cancel
// h('.flex-row.flex-space-around.conf-buttons', { // h('.flex-row.flex-space-around.conf-buttons', {
// style: { // style: {
// display: 'flex', // display: 'flex',
// justifyContent: 'flex-end', // justifyContent: 'flex-end',
// margin: '14px 25px', // margin: '14px 25px',
// }, // },
// }, [ // }, [
// h('button', { // h('button', {
// onClick: (event) => { // onClick: (event) => {
// this.resetGasFields() // this.resetGasFields()
// event.preventDefault() // event.preventDefault()
// }, // },
// }, 'Reset'), // }, 'Reset'),
// // Accept Button or Buy Button // // Accept Button or Buy Button
// insufficientBalance ? h('button.btn-green', { onClick: props.buyEth }, 'Buy Ether') : // insufficientBalance ? h('button.btn-green', { onClick: props.buyEth }, 'Buy Ether') :
// h('input.confirm.btn-green', { // h('input.confirm.btn-green', {
// type: 'submit', // type: 'submit',
// value: 'SUBMIT', // value: 'SUBMIT',
// style: { marginLeft: '10px' }, // style: { marginLeft: '10px' },
// disabled: buyDisabled, // disabled: buyDisabled,
// }), // }),
// h('button.cancel.btn-red', { // h('button.cancel.btn-red', {
// onClick: props.cancelTransaction, // onClick: props.cancelTransaction,
// }, 'Reject'), // }, 'Reject'),
// ]), // ]),
// showRejectAll ? h('.flex-row.flex-space-around.conf-buttons', { // showRejectAll ? h('.flex-row.flex-space-around.conf-buttons', {
// style: { // style: {
// display: 'flex', // display: 'flex',
// justifyContent: 'flex-end', // justifyContent: 'flex-end',
// margin: '14px 25px', // margin: '14px 25px',
// }, // },
// }, [ // }, [
// h('button.cancel.btn-red', { // h('button.cancel.btn-red', {
// onClick: props.cancelAllTransactions, // onClick: props.cancelAllTransactions,
// }, 'Reject All'), // }, 'Reject All'),
// ]) : null, // ]) : null,
// ]), // ]),
// ]) // ])
// ) // )
// } // }
]), ]),
h('form#pending-tx-form', { h('form#pending-tx-form', {
onSubmit: this.onSubmit, onSubmit: this.onSubmit,
}, [ }, [
h('.page-container__footer', [
// Cancel Button // Cancel Button
h('div.cancel.btn-light.confirm-screen-cancel-button.allcaps', { h('button.btn-cancel.page-container__footer-button.allcaps', {
onClick: (event) => { onClick: (event) => {
clearSend() clearSend()
this.cancel(event, txMeta) this.cancel(event, txMeta)
@ -398,7 +400,9 @@ ConfirmSendEther.prototype.render = function () {
}, t('cancel')), }, t('cancel')),
// Accept Button // Accept Button
h('button.confirm-screen-confirm-button.allcaps', [t('confirm')]), h('button.btn-confirm.page-container__footer-button.allcaps', [t('confirm')]),
]),
]),
]), ]),
]) ])
) )

16
ui/app/components/pending-tx/confirm-send-token.js
View File

@ -265,7 +265,7 @@ ConfirmSendToken.prototype.renderTotalPlusGas = function () {
return fiatAmount && fiatGas return fiatAmount && fiatGas
? ( ? (
h('section.flex-row.flex-center.confirm-screen-total-box ', [ h('section.flex-row.flex-center.confirm-screen-row.confirm-screen-total-box ', [
h('div.confirm-screen-section-column', [ h('div.confirm-screen-section-column', [
h('span.confirm-screen-label', [ t('total') + ' ' ]), h('span.confirm-screen-label', [ t('total') + ' ' ]),
h('div.confirm-screen-total-box__subtitle', [ t('amountPlusGas') ]), h('div.confirm-screen-total-box__subtitle', [ t('amountPlusGas') ]),
@ -278,7 +278,7 @@ ConfirmSendToken.prototype.renderTotalPlusGas = function () {
]) ])
) )
: ( : (
h('section.flex-row.flex-center.confirm-screen-total-box ', [ h('section.flex-row.flex-center.confirm-screen-row.confirm-screen-total-box ', [
h('div.confirm-screen-section-column', [ h('div.confirm-screen-section-column', [
h('span.confirm-screen-label', [ t('total') + ' ' ]), h('span.confirm-screen-label', [ t('total') + ' ' ]),
h('div.confirm-screen-total-box__subtitle', [ t('amountPlusGas') ]), h('div.confirm-screen-total-box__subtitle', [ t('amountPlusGas') ]),
@ -319,6 +319,7 @@ ConfirmSendToken.prototype.render = function () {
h('div.page-container__title', t('confirm')), h('div.page-container__title', t('confirm')),
h('div.page-container__subtitle', t('pleaseReviewTransaction')), h('div.page-container__subtitle', t('pleaseReviewTransaction')),
]), ]),
h('.page-container__content', [
h('div.flex-row.flex-center.confirm-screen-identicons', [ h('div.flex-row.flex-center.confirm-screen-identicons', [
h('div.confirm-screen-account-wrapper', [ h('div.confirm-screen-account-wrapper', [
h( h(
@ -378,21 +379,22 @@ ConfirmSendToken.prototype.render = function () {
this.renderTotalPlusGas(), this.renderTotalPlusGas(),
]), ]),
]),
]),
h('form#pending-tx-form', { h('form#pending-tx-form', {
onSubmit: this.onSubmit, onSubmit: this.onSubmit,
}, [ }, [
h('.page-container__footer', [
// Cancel Button // Cancel Button
h('div.cancel.btn-light.confirm-screen-cancel-button.allcaps', { h('button.btn-cancel.page-container__footer-button.allcaps', {
onClick: (event) => this.cancel(event, txMeta), onClick: (event) => this.cancel(event, txMeta),
}, t('cancel')), }, t('cancel')),
// Accept Button // Accept Button
h('button.confirm-screen-confirm-button.allcaps', [t('confirm')]), h('button.btn-confirm.page-container__footer-button.allcaps', [t('confirm')]),
]),
]),
]), ]),
]) ])
) )
} }