Merge branch 'ui-2-styling' into ui-2

This commit is contained in:
Jaco Greeff 2017-04-28 15:33:49 +02:00
commit 4781d2e15a
5 changed files with 8 additions and 8 deletions

View File

@ -17,7 +17,6 @@
.account { .account {
align-items: stretch; align-items: stretch;
background-color: rgba(0, 0, 0, 0.8);
display: flex; display: flex;
flex-direction: row; flex-direction: row;
height: 100%; height: 100%;
@ -32,7 +31,6 @@
&:focus { &:focus {
transform: scale(0.99); transform: scale(0.99);
background-color: rgba(0, 0, 0, 0.6);
} }
&:first-child { &:first-child {
@ -45,7 +43,6 @@
&:hover { &:hover {
cursor: pointer; cursor: pointer;
background-color: rgba(0, 0, 0, 0.4);
} }
} }

View File

@ -19,6 +19,7 @@ import ReactDOM from 'react-dom';
import keycode from 'keycode'; import keycode from 'keycode';
import Balance from '~/ui/Balance'; import Balance from '~/ui/Balance';
import Container from '~/ui/Container';
import IdentityIcon from '~/ui/IdentityIcon'; import IdentityIcon from '~/ui/IdentityIcon';
import IdentityName from '~/ui/IdentityName'; import IdentityName from '~/ui/IdentityName';
import Tags from '~/ui/Tags'; import Tags from '~/ui/Tags';
@ -60,7 +61,7 @@ export default class AccountCard extends Component {
: {}; : {};
return ( return (
<div <Container
key={ address } key={ address }
className={ classes.join(' ') } className={ classes.join(' ') }
onClick={ this.onClick } onClick={ this.onClick }
@ -108,7 +109,7 @@ export default class AccountCard extends Component {
) : null ) : null
} }
</div> </Container>
); );
} }

View File

@ -35,13 +35,14 @@ export default class Container extends Component {
light: PropTypes.bool, light: PropTypes.bool,
link: PropTypes.string, link: PropTypes.string,
onClick: PropTypes.func, onClick: PropTypes.func,
onFocus: PropTypes.func,
style: PropTypes.object, style: PropTypes.object,
tabIndex: PropTypes.number, tabIndex: PropTypes.number,
title: nodeOrStringProptype() title: nodeOrStringProptype()
} }
render () { render () {
const { children, className, compact, light, link, onClick, style, tabIndex } = this.props; const { children, className, compact, light, link, onClick, onFocus, style, tabIndex } = this.props;
const props = {}; const props = {};
if (Number.isInteger(tabIndex)) { if (Number.isInteger(tabIndex)) {
@ -56,6 +57,7 @@ export default class Container extends Component {
: styles.padded : styles.padded
} }
onClick={ onClick } onClick={ onClick }
onFocus={ onFocus }
> >
{ this.renderTitle() } { this.renderTitle() }
{ children } { children }

View File

@ -34,7 +34,7 @@ $popoverRight: $modalMargin;
$popoverTop: 20vh; $popoverTop: 20vh;
$popoverZ: 3600; $popoverZ: 3600;
$backgroundFade: rgba(255, 255, 255, 0.35); $backgroundFade: rgba(0, 0, 0, 0.35);
$backgroundOverlay: rgba(255, 255, 255, 0.95); $backgroundOverlay: rgba(255, 255, 255, 0.95);
.backOverlay { .backOverlay {

View File

@ -14,6 +14,7 @@
/* You should have received a copy of the GNU General Public License /* You should have received a copy of the GNU General Public License
/* along with Parity. If not, see <http://www.gnu.org/licenses/>. /* along with Parity. If not, see <http://www.gnu.org/licenses/>.
*/ */
.outer, .page, .editor { .outer, .page, .editor {
flex: 1; flex: 1;
display: flex; display: flex;
@ -108,7 +109,6 @@
overflow: auto; overflow: auto;
.panel { .panel {
background-color: rgba(0, 0, 0, 0.5);
padding: 1em; padding: 1em;
flex: 1; flex: 1;
display: flex; display: flex;