TornadoCash/classic-ui-dev
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

init

Browse source
This commit is contained in:
Danil Kovtonyuk 2022-04-22 13:05:56 +10:00
commit 44f31f8b9f
No known key found for this signature in database
GPG key ID: E72A919BF08C3746
402 changed files with 47865 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

146
assets/styles/components/_steps.scss Normal file
View file

@ -0,0 +1,146 @@
.b-steps {
margin-bottom: 1.25rem;
.steps {
+ .step-content {
display: none;
}
.step-items {
.step-item {
.step-details {
margin-top: 1rem;
@include until(375px) {
word-spacing: 100px;
}
}
.step-link {
transition: color .15s ease-in-out;
&:not(.is-clickable) {
color: #393939;
.step-marker {
border-color: #393939;
&:before {
background-color: #393939;
}
}
}
}
.step-marker {
position: relative;
&:before {
content: "";
display: flex;
position: absolute;
left: 50%;
margin-left: calc(-1.5rem/2);
bottom: 50%;
margin-bottom: calc(-1.5rem/2);
width: 1.5rem;
height: 1.5rem;
transition: transform 150ms ease-out;
border-radius: 50%;
transform: scale(0);
background-color: $primary;
}
}
&:not(:first-child) {
&::before {
content: none;
}
.step-link {
&::before {
content: '';
display: block;
position: absolute;
background-color: $primary;
height: .2em;
width: 100%;
left: -50%;
bottom: 0;
top: .7rem;
}
&:not(.is-clickable) {
&::before {
background-color: #393939;
}
}
}
}
&:first-child, &:last-child {
.step-link {
&::after {
content: '';
display: block;
position: absolute;
background: $primary;
height: .2em;
width: 50%;
bottom: 0;
top: .7rem;
}
&:not(.is-clickable) {
&::after {
background: #393939;
}
}
}
}
&:first-child {
.step-link {
&::after {
left: 0;
}
}
}
&:last-child {
.step-link {
&::after {
right: 0;
}
}
}
&.is-active {
.step-link {
color: $primary;
&:not(.is-clickable) {
color: #393939;
}
.step-marker {
background-color: $primary-invert;
&:before {
transform: scale(0.6);
}
}
}
}
&:not(.is-active) {
display: block;
}
&::before, &::after {
content: none;
}
}
}
}
}