aboutsummaryrefslogtreecommitdiffstats
path: root/ui/app
diff options
context:
space:
mode:
authorDan Finlay <dan@danfinlay.com>2016-07-01 12:22:39 +0800
committerDan Finlay <dan@danfinlay.com>2016-07-01 12:22:39 +0800
commitd33d4f065492d32df35c8eb72a7c51b74bf4b155 (patch)
tree8f7788329475f00dedf2039364862a6bd4fe298b /ui/app
parentaa21c83470d2fa89a5dc09a49c7ab83cf4e87ad7 (diff)
parentd4e400e5e5a7ba501f210b722f6ccf97be9e6c17 (diff)
downloadtangerine-wallet-browser-d33d4f065492d32df35c8eb72a7c51b74bf4b155.tar
tangerine-wallet-browser-d33d4f065492d32df35c8eb72a7c51b74bf4b155.tar.gz
tangerine-wallet-browser-d33d4f065492d32df35c8eb72a7c51b74bf4b155.tar.bz2
tangerine-wallet-browser-d33d4f065492d32df35c8eb72a7c51b74bf4b155.tar.lz
tangerine-wallet-browser-d33d4f065492d32df35c8eb72a7c51b74bf4b155.tar.xz
tangerine-wallet-browser-d33d4f065492d32df35c8eb72a7c51b74bf4b155.tar.zst
tangerine-wallet-browser-d33d4f065492d32df35c8eb72a7c51b74bf4b155.zip
Merge branch 'master' into FrankieDisclaimer
Diffstat (limited to 'ui/app')
-rw-r--r--ui/app/account-detail.js175
-rw-r--r--ui/app/actions.js5
-rw-r--r--ui/app/components/eth-balance.js28
-rw-r--r--ui/app/components/transaction-list.js5
-rw-r--r--ui/app/css/fonts.css9
-rw-r--r--ui/app/css/index.css17
-rw-r--r--ui/app/info.js8
-rw-r--r--ui/app/reducers.js4
8 files changed, 161 insertions, 90 deletions
diff --git a/ui/app/account-detail.js b/ui/app/account-detail.js
index 02a807dbb..aae1d434f 100644
--- a/ui/app/account-detail.js
+++ b/ui/app/account-detail.js
@@ -44,116 +44,138 @@ AccountDetailScreen.prototype.render = function () {
return (
- h('.account-detail-section.flex-column.flex-grow', [
+ h('.account-detail-section', [
// identicon, label, balance, etc
- h('.account-data-subsection.flex-column.flex-grow', {
+ h('.account-data-subsection', {
style: {
margin: '0 20px',
},
}, [
// header - identicon + nav
- h('.flex-row.flex-center', {
+ h('div', {
style: {
- marginTop: 28,
+ marginTop: '15px',
+ display: 'flex',
+ justifyContent: 'flex-start',
+ alignItems: 'flex-start',
},
}, [
- // large identicon
- h('.identicon-wrapper.flex-column.flex-center.select-none', [
+ // large identicon and addresses
+ h('.identicon-wrapper.select-none', [
h(Identicon, {
diameter: 62,
address: selected,
}),
]),
- ]),
-
- h('.flex-center', {
- style: {
- height: '62px',
- paddingTop: '8px',
- },
- }, [
- h(EditableLabel, {
- textValue: identity ? identity.name : '',
- state: {
- isEditingLabel: false,
- },
- saveText: (text) => {
- props.dispatch(actions.saveAccountLabel(selected, text))
+ h('flex-column', {
+ style: {
+ lineHeight: '10px',
+ marginLeft: '15px',
},
}, [
+ h(EditableLabel, {
+ textValue: identity ? identity.name : '',
+ state: {
+ isEditingLabel: false,
+ },
+ saveText: (text) => {
+ props.dispatch(actions.saveAccountLabel(selected, text))
+ },
+ }, [
- // What is shown when not editing + edit text:
- h('label.editing-label', [h('.edit-text', 'edit')]),
- h('h2.font-medium.color-forest', {name: 'edit'}, identity && identity.name),
- ]),
- ]),
+ // What is shown when not editing + edit text:
+ h('label.editing-label', [h('.edit-text', 'edit')]),
+ h('h2.font-medium.color-forest', {name: 'edit'}, identity && identity.name),
+ ]),
+ h('.flex-row', {
+ style: {
+ width: '15em',
+ justifyContent: 'space-between',
+ alignItems: 'baseline',
+ },
+ }, [
- // address and getter actions
- h('.flex-row', {
- style: {
- marginBottom: 16,
- },
- }, [
+ // address
- h('div', {
- style: {
- overflow: 'hidden',
- textOverflow: 'ellipsis',
- paddingTop: '3px',
- },
- }, ethUtil.toChecksumAddress(selected)),
+ h('div', {
+ style: {
+ overflow: 'hidden',
+ textOverflow: 'ellipsis',
+ paddingTop: '3px',
+ width: '5em',
+ fontSize: '13px',
+ fontFamily: 'Montserrat Thin',
+ textRendering: 'geometricPrecision',
+ marginTop: '10px',
+ marginBottom: '15px',
+ color: '#AEAEAE',
+ },
+ }, ethUtil.toChecksumAddress(selected)),
- h(CopyButton, {
- value: ethUtil.toChecksumAddress(selected),
- }),
+ // copy and export
- h(Tooltip, {
- title: 'Export Private Key',
- }, [
- h('div', {
+ h('.flex-row', {
+ style: {
+ justifyContent: 'flex-end',
+ },
+ }, [
+ h(CopyButton, {
+ value: ethUtil.toChecksumAddress(selected),
+ }),
+
+ h(Tooltip, {
+ title: 'Export Private Key',
+ }, [
+ h('div', {
+ style: {
+ margin: '5px',
+ },
+ }, [
+ h('img.cursor-pointer.color-orange', {
+ src: 'images/key-32.png',
+ onClick: () => this.requestAccountExport(selected),
+ style: {
+ margin: '0px 5px',
+ width: '20px',
+ height: '20px',
+ },
+ }),
+ ]),
+ ]),
+ ]),
+ ]),
+
+ // account ballence
+
+ h('.flex-row', {
style: {
- margin: '5px',
+ justifyContent: 'space-between',
+ alignItems: 'flex-start',
},
}, [
- h('img.cursor-pointer.color-orange', {
- src: 'images/key-32.png',
- onClick: () => this.requestAccountExport(selected),
+
+ h(EtherBalance, {
+ value: account && account.balance,
style: {
- margin: '0px 5px',
- width: '20px',
- height: '20px',
- position: 'relative',
- top: '3px',
- right: '4px',
+ lineHeight: '7px',
},
}),
- ]),
- ]),
-
- ]),
- // balance + send
- h('.flex-row.flex-space-between', [
-
- h(EtherBalance, {
- value: account && account.balance,
- style: {
- lineHeight: '50px',
- },
- }),
+ h('button', {
+ onClick: () => props.dispatch(actions.showSendPage()),
+ style: {
+ marginBottom: '20px',
+ marginRight: '8px',
+ },
+ }, 'SEND'),
- h('button', {
- onClick: () => props.dispatch(actions.showSendPage()),
- style: {
- margin: 10,
- },
- }, 'SEND'),
+ ]),
+ ]),
]),
-
]),
// subview (tx history, pk export confirm)
@@ -214,4 +236,3 @@ AccountDetailScreen.prototype.transactionList = function () {
AccountDetailScreen.prototype.requestAccountExport = function () {
this.props.dispatch(actions.requestExportAccount())
}
-
diff --git a/ui/app/actions.js b/ui/app/actions.js
index 0cbc3b9e6..c6b57d29d 100644
--- a/ui/app/actions.js
+++ b/ui/app/actions.js
@@ -47,6 +47,7 @@ var actions = {
unlockInProgress: unlockInProgress,
// error handling
displayWarning: displayWarning,
+ showWarning: showWarning, // alias
DISPLAY_WARNING: 'DISPLAY_WARNING',
HIDE_WARNING: 'HIDE_WARNING',
hideWarning: hideWarning,
@@ -507,6 +508,10 @@ function hideLoadingIndication () {
}
}
+function showWarning (text) {
+ return this.displayWarning(text)
+}
+
function displayWarning (text) {
return {
type: actions.DISPLAY_WARNING,
diff --git a/ui/app/components/eth-balance.js b/ui/app/components/eth-balance.js
index 710d4fc8b..c7240ea21 100644
--- a/ui/app/components/eth-balance.js
+++ b/ui/app/components/eth-balance.js
@@ -24,8 +24,34 @@ EthBalanceComponent.prototype.render = function () {
style: {
display: 'inline',
},
- }, value),
+ }, this.renderBalance(value)),
])
)
}
+EthBalanceComponent.prototype.renderBalance = function (value) {
+
+ if (value === 'None') return value
+
+ var balance = value.split(' ')[0]
+ var label = value.split(' ')[1]
+
+ return (
+ h('.flex-column', {
+ style: {
+ alignItems: 'flex-end',
+ lineHeight: '13px',
+ fontFamily: 'Montserrat Thin',
+ textRendering: 'geometricPrecision',
+ },
+ }, [
+ h('div', balance),
+ h('div', {
+ style: {
+ color: ' #AEAEAE',
+ fontSize: '12px',
+ },
+ }, label),
+ ])
+ )
+}
diff --git a/ui/app/components/transaction-list.js b/ui/app/components/transaction-list.js
index a1a5db475..886aa7c00 100644
--- a/ui/app/components/transaction-list.js
+++ b/ui/app/components/transaction-list.js
@@ -35,6 +35,8 @@ TransactionList.prototype.render = function () {
style: {
background: '#EBEBEB',
color: '#AEAEAE',
+ paddingTop: '4px',
+ paddingBottom: '4px',
},
}, [
'Transactions',
@@ -43,7 +45,7 @@ TransactionList.prototype.render = function () {
h('.tx-list', {
style: {
overflowY: 'auto',
- height: '204px',
+ height: '305px',
padding: '0 20px',
textAlign: 'center',
},
@@ -67,4 +69,3 @@ TransactionList.prototype.render = function () {
])
)
}
-
diff --git a/ui/app/css/fonts.css b/ui/app/css/fonts.css
index e9473af55..da024ce84 100644
--- a/ui/app/css/fonts.css
+++ b/ui/app/css/fonts.css
@@ -7,7 +7,7 @@
src: url('/fonts/Montserrat/Montserrat-Regular.ttf') format('truetype');
font-weight: normal;
font-style: normal;
- font-size: 'small',
+ font-size: 'small';
}
@@ -18,3 +18,10 @@
font-weight: normal;
font-style: normal;
}
+
+@font-face {
+ font-family: 'Montserrat Thin';
+ src: url('/fonts/Montserrat/Montserrat-Regular.woff') format('woff');
+ src: url('/fonts/Montserrat/Montserrat-Regular.ttf') format('truetype');
+ text-rendering: geometricPrecision;
+}
diff --git a/ui/app/css/index.css b/ui/app/css/index.css
index fc10e56b6..d8b84e8b6 100644
--- a/ui/app/css/index.css
+++ b/ui/app/css/index.css
@@ -153,6 +153,7 @@ textarea.twelve-word-phrase {
top: 8px;
width: 5.2em;
line-height: 9px;
+ text-rendering: geometricPrecision;
}
.check {
@@ -248,7 +249,7 @@ app sections
.sizing-input{
font-size: 1em;
- height: 31px;
+ height: 30px;
}
.editable-label{
display: flex;
@@ -387,19 +388,19 @@ input.large-input {
}
.name-label{
- margin-bottom: 14px;
+
}
.edit-text {
height: 100%;
visibility: hidden;
}
.editing-label {
- cursor: text;
- width: 100%;
- position: relative;
- top: 7px;
- text-align: right;
- font-size: small;
+ display: flex;
+ justify-content: flex-start;
+ margin-left: 50px;
+ margin-bottom: 2px;
+ font-size: 11px;
+ text-rendering: geometricPrecision;
color: #F7861C;
}
.name-label:hover .edit-text {
diff --git a/ui/app/info.js b/ui/app/info.js
index a473f5921..d97998fd7 100644
--- a/ui/app/info.js
+++ b/ui/app/info.js
@@ -17,7 +17,13 @@ function InfoScreen () {
InfoScreen.prototype.render = function () {
var state = this.props
- var manifest = chrome.runtime.getManifest()
+ var manifest
+ try {
+ manifest = chrome.runtime.getManifest()
+ } catch (e) {
+ manifest = { version: '2.0.0' }
+ }
+
return (
h('.flex-column.flex-grow', [
diff --git a/ui/app/reducers.js b/ui/app/reducers.js
index 17f94f230..f198758ea 100644
--- a/ui/app/reducers.js
+++ b/ui/app/reducers.js
@@ -13,6 +13,10 @@ function rootReducer (state, action) {
// clone
state = extend(state)
+ if (action.type === 'GLOBAL_FORCE_UPDATE') {
+ return action.value
+ }
+
//
// Identities
//