aboutsummaryrefslogtreecommitdiffstats
path: root/ui
diff options
context:
space:
mode:
Diffstat (limited to 'ui')
-rw-r--r--ui/app/account-detail.js2
-rw-r--r--ui/app/actions.js2
-rw-r--r--ui/app/components/buy-button-subview.js4
-rw-r--r--ui/app/components/shift-list-item.js141
-rw-r--r--ui/app/css/index.css4
-rw-r--r--ui/app/reducers/app.js2
6 files changed, 97 insertions, 58 deletions
diff --git a/ui/app/account-detail.js b/ui/app/account-detail.js
index 261370d0a..836f4bcb9 100644
--- a/ui/app/account-detail.js
+++ b/ui/app/account-detail.js
@@ -30,7 +30,7 @@ function mapStateToProps (state) {
unconfTxs: valuesFor(state.metamask.unconfTxs),
unconfMsgs: valuesFor(state.metamask.unconfMsgs),
isEthWarningConfirmed: state.metamask.isEthConfirmed,
- shapeShiftTxList : state.metamask.shapeShiftTxList,
+ shapeShiftTxList: state.metamask.shapeShiftTxList,
}
}
diff --git a/ui/app/actions.js b/ui/app/actions.js
index 9b99a05c1..c6c932296 100644
--- a/ui/app/actions.js
+++ b/ui/app/actions.js
@@ -747,7 +747,7 @@ function reshowQrCode (data, coin) {
shapeShiftRequest('marketinfo', {pair: `${coin.toLowerCase()}_eth`}, (mktResponse) => {
if (mktResponse.error) return dispatch(actions.showWarning(mktResponse.error))
- var message =[
+ var message = [
`Deposit your ${coin} to the address bellow:`,
`Deposit Limit: ${mktResponse.limit}`,
`Deposit Minimum:${mktResponse.minimum}`,
diff --git a/ui/app/components/buy-button-subview.js b/ui/app/components/buy-button-subview.js
index cebb8f3f6..742241e5b 100644
--- a/ui/app/components/buy-button-subview.js
+++ b/ui/app/components/buy-button-subview.js
@@ -54,7 +54,7 @@ BuyButtonSubview.prototype.render = function () {
justifyContent: 'space-around',
},
}, [
- h(currentForm.coinbase ? '.activeForm' : '.inactiveForm', {
+ h(currentForm.coinbase ? '.activeForm' : '.inactiveForm.pointer', {
onClick: () => props.dispatch(actions.coinBaseSubview()),
}, 'Coinbase'),
h('a', {
@@ -67,7 +67,7 @@ BuyButtonSubview.prototype.render = function () {
},
}),
]),
- h(currentForm.shapeshift ? '.activeForm' : '.inactiveForm', {
+ h(currentForm.shapeshift ? '.activeForm' : '.inactiveForm.pointer', {
onClick: () => props.dispatch(actions.shapeShiftSubview(props.provider.type)),
}, 'Shapeshift'),
diff --git a/ui/app/components/shift-list-item.js b/ui/app/components/shift-list-item.js
index 233920a1f..c4cc554fb 100644
--- a/ui/app/components/shift-list-item.js
+++ b/ui/app/components/shift-list-item.js
@@ -10,6 +10,7 @@ const addressSummary = require('../util').addressSummary
const CopyButton = require('./copyButton')
const EtherBalance = require('./eth-balance')
+const Tooltip = require('./tooltip')
module.exports = connect(mapStateToProps)(ShiftListItem)
@@ -19,15 +20,15 @@ function mapStateToProps (state) {
}
inherits(ShiftListItem, Component)
+
function ShiftListItem () {
Component.call(this)
}
ShiftListItem.prototype.render = function () {
- const props = this.props
return (
- h(`.transaction-list-item.flex-row`, {
- style:{
+ h('.transaction-list-item.flex-row', {
+ style: {
paddingTop: '20px',
paddingBottom: '20px',
justifyContent: 'space-around',
@@ -36,13 +37,13 @@ ShiftListItem.prototype.render = function () {
}, [
h('div', {
style: {
- width:'0px',
+ width: '0px',
position: 'relative',
bottom: '19px',
},
}, [
h('img', {
- src:'https://info.shapeshift.io/sites/default/files/logo.png',
+ src: 'https://info.shapeshift.io/sites/default/files/logo.png',
style: {
height: '35px',
width: '132px',
@@ -68,30 +69,53 @@ ShiftListItem.prototype.renderUtilComponents = function () {
switch (props.response.status) {
case 'no_deposits':
return h('.flex-row', [
- h(CopyButton, { value: this.props.depositAddress }),
- h('i.fa.fa-qrcode.pointer', {
- onClick: () => props.dispatch(actions.reshowQrCode(props.depositAddress, props.depositType)),
- style: {
- margin: '5px',
- marginLeft: '23px',
- marginRight: '12px',
- fontSize: '20px',
- color: '#F7861C',
- },
+ h(CopyButton, {
+ value: this.props.depositAddress,
}),
+ h(Tooltip, {
+ title: 'QR Code',
+ }, [
+ h('i.fa.fa-qrcode.pointer.pop-hover', {
+ onClick: () => props.dispatch(actions.reshowQrCode(props.depositAddress, props.depositType)),
+ style: {
+ margin: '5px',
+ marginLeft: '23px',
+ marginRight: '12px',
+ fontSize: '20px',
+ color: '#F7861C',
+ },
+ }),
+ ]),
])
case 'received':
return h('.flex-row')
case 'complete':
return h('.flex-row', [
- h(CopyButton, { value: this.props.response.transaction }),
- h(EtherBalance, {
- value: `+${props.response.outgoingCoin}`,
- width: '55px',
- shorten: true,
- style: {fontSize: '15px'},
- })
+ h(CopyButton, {
+ value: this.props.response.transaction,
+ }),
+ h('.flex-row', {
+ style: {
+ alignItems: 'baseline',
+ },
+ }, [
+ h('.color-orange', {
+ style: {
+ fontFamily: 'Montserrat Light',
+ position: 'relative',
+ left: '6px',
+ },
+ }, '+'),
+ h(EtherBalance, {
+ value: `${props.response.outgoingCoin}`,
+ width: '55px',
+ shorten: true,
+ style: {
+ fontSize: '15px',
+ },
+ }),
+ ]),
])
case 'failed':
@@ -106,17 +130,20 @@ ShiftListItem.prototype.renderInfo = function () {
var props = this.props
switch (props.response.status) {
case 'no_deposits':
- return h('.flex-column', {style: {width: '200px', overflow: 'hidden'}}, [
+ return h('.flex-column', {
+ style: {
+ width: '200px',
+ overflow: 'hidden',
+ },
+ }, [
h('div', {
- style: {
- fontSize: 'x-small',
- color: '#ABA9AA',
- width: '100%',
- },
- }, [
- `${props.depositType} to ETH via ShapeShift`
- ]),
- h('div', `Status: ${props.response.status.replace('_', ' ')}`),
+ style: {
+ fontSize: 'x-small',
+ color: '#ABA9AA',
+ width: '100%',
+ },
+ }, `${props.depositType} to ETH via ShapeShift`),
+ h('div', 'No deposits received'),
h('div', {
style: {
fontSize: 'x-small',
@@ -126,17 +153,20 @@ ShiftListItem.prototype.renderInfo = function () {
}, formatDate(props.time)),
])
case 'received':
- return h('.flex-column', {style: {width: '200px', overflow: 'hidden'}}, [
+ return h('.flex-column', {
+ style: {
+ width: '200px',
+ overflow: 'hidden',
+ },
+ }, [
h('div', {
- style: {
- fontSize: 'x-small',
- color: '#ABA9AA',
- width: '100%',
- },
- }, [
- `${props.depositType} to ETH via ShapeShift`
- ]),
- h('div', `Conversion in progress`),
+ style: {
+ fontSize: 'x-small',
+ color: '#ABA9AA',
+ width: '100%',
+ },
+ }, `${props.depositType} to ETH via ShapeShift`),
+ h('div', 'Conversion in progress'),
h('div', {
style: {
fontSize: 'x-small',
@@ -146,20 +176,25 @@ ShiftListItem.prototype.renderInfo = function () {
}, formatDate(props.time)),
])
case 'complete':
- var url = explorerLink(props.response.transaction, parseInt('1'))
+ var url = explorerLink(props.response.transaction, parseInt('1'))
return h('.flex-column.pointer', {
- style: {width: '200px', overflow: 'hidden'},
- onClick: () => extension.tabs.create({ url })
+ style: {
+ width: '200px',
+ overflow: 'hidden',
+ },
+ onClick: () => extension.tabs.create({
+ url,
+ }),
}, [
h('div', {
- style: {
- fontSize: 'x-small',
- color: '#ABA9AA',
- width: '100%',
- },
- }, `ShapeShift`),
- h('div', props.completeTime),
+ style: {
+ fontSize: 'x-small',
+ color: '#ABA9AA',
+ width: '100%',
+ },
+ }, 'From ShapeShift'),
+ h('div', formatDate(props.time)),
h('div', {
style: {
fontSize: 'x-small',
@@ -170,7 +205,7 @@ ShiftListItem.prototype.renderInfo = function () {
])
case 'failed':
- return h('span.error', ' (Failed)')
+ return h('span.error', '(Failed)')
default:
return ''
}
diff --git a/ui/app/css/index.css b/ui/app/css/index.css
index 1278e95c9..e2be0abd9 100644
--- a/ui/app/css/index.css
+++ b/ui/app/css/index.css
@@ -592,3 +592,7 @@ div.message-container > div:first-child {
font-size: 15px;
color: #4D4D4D;
}
+
+.pop-hover:hover {
+ transform: scale(1.1);
+}
diff --git a/ui/app/reducers/app.js b/ui/app/reducers/app.js
index 63804d478..8c2696877 100644
--- a/ui/app/reducers/app.js
+++ b/ui/app/reducers/app.js
@@ -490,7 +490,7 @@ function reduceApp (state, action) {
data: action.value.data,
},
})
- default:
+ default:
return appState
}
}