aboutsummaryrefslogtreecommitdiffstats
path: root/ui/app
diff options
context:
space:
mode:
Diffstat (limited to 'ui/app')
-rw-r--r--ui/app/components/tx-view.js59
-rw-r--r--ui/app/css/index.css20
2 files changed, 56 insertions, 23 deletions
diff --git a/ui/app/components/tx-view.js b/ui/app/components/tx-view.js
index b2799a65f..dc9a7985f 100644
--- a/ui/app/components/tx-view.js
+++ b/ui/app/components/tx-view.js
@@ -56,42 +56,61 @@ TxView.prototype.render = function () {
}, [
]),
- h('div.flex-row.flex-wrap', {
+ h('div.flex-row', {
style: {
margin: '1.8em 1.3em 0.8em 1.3em',
- flex: '1 0 auto',
+ // flex: '1 0 520px',
}
}, [
- h('div.flex-column.flex-center', {
+ // laptop: flex-row
+ // mobile: flex-column
+ h('div.flex-row.flex-center', {
style: {
- width: '100%',
}
}, [
- h('div', {}, 'ETH LOGO'),
-
- h('div', {}, '1001.124 ETH'),
+ // laptop: 50px 50px
+ // mobile: 100px 100px
+ h('img', {
+ src: '../images/eth_logo.svg',
+ width: '50px',
+ height: '50px',
+ style: {
+ borderRadius: '25px',
+ border: '1px solid',
+ }
+ }),
- h('div', {}, '$300,000 USD'),
+ // laptop: 5vw?
+ // phone: 50vw?
+ h('div.flex-column.flex-center', {
+ style: {}
+ }, [
+ h('div', {}, '1001.124 ETH'),
- ]),
+ h('div', {}, '$300,000 USD'),
+ ]),
- h('div.flex-row.flex-center', {
- style: {
- width: '100%',
- }
- }, [
- h('button.btn-clear', {
- textAlign: 'center'
- }, 'BUY'),
+ // laptop: 10vw?
+ // phone: 75vw?
+ h('div.flex-row.flex-center', {
+ style: {
+ width: '100%',
+ }
+ }, [
+ h('button.btn-clear', {
+ textAlign: 'center'
+ }, 'BUY'),
- h('button.btn-clear', {
- textAlign: 'center'
- }, 'SEND'),
+ h('button.btn-clear', {
+ textAlign: 'center'
+ }, 'SEND'),
+ ]),
]),
+
]),
h('div.flex-row', {
diff --git a/ui/app/css/index.css b/ui/app/css/index.css
index a14da2d70..eec17ec2b 100644
--- a/ui/app/css/index.css
+++ b/ui/app/css/index.css
@@ -89,12 +89,10 @@ input:focus, textarea:focus {
background-color: #02C9B1; // TODO: reusable color in colors.css
}
+
button.btn-clear {
- width: 100px;
- height: 50px;
background: white;
border: 1px solid;
- font-size: .7em;
}
// No longer used in flat design, remove when modal buttons done
@@ -795,6 +793,14 @@ div.message-container > div:first-child {
width: 85%;
height: 90vh;
}
+
+ button.btn-clear {
+ width: 75px;
+ height: 32px;
+ font-size: .6em;
+ background: white;
+ border: 1px solid;
+ }
}
@media screen and (min-width: 769px) {
@@ -828,4 +834,12 @@ div.message-container > div:first-child {
width: 100%;
height: 100%
}
+
+ button.btn-clear {
+ width: 100px;
+ height: 50px;
+ font-size: .7em;
+ background: white;
+ border: 1px solid;
+ }
} \ No newline at end of file