openethereum/js/packages/ui/AccountCard/accountCard.css

137 lines
2.4 KiB
CSS
Raw Normal View History

/* Copyright 2015-2017 Parity Technologies (UK) Ltd.
/* This file is part of Parity.
/*
/* Parity is free software: you can redistribute it and/or modify
/* it under the terms of the GNU General Public License as published by
/* the Free Software Foundation, either version 3 of the License, or
/* (at your option) any later version.
/*
/* Parity is distributed in the hope that it will be useful,
/* but WITHOUT ANY WARRANTY; without even the implied warranty of
/* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
/* GNU General Public License for more details.
/*
/* You should have received a copy of the GNU General Public License
/* along with Parity. If not, see <http://www.gnu.org/licenses/>.
*/
.account {
align-items: stretch;
display: flex;
flex-direction: row;
height: 100%;
overflow: hidden;
transition: transform ease-out 0.1s;
transform: scale(1);
&.copied {
animation-duration: 0.25s;
animation-name: copied;
}
&:focus {
transform: scale(0.99);
}
&:first-child {
margin-top: 0;
}
&:last-child {
margin-bottom: 0;
}
&:hover {
cursor: pointer;
}
}
.mainContainer {
flex: 1 1 auto;
overflow: hidden;
padding: 1em;
}
.tagsContainer {
flex: 0 0 auto;
position: relative;
width: 3em;
}
.tags {
background-color: rgba(0, 0, 0, 0.4);
box-sizing: content-box;
height: calc(100% - 0.5em);
overflow-x: hidden;
overflow-y: scroll;
padding: 0.25em;
padding-right: 2em;
position: absolute;
right: -2.5em;
transition: background-color 0.2s ease-out;
width: calc(100% + 0.25em);
&:hover {
background-color: rgba(0, 0, 0, 0.8);
padding-left: 0.5em;
width: auto;
}
}
.infoContainer {
display: flex;
flex-direction: row;
margin-bottom: 0.5em;
width: 100%;
}
.description {
font-size: 0.75em;
color: rgba(255, 255, 255, 0.5);
}
.accountInfo {
flex: 1;
display: flex;
flex-direction: column;
justify-content: center;
min-width: 0;
> * {
padding: 0.25em 0;
}
.addressContainer {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
font-size: 0.9em;
}
.accountName {
font-weight: 700 !important;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
}
.balance {
margin-top: 0;
}
@keyframes copied {
from {
transform: scale(0.99);
}
50% {
transform: scale(0.97);
}
to {
transform: scale(0.99);
}
}