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

Add layout for main container elements

Browse Source
This commit is contained in:
sdtsui 2017-07-30 20:42:12 -07:00
parent b15575b453
commit ca1a4b3096
2 changed files with 49 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
ui/app/app.js
View File

@ -9,7 +9,7 @@ const NewKeyChainScreen = require('./new-keychain')
// unlock // unlock
const UnlockScreen = require('./unlock') const UnlockScreen = require('./unlock')
// accounts // accounts
const AccountDetailScreen = require('./account-detail') const MainContainer = require('./main-container')
const SendTransactionScreen = require('./send') const SendTransactionScreen = require('./send')
const ConfirmTxScreen = require('./conf-tx') const ConfirmTxScreen = require('./conf-tx')
// notice // notice
@ -90,13 +90,7 @@ App.prototype.render = function () {
}), }),
// panel content // panel content
h('.app-primary' + (transForward ? '.from-right' : '.from-left'), {
style: {
maxWidth: '850px',
},
}, [
this.renderPrimary(), this.renderPrimary(),
]),
]) ])
) )
} }
@ -121,7 +115,7 @@ App.prototype.renderAppBar = function () {
alignItems: 'center', alignItems: 'center',
visibility: props.isUnlocked ? 'visible' : 'none', visibility: props.isUnlocked ? 'visible' : 'none',
background: '#EFEFEF', // $gallery background: '#EFEFEF', // $gallery
height: '11%', height: '11vh',
position: 'relative', position: 'relative',
zIndex: 12, zIndex: 12,
}, },
@ -132,6 +126,7 @@ App.prototype.renderAppBar = function () {
display: 'flex', display: 'flex',
flexDirection: 'row', flexDirection: 'row',
alignItems: 'center', alignItems: 'center',
marginBottom: '1.8em',
}, },
}, [ }, [
// mini logo // mini logo
@ -156,6 +151,7 @@ App.prototype.renderAppBar = function () {
display: 'flex', display: 'flex',
flexDirection: 'row', flexDirection: 'row',
alignItems: 'center', alignItems: 'center',
marginBottom: '1.8em',
}, },
}, [ }, [
// Network Indicator // Network Indicator
@ -419,8 +415,8 @@ App.prototype.renderPrimary = function () {
switch (props.currentView.name) { switch (props.currentView.name) {
case 'accountDetail': case 'accountDetail':
log.debug('rendering account detail screen') log.debug('rendering main container')
return h(AccountDetailScreen, {key: 'account-detail'}) return h(MainContainer, {key: 'account-detail'})
case 'sendTransaction': case 'sendTransaction':
log.debug('rendering send tx screen') log.debug('rendering send tx screen')
@ -488,7 +484,7 @@ App.prototype.renderPrimary = function () {
default: default:
log.debug('rendering default, account detail screen') log.debug('rendering default, account detail screen')
return h(AccountDetailScreen, {key: 'account-detail'}) return h(MainContainer, {key: 'account-detail'})
} }
} }

41
ui/app/main-container.js Normal file
View File

@ -0,0 +1,41 @@
const Component = require('react').Component
const h = require('react-hyperscript')
const inherits = require('util').inherits
module.exports = MainContainer
inherits(MainContainer, Component)
function MainContainer () {
Component.call(this)
}
MainContainer.prototype.render = function () {
console.log("rendering MainContainer...");
return h('div.flex-row', {
style: {
position: 'absolute',
marginTop: '6vh',
width: '98%',
zIndex: 20,
}
}, [
h('div.wallet-view', {
style: {
flexGrow: 1,
height: '82vh',
background: 'blue',
}
}, [
]),
h('div.tx-view', {
style: {
flexGrow: 2,
height: '82vh',
background: 'green',
}
}, [
]),
])
}