1
0
mirror of https://github.com/trezor/trezor-wallet synced 2024-12-25 16:38:08 +00:00

new device menu + device settings

This commit is contained in:
Szymon Lesisz 2018-05-09 13:11:38 +02:00
parent 4dc908837a
commit fd603c6a70
7 changed files with 103 additions and 12 deletions

View File

@ -7,8 +7,13 @@ import { connect } from 'react-redux';
export const DeviceSettings = () => {
return (
<section className="settings">
Device settings
<section className="device-settings">
<h2>Device settings</h2>
<div className="row">
<h2>Device settings is under construction</h2>
<p>Please use old wallet to edit your device settings</p>
<a className="button" href="https://wallet.trezor.io/">Take me to the old wallet</a>
</div>
</section>
);
}

View File

@ -0,0 +1,31 @@
/* @flow */
'use strict';
import React, { Component } from 'react';
import { NavLink } from 'react-router-dom';
type Props = {
pathname: string;
}
type State = {
style: {
width: number,
left: number
};
}
const AccountTabs = (props: any): any => {
const urlParams = props.match.params;
//const urlParams = props.match ? props.match.params : { address: '0' };
const basePath = `/device/${urlParams.device}/network/${urlParams.network}/address/${urlParams.address}`;
return (
<div className="account-tabs">
<a>Device settings</a>
</div>
);
}
export default AccountTabs;

View File

@ -245,7 +245,7 @@ export class DeviceDropdown extends Component<Props> {
);
}
const deviceList: Array<any> = devices.map((dev, index) => {
const deviceList = devices.map((dev, index) => {
if (dev === selected) return null;
let deviceStatus: string = "Connected";
@ -272,11 +272,14 @@ export class DeviceDropdown extends Component<Props> {
);
});
return (
<section>
{ currentDeviceMenu }
{ webUsbButton }
{ deviceList.length > 1 ? <div className="device-divider">Other devices</div> : null }
{ deviceList }
{ webUsbButton }
</section>
);
}

View File

@ -9,6 +9,7 @@ import { Route, withRouter } from 'react-router-dom';
import Header from '../common/Header';
import Footer from '../common/Footer';
import AccountTabs from './account/AccountTabs';
import DeviceSettingsTabs from './account/DeviceSettingsTabs';
import AsideContainer from './aside';
import ModalContainer from '../modal';
import Notifications from '../common/Notification';
@ -25,6 +26,7 @@ const Content = (props: Props) => {
<article>
<nav>
<Route path="/device/:device/network/:network/address/:address" component={ AccountTabs } />
<Route path="/device/:device/device-settings" component={ DeviceSettingsTabs } />
</nav>
<Notifications />
<Log />

View File

@ -57,7 +57,6 @@ aside {
}
}
.sticky-container {
position: relative;
@ -92,11 +91,11 @@ aside {
}
.trezor-webusb-button {
margin: 12px 0px 12px 80px;
margin: 12px 0px 12px 30px;
padding: 6px 24px 6px 40px;
width: 256px;
}
.device-select {
background: @color_white;
border-bottom: 1px solid @color_divider;
@ -123,6 +122,8 @@ aside {
}
&.opened {
border-bottom: 0px;
box-shadow: none;
.arrow:after {
transform: rotate(180deg);
}
@ -250,11 +251,13 @@ aside {
.device-menu {
padding: 8px 0px;
// padding-left: 80px;
padding-left: 74px;
padding-left: 28px;
// padding-left: 74px;
border-bottom: 1px solid @color_divider;
background: @color_white;
div {
padding: 4px 0px;
display: flex;
align-items: center;
line-height: 24px;
@ -267,7 +270,8 @@ aside {
// color: @color_text_secondary;
position: relative;
font-size: 24px;
margin-right: 12px;
// margin-right: 12px;
margin-right: 28px;
.hover();
}
@ -286,7 +290,10 @@ aside {
&.clone {
&:before {
.icomoon-settings;
.icomoon-T1;
font-size: 32px;
transform: translateX(-4px);
margin-right: 20px;
}
}
@ -493,6 +500,16 @@ aside {
}
}
.device-divider {
font-size: 12px;
display: flex;
justify-content: space-between;
color: @color_text_secondary;
background: @color_gray_light;
padding: 8px 30px 8px 31px;
border-bottom: 1px solid @color_divider;
}
.help {
width: 320px;
padding: 14px 0px;

View File

@ -0,0 +1,32 @@
.device-settings {
.row {
flex: 1;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
padding: 0px 48px;
padding-bottom: 98px;
h2 {
padding: 0;
position: relative;
&:before {
.icomoon-warning;
position: absolute;
color: @color_warning_primary;
font-size: 48px;
top: -48px;
left: 0;
right: 0;
text-align: center;
}
}
p {
padding: 12px 0px 24px 0px;
text-align: center;
}
}
}

View File

@ -17,6 +17,7 @@
@import './receive.less';
@import './summary.less';
@import './signverify.less';
@import './deviceSettings.less';
@import './landingPage.less';