tornado-initiation-ui/assets/styles/components/_wallets.scss

131 lines
2.2 KiB
SCSS
Raw Permalink Normal View History

2020-10-30 09:01:41 +01:00
.wallets {
&.field.is-grouped.is-grouped-multiline {
margin: -0.5rem;
> .control {
2020-11-03 07:54:19 +01:00
margin: 0.5rem;
2020-10-30 09:01:41 +01:00
&:not(.control-with-select) {
.button {
2020-11-03 07:54:19 +01:00
height: 100%;
2020-10-30 09:01:41 +01:00
}
}
}
}
.button {
width: 120px;
flex-direction: column;
height: auto;
&.is-black {
2020-11-03 07:54:19 +01:00
color: $primary-invert;
2020-10-30 09:01:41 +01:00
background-color: #559774;
&:hover {
2020-11-05 11:17:59 +01:00
background-color: $primary;
2020-10-30 09:01:41 +01:00
}
2020-11-03 07:54:19 +01:00
&[disabled] {
background-color: #559774;
}
2020-10-30 09:01:41 +01:00
}
&:before {
content: '';
height: 64px;
width: 64px;
background-repeat: no-repeat;
background-position: center;
background-size: contain;
margin: 0.25rem 0;
}
&.is-metamask:before {
background-image: url('../images/metamask-fox.svg');
}
&.is-generic:before {
background-image: url('../images/ethereum.svg');
}
&.is-trustwallet:before {
background-image: url('../images/trustwallet.svg');
}
}
.control-with-select {
display: flex;
flex-direction: column;
.button {
border-bottom-left-radius: 0;
border-bottom-right-radius: 0;
border-bottom-width: 0;
&:before {
height: 38px;
}
}
.select {
&.is-empty {
select {
color: rgba(255, 255, 255, 0.7);
}
}
select {
border-top-left-radius: 0;
border-top-right-radius: 0;
border-top-width: 0;
border-color: #559774;
background-color: #559774;
height: 1.929rem;
color: $primary-invert;
&:hover {
background-color: $primary;
border-color: $primary;
}
&:focus {
border-color: #559774;
box-shadow: none;
}
}
&:not(.is-multiple) {
height: 1.929rem;
&:not(.is-loading) {
&::after {
border-color: $primary-invert;
}
}
}
}
}
.network-select {
width: 120px;
overflow: hidden;
}
/*> .control:hover {
.button {
border-color: #cdcdcd;
}
&.control-with-select {
.button {
border-bottom-color: $black;
}
.select select {
border-color: #cdcdcd;
}
}*
}*/
}