You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
100 lines
1.9 KiB
100 lines
1.9 KiB
/**
|
|
* Spinners
|
|
* --------------------------------------------------
|
|
*/
|
|
|
|
.spinner {
|
|
svg {
|
|
width: $spinner-width;
|
|
height: $spinner-height;
|
|
}
|
|
|
|
stroke: $spinner-default-stroke;
|
|
fill: $spinner-default-fill;
|
|
|
|
&.spinner-light {
|
|
stroke: $spinner-light-stroke;
|
|
fill: $spinner-light-fill;
|
|
}
|
|
&.spinner-stable {
|
|
stroke: $spinner-stable-stroke;
|
|
fill: $spinner-stable-fill;
|
|
}
|
|
&.spinner-positive {
|
|
stroke: $spinner-positive-stroke;
|
|
fill: $spinner-positive-fill;
|
|
}
|
|
&.spinner-calm {
|
|
stroke: $spinner-calm-stroke;
|
|
fill: $spinner-calm-fill;
|
|
}
|
|
&.spinner-balanced {
|
|
stroke: $spinner-balanced-stroke;
|
|
fill: $spinner-balanced-fill;
|
|
}
|
|
&.spinner-assertive {
|
|
stroke: $spinner-assertive-stroke;
|
|
fill: $spinner-assertive-fill;
|
|
}
|
|
&.spinner-energized {
|
|
stroke: $spinner-energized-stroke;
|
|
fill: $spinner-energized-fill;
|
|
}
|
|
&.spinner-royal {
|
|
stroke: $spinner-royal-stroke;
|
|
fill: $spinner-royal-fill;
|
|
}
|
|
&.spinner-dark {
|
|
stroke: $spinner-dark-stroke;
|
|
fill: $spinner-dark-fill;
|
|
}
|
|
}
|
|
|
|
.spinner-android {
|
|
stroke: #4b8bf4;
|
|
}
|
|
|
|
.spinner-ios,
|
|
.spinner-ios-small {
|
|
stroke: #69717d;
|
|
}
|
|
|
|
.spinner-spiral {
|
|
.stop1 {
|
|
stop-color: $spinner-light-fill;
|
|
stop-opacity: 0;
|
|
}
|
|
|
|
&.spinner-light {
|
|
.stop1 {
|
|
stop-color: $spinner-default-fill;
|
|
}
|
|
.stop2 {
|
|
stop-color: $spinner-light-fill;
|
|
}
|
|
}
|
|
&.spinner-stable .stop2 {
|
|
stop-color: $spinner-stable-fill;
|
|
}
|
|
&.spinner-positive .stop2 {
|
|
stop-color: $spinner-positive-fill;
|
|
}
|
|
&.spinner-calm .stop2 {
|
|
stop-color: $spinner-calm-fill;
|
|
}
|
|
&.spinner-balanced .stop2 {
|
|
stop-color: $spinner-balanced-fill;
|
|
}
|
|
&.spinner-assertive .stop2 {
|
|
stop-color: $spinner-assertive-fill;
|
|
}
|
|
&.spinner-energized .stop2 {
|
|
stop-color: $spinner-energized-fill;
|
|
}
|
|
&.spinner-royal .stop2 {
|
|
stop-color: $spinner-royal-fill;
|
|
}
|
|
&.spinner-dark .stop2 {
|
|
stop-color: $spinner-dark-fill;
|
|
}
|
|
}
|