1
0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-12-05 15:35:46 +01:00
metamask-extension/ui/pages/swaps/smart-transaction-status/index.scss

85 lines
1.5 KiB
SCSS
Raw Normal View History

@keyframes shift {
to {
background-position: 100% 0;
}
}
.smart-transaction-status {
display: flex;
flex-flow: column;
align-items: center;
flex: 1;
width: 100%;
&__loading-bar-container {
height: 3px;
2022-03-17 19:04:01 +01:00
background: var(--color-background-alternative);
display: flex;
margin-top: 12px;
margin-bottom: 28px;
}
&__loading-bar {
height: 3px;
2022-03-17 19:04:01 +01:00
background: var(--color-primary-default);
transition: width 0.5s linear;
}
div {
text-align: center;
}
&__content {
flex-flow: column;
width: 100%;
}
&__background-animation {
position: relative;
left: -88px;
background-repeat: repeat;
background-position: 0 0;
&--top {
width: 1634px;
height: 54px;
background-size: 817px 54px;
background-image: url('/images/transaction-background-top.svg');
animation: shift 19s linear infinite;
}
&--bottom {
width: 1600px;
height: 62px;
background-size: 800px 62px;
background-image: url('/images/transaction-background-bottom.svg');
animation: shift 22s linear infinite;
}
}
a {
2022-03-17 19:04:01 +01:00
color: var(--color-primary-default);
}
&__support-link {
2022-03-17 19:04:01 +01:00
color: var(--color-primary-default);
margin-top: 24px;
cursor: pointer;
}
&__cancel-swap-link {
font-size: $font-size-h7;
}
&__swaps-footer {
.btn-secondary {
2022-03-25 16:07:47 +01:00
color: var(--color-text-alternative);
border: 1px solid var(--color-border-default);
}
}
&__remaining-time {
font-variant-numeric: tabular-nums;
}
}