Skip to content
Permalink
Browse files

Adding new welcome landing page

  • Loading branch information...
ryanml committed Jun 24, 2019
1 parent 8b6af92 commit 75b1ae1365eae93fff25ba97b7fd117fefc8bd16
@@ -103,6 +103,12 @@ const createBraveReplacePathsTask = () => {
`'${bravePrefix}ui/app/pages/settings/security-tab/security-tab.component'`
)
)
.pipe(
replace(
/\'(.*)\/welcome\.component\'/gm,
`'${bravePrefix}ui/app/pages/first-time-flow/welcome/welcome.component'`
)
)
.pipe(gulp.dest(file => file.base))
})
}
@@ -0,0 +1,47 @@
module.exports = {
container: {
width: '100%',
border: '1px solid rgb(218, 220, 232)',
borderRadius: '12px',
padding: '20px 35px',
textAlign: 'left',
marginTop: '20px'
},
title: {
display: 'block',
fontSize: '18px',
fontWeight: '500',
color: 'rgb(59, 62, 79)'
},
subText: {
display: 'block',
fontWeight: '14px',
fontWeight: '300',
marginTop: '5px',
maxWidth: '515px'
},
controls: {
display: 'inline-block',
float: 'right',
marginTop: '23px'
},
create: {
width: '85px',
height: '32px',
border: '1px solid rgb(194, 196, 207)',
borderRadius: '100px',
marginRight: '20px',
fontSize: '14px',
fontWeight: 'bold',
color: 'rgb(59, 62, 79)',
cursor: 'pointer'
},
restore: {
cursor: 'pointer',
fontSize: '14px',
fontWeight: 'bold'
},
hardwareImg: {
width: '100px'
}
}
@@ -0,0 +1,78 @@
import React,{ PureComponent } from "react";
import styles from './assets/styles'

module.exports = class ConnectWallet extends PureComponent {

get text () {
const { type } = this.props
const hardwareString = (type) => `Connect your ${type} hardware wallet to interact with dApps and make transfers to other connected wallets.`

switch (type) {
case 'browser':
return {
title: 'New Browser Wallet',
subText: 'Create a new Brave browser wallet to access dApps and store crypto and collectibles securely. Trade tokens annonymously with no trading fees.'
}
case 'ledger':
return {
title: (<div>
<img style={styles.hardwareImg} src={'images/ledger-logo.svg'} />
</div>),
subText: hardwareString('Ledger')
}
case 'trezor':
return {
title: (<div>
<img style={styles.hardwareImg} src={'images/trezor-logo.svg'} />
</div>),
subText: hardwareString('Trezor')
}
default:
return { title: '', subText: '' }
}
}

render () {
const { type, onCreate, onRestore } = this.props
const innerText = type === 'browser' ? 'Create' : 'Connect'
const hwButtonStyle = type !== 'browser' ? { marginRight: '-15px' } : {}

return (
<div style={styles.container}>
<div style={styles.controls}>
{
onCreate
? <button
style={
{
...styles.create,
...hwButtonStyle
}
}
onClick={onCreate}
>
{innerText}
</button>
: null
}
{
onRestore
? <span
style={styles.restore}
onClick={onRestore}
>
{'Restore'}
</span>
: null
}
</div>
<div style={styles.title}>
<span>{this.text.title}</span>
</div>
<div style={styles.subText}>
<span>{this.text.subText}</span>
</div>
</div>
)
}
}
@@ -0,0 +1 @@
export { default } from './connect-wallet.component'

0 comments on commit 75b1ae1

Please sign in to comment.
You can’t perform that action at this time.