diff --git a/test/integration/lib/tx-list-items.js b/test/integration/lib/tx-list-items.js index 6b67b1d2e..b7aca44d5 100644 --- a/test/integration/lib/tx-list-items.js +++ b/test/integration/lib/tx-list-items.js @@ -31,8 +31,8 @@ async function runTxListItemsTest (assert, done) { assert.equal($(unapprovedTx).hasClass('tx-list-pending-item-container'), true, 'unapprovedTx has the correct class') const retryTx = txListItems[1] - const retryTxLink = await findAsync($(retryTx), '.tx-list-item-retry-link') - assert.equal(retryTxLink[0].textContent, 'Increase the gas price on your transaction', 'retryTx has expected link') + const retryTxLink = await findAsync($(retryTx), '.tx-list-item-retry-container span') + assert.equal(retryTxLink[0].textContent, 'Taking too long? Increase the gas price on your transaction', 'retryTx has expected link') const approvedTx = txListItems[2] const approvedTxRenderedStatus = await findAsync($(approvedTx), '.tx-list-status') diff --git a/ui/app/components/tx-list-item.js b/ui/app/components/tx-list-item.js index e539514ec..0d693b805 100644 --- a/ui/app/components/tx-list-item.js +++ b/ui/app/components/tx-list-item.js @@ -307,20 +307,16 @@ TxListItem.prototype.render = function () { ]), ]), - this.showRetryButton() && h('div.tx-list-item-retry-container', [ - - h('span.tx-list-item-retry-copy', 'Taking too long?'), - - h('span.tx-list-item-retry-link', { - onClick: (event) => { - event.stopPropagation() - if (isTokenTx) { - this.setSelectedToken(txParams.to) - } - this.resubmit() - }, - }, 'Increase the gas price on your transaction'), - + this.showRetryButton() && h('.tx-list-item-retry-container', { + onClick: (event) => { + event.stopPropagation() + if (isTokenTx) { + this.setSelectedToken(txParams.to) + } + this.resubmit() + }, + }, [ + h('span', 'Taking too long? Increase the gas price on your transaction'), ]), ]), // holding on icon from design diff --git a/ui/app/css/itcss/components/transaction-list.scss b/ui/app/css/itcss/components/transaction-list.scss index d03faf486..1d45ff13b 100644 --- a/ui/app/css/itcss/components/transaction-list.scss +++ b/ui/app/css/itcss/components/transaction-list.scss @@ -129,12 +129,14 @@ .tx-list-item-retry-container { background: #d1edff; width: 100%; - border-radius: 4px; - font-size: 0.8em; + border-radius: 12px; + font-size: .75rem; display: flex; justify-content: center; margin-left: 44px; width: calc(100% - 44px); + padding: 4px; + cursor: pointer; @media screen and (min-width: 576px) and (max-width: 679px) { flex-flow: column; @@ -151,10 +153,6 @@ } } -.tx-list-item-retry-copy { - font-family: Roboto; -} - .tx-list-item-retry-link { text-decoration: underline; margin-left: 6px;