fix vars
This commit is contained in:
parent
e4f5c098e0
commit
cd027cebd2
@ -125,13 +125,13 @@
|
|||||||
*/
|
*/
|
||||||
|
|
||||||
.CDB-BoxLoader {
|
.CDB-BoxLoader {
|
||||||
padding: 0 24px;
|
padding: 0 $baseSize * 3;
|
||||||
border-top: 1px solid $cMainLine;
|
border-top: 1px solid $cMainLine;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
.CDB-BoxLoader-inner {
|
.CDB-BoxLoader-inner {
|
||||||
padding: 12px 0;
|
padding: $baseSize + 4 0;
|
||||||
border-top: 1px solid $cMainLine;
|
border-top: 1px solid $cMainLine;
|
||||||
&:first-child {
|
&:first-child {
|
||||||
border-top: 0;
|
border-top: 0;
|
||||||
@ -140,7 +140,7 @@
|
|||||||
|
|
||||||
.CDB-BoxLoader-item {
|
.CDB-BoxLoader-item {
|
||||||
@include display-flex();
|
@include display-flex();
|
||||||
padding: 8px 0;
|
padding: $baseSize 0;
|
||||||
color: $cTypo2;
|
color: $cTypo2;
|
||||||
&.is-working {
|
&.is-working {
|
||||||
color: $cTypo3;
|
color: $cTypo3;
|
||||||
@ -149,6 +149,6 @@
|
|||||||
|
|
||||||
.CDB-BoxLoader-info {
|
.CDB-BoxLoader-info {
|
||||||
@include flex(1);
|
@include flex(1);
|
||||||
padding-right: 16px;
|
padding-right: $baseSize * 2;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -53,8 +53,8 @@ There is only one state 'is-visible', in order to make it visible.
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div style="padding: 20px; background: #2E3C43;">
|
<div style="padding: 20px; background: #2E3C43;">
|
||||||
<div class="CDB-LoaderIcon is-white">
|
<div class="CDB-LoaderIcon is-grey">
|
||||||
<div class="CDB-LoaderIcon-item is-white"></div>
|
<div class="CDB-LoaderIcon-item is-grey"></div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
```
|
```
|
||||||
@ -65,10 +65,10 @@ There is only one state 'is-visible', in order to make it visible.
|
|||||||
position: relative;
|
position: relative;
|
||||||
width: $baseSize * 2;
|
width: $baseSize * 2;
|
||||||
height: $baseSize * 2;
|
height: $baseSize * 2;
|
||||||
border: 2px solid #D8D8D8;
|
border: 2px solid $cMainLine;
|
||||||
border-radius: 50%;
|
border-radius: 50%;
|
||||||
&.is-white {
|
&.is-grey {
|
||||||
border: 2px solid #636D72;
|
border: 2px solid $cTypo2;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -80,7 +80,7 @@ There is only one state 'is-visible', in order to make it visible.
|
|||||||
width: $baseSize * 2;
|
width: $baseSize * 2;
|
||||||
height: $baseSize * 2;
|
height: $baseSize * 2;
|
||||||
border-radius: 50%;
|
border-radius: 50%;
|
||||||
background: linear-gradient(to right, #FFF 10%, rgba(255, 255, 255, 0) 42%);
|
background: linear-gradient(to right, $cWhite 10%, rgba($cWhite, 0) 42%);
|
||||||
|
|
||||||
&::before,
|
&::before,
|
||||||
&::after {
|
&::after {
|
||||||
@ -94,7 +94,7 @@ There is only one state 'is-visible', in order to make it visible.
|
|||||||
width: 50%;
|
width: 50%;
|
||||||
height: 50%;
|
height: 50%;
|
||||||
border-radius: 100% 0 0;
|
border-radius: 100% 0 0;
|
||||||
background: #D8D8D8;
|
background: $cMainLine;
|
||||||
}
|
}
|
||||||
&::after {
|
&::after {
|
||||||
right: 0;
|
right: 0;
|
||||||
@ -103,15 +103,15 @@ There is only one state 'is-visible', in order to make it visible.
|
|||||||
height: 75%;
|
height: 75%;
|
||||||
margin: auto;
|
margin: auto;
|
||||||
border-radius: 50%;
|
border-radius: 50%;
|
||||||
background: #FFF;
|
background: $cWhite;
|
||||||
}
|
}
|
||||||
&.is-white {
|
&.is-grey {
|
||||||
background: linear-gradient(to right, #2E3C43 10%, rgba(255, 255, 255, 0) 42%);
|
background: linear-gradient(to right, $cMainDark 10%, rgba($cWhite, 0) 42%);
|
||||||
&::before {
|
&::before {
|
||||||
background: #636D72;
|
background: $cTypo2;
|
||||||
}
|
}
|
||||||
&::after {
|
&::after {
|
||||||
background: #2E3C43;
|
background: $cMainDark;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
Loading…
Reference in New Issue
Block a user