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 tx-list, confirmation screen styling

Browse Source
This commit is contained in:
Alexander Tseung 2018-01-16 11:58:02 -08:00 committed by Chi Kei Chan
parent ba0762c582
commit 40e58d3132
4 changed files with 18 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
ui/app/components/tx-list.js
View File

@ -36,16 +36,15 @@ TxList.prototype.componentWillMount = function () {
} }
TxList.prototype.render = function () { TxList.prototype.render = function () {
return h('div.flex-column.tx-list-container', {}, [ return h('div.flex-column', [
h('div.flex-row.tx-list-header-wrapper', [ h('div.flex-row.tx-list-header-wrapper', [
h('div.flex-row.tx-list-header', [ h('div.flex-row.tx-list-header', [
h('div', 'transactions'), h('div', 'transactions'),
]), ]),
]), ]),
h('div.flex-column.tx-list-container', {}, [
this.renderTransaction(), this.renderTransaction(),
]),
]) ])
} }

17
ui/app/css/itcss/components/confirm.scss
View File

@ -2,13 +2,15 @@
position: relative; position: relative;
align-items: center; align-items: center;
font-family: Roboto; font-family: Roboto;
flex: 0 0 auto; flex: 1 0 auto;
flex-flow: column nowrap; flex-flow: column nowrap;
box-shadow: 0 2px 4px 0 rgba($black, .08); box-shadow: 0 2px 4px 0 rgba($black, .08);
border-radius: 8px; border-radius: 8px;
display: flex;
@media screen and (max-width: 575px) { @media screen and (max-width: 575px) {
width: 100%; width: 100%;
box-shadow: initial;
} }
@media screen and (min-width: 576px) { @media screen and (min-width: 576px) {
@ -272,8 +274,8 @@ section .confirm-screen-account-number,
} }
.confirm-screen-confirm-button { .confirm-screen-confirm-button {
height: 62px; height: 50px;
border-radius: 2px; border-radius: 4px;
background-color: #02c9b1; background-color: #02c9b1;
font-size: 16px; font-size: 16px;
color: $white; color: $white;
@ -285,11 +287,11 @@ section .confirm-screen-account-number,
box-shadow: none; box-shadow: none;
flex: 1 0 auto; flex: 1 0 auto;
font-weight: 300; font-weight: 300;
margin: 0 8px; margin: 0 5px;
} }
.btn-light.confirm-screen-cancel-button { .btn-light.confirm-screen-cancel-button {
height: 62px; height: 50px;
background: none; background: none;
border: none; border: none;
opacity: 1; opacity: 1;
@ -298,12 +300,11 @@ section .confirm-screen-account-number,
padding-top: 15px; padding-top: 15px;
padding-bottom: 15px; padding-bottom: 15px;
font-size: 16px; font-size: 16px;
line-height: 32px;
box-shadow: none; box-shadow: none;
cursor: pointer; cursor: pointer;
flex: 1 0 auto; flex: 1 0 auto;
font-weight: 300; font-weight: 300;
margin: 0 8px; margin: 0 5px;
} }
#pending-tx-form { #pending-tx-form {
@ -312,7 +313,7 @@ section .confirm-screen-account-number,
display: flex; display: flex;
flex-flow: row nowrap; flex-flow: row nowrap;
background-color: $white; background-color: $white;
padding: 12px 18px; padding: 12px;
border-bottom-left-radius: 8px; border-bottom-left-radius: 8px;
border-bottom-right-radius: 8px; border-bottom-right-radius: 8px;
width: 100%; width: 100%;

1
ui/app/css/itcss/components/hero-balance.scss
View File

@ -17,6 +17,7 @@
justify-content: flex-start; justify-content: flex-start;
align-items: center; align-items: center;
margin: 2.3em 2.37em .8em; margin: 2.3em 2.37em .8em;
flex: 0 0 auto;
} }
.balance-container { .balance-container {

4
ui/app/css/itcss/components/transaction-list.scss
View File

@ -6,6 +6,10 @@
} }
} }
.tx-list-header-wrapper {
flex: 0 0 auto;
}
.tx-list-header { .tx-list-header {
text-transform: capitalize; text-transform: capitalize;
} }