.wallet-transfers {
display: flex;
position: relative;
flex: 1;
height: 100%;
}
.wallet-transfers__content {
overflow: auto;
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
}
.wallet-transfers__loader {
text-align: center;
width: 100%;
}
.wallet-transfers__loader-text {
font-weight: 400;
color: var(--color-grey-300);
}
.wallet-transfers__error-background {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 2;
padding: 1rem;
background-color: var(--color-alpha-black);
backdrop-filter: blur(3px);
}
.wallet-transfers__balance {
padding: 1rem 1.5rem;
}
.wallet-transfers__balance-title {
display: flex;
flex-direction: row;
align-items: center;
padding: .5rem 0 .25rem 0;
}
.wallet-transfers__balance-amount {
padding: .25rem 0 1rem 1rem;
}
.wallet-transfers__balance-amount span:first-child {
font-size: 1.5em;
font-weight: 700;
margin: .5rem .5rem 0 0;
}
@keyframes spin {
0% { transform: rotate(0deg); }
100% { transform: rotate(360deg); }
}
.wallet-transfers__loader-spinner {
border: 0.25rem solid #4A4E56;
border-top: 0.25rem solid #ffffff;
border-radius: 50%;
width: 4rem;
height: 4rem;
animation: spin 2s linear infinite;
margin: auto;
margin-top: 5rem;
margin-bottom: 2rem;
}
.wallet-transfers__empty {
padding: 3rem;
text-align: center;
color: var(--color-grey-300);
}
.wallet-transfers__list {
padding: 1rem;
text-align: center;
color: var(--color-grey-300);
overflow: auto;
display: block;
}
.wallet-transfers__transaction {
padding: 1rem;
color: #fff;
border-top: 1px solid #202126F0;
}
.wallet-transfers__transaction-details {
display: flex;
justify-content: space-between;
width: 100%;
}
.wallet-transfers__transaction-details > div {
display: flex;
flex-direction: row;
align-items: center;
}
.wallet-transfers__transaction-tx {
display: flex;
flex-direction: column;
align-items: flex-start;
margin-left: 1rem;
}
.wallet-transfers__transaction-user {
font-weight: 700;
}
.wallet-transfers__transaction-date {
font-weight: 400;
}
.transfer-timestamp span {
display: block;
}
.wallet-transfers__transaction-pic {
border-radius: 8px;
float: left;
background: #426E8E;
height: 2.6rem;
width: 2.6rem;
display: flex;
align-items: center;
justify-content: center;
}
.wallet-transfers__transaction-description {
background: #202126;
border-radius: 8px;
width: 100%;
margin-top: 1rem;
padding: 0.25rem;
padding-left: 1rem;
text-align: left;
}
.received-payment-icon, .sent-payment-icon {
transform: translateY(0.65rem);
}
.wallet-transfers__transaction-amount {
margin-left: auto;
}
.wallet-transfers__transaction-amount span:first-child {
font-weight: 700;
margin-right: 0.25rem;
}
.wallet-transfers__transaction-amount span:nth-child(2) {
margin-right: 1rem;
}