Improve spinner colors on top of medium-brightness backgrounds
This commit is contained in:
parent
552db647e5
commit
f5af063191
3 changed files with 22 additions and 22 deletions
|
@ -133,29 +133,29 @@
|
|||
}
|
||||
|
||||
.module-spinner__circle--incoming {
|
||||
background-color: $color-gray-15;
|
||||
background-color: $color-white-04;
|
||||
}
|
||||
.module-spinner__arc--incoming {
|
||||
background-color: $color-gray-60;
|
||||
}
|
||||
.module-spinner__circle--small-incoming {
|
||||
background-color: $color-gray-15;
|
||||
background-color: $color-white-04;
|
||||
}
|
||||
.module-spinner__arc--small-incoming {
|
||||
background-color: $color-gray-60;
|
||||
}
|
||||
|
||||
.module-spinner__circle--outgoing {
|
||||
background-color: $color-gray-45;
|
||||
background-color: $color-white-04;
|
||||
}
|
||||
.module-spinner__arc--outgoing {
|
||||
background-color: $color-gray-05;
|
||||
background-color: $color-white;
|
||||
}
|
||||
.module-spinner__circle--small-outgoing {
|
||||
background-color: $color-gray-45;
|
||||
background-color: $color-white-04;
|
||||
}
|
||||
.module-spinner__arc--small-outgoing {
|
||||
background-color: $color-gray-05;
|
||||
background-color: $color-white;
|
||||
}
|
||||
|
||||
&.dark-theme {
|
||||
|
@ -323,26 +323,26 @@
|
|||
}
|
||||
|
||||
.module-spinner__circle--incoming {
|
||||
background-color: $color-gray-45;
|
||||
background-color: $color-white-04;
|
||||
}
|
||||
.module-spinner__arc--incoming {
|
||||
background-color: $color-gray-25;
|
||||
}
|
||||
.module-spinner__circle--small-incoming {
|
||||
background-color: $color-gray-45;
|
||||
background-color: $color-white-04;
|
||||
}
|
||||
.module-spinner__arc--small-incoming {
|
||||
background-color: $color-gray-25;
|
||||
}
|
||||
|
||||
.module-spinner__circle--outgoing {
|
||||
background-color: $color-gray-45;
|
||||
background-color: $color-white-04;
|
||||
}
|
||||
.module-spinner__arc--outgoing {
|
||||
background-color: $color-gray-05;
|
||||
}
|
||||
.module-spinner__circle--small-outgoing {
|
||||
background-color: $color-gray-45;
|
||||
background-color: $color-white-04;
|
||||
}
|
||||
.module-spinner__arc--small-outgoing {
|
||||
background-color: $color-gray-05;
|
||||
|
|
|
@ -2712,7 +2712,7 @@
|
|||
top: 0;
|
||||
left: 0;
|
||||
|
||||
@include color-svg('../images/spinner-track-56.svg', $color-gray-15);
|
||||
@include color-svg('../images/spinner-track-56.svg', $color-white-04);
|
||||
z-index: 2;
|
||||
height: 56px;
|
||||
width: 56px;
|
||||
|
@ -2748,7 +2748,7 @@
|
|||
}
|
||||
|
||||
.module-spinner__circle--small {
|
||||
@include color-svg('../images/spinner-track-24.svg', $color-gray-15);
|
||||
@include color-svg('../images/spinner-track-24.svg', $color-white-04);
|
||||
height: 24px;
|
||||
width: 24px;
|
||||
}
|
||||
|
@ -2759,16 +2759,16 @@
|
|||
}
|
||||
|
||||
.module-spinner__circle--incoming {
|
||||
background-color: $color-gray-75;
|
||||
background-color: $color-white-04;
|
||||
}
|
||||
.module-spinner__arc--incoming {
|
||||
background-color: $color-gray-15;
|
||||
background-color: $color-white;
|
||||
}
|
||||
.module-spinner__circle--small-incoming {
|
||||
background-color: $color-gray-75;
|
||||
background-color: $color-white-04;
|
||||
}
|
||||
.module-spinner__arc--small-incoming {
|
||||
background-color: $color-gray-15;
|
||||
background-color: $color-white;
|
||||
}
|
||||
|
||||
// Third-party module: react-contextmenu
|
||||
|
|
|
@ -1412,39 +1412,39 @@ body.dark-theme {
|
|||
// Module: Spinner
|
||||
|
||||
.module-spinner__circle {
|
||||
background-color: $color-gray-45;
|
||||
background-color: $color-white-04;
|
||||
}
|
||||
.module-spinner__arc {
|
||||
background-color: $color-gray-05;
|
||||
}
|
||||
.module-spinner__circle--small {
|
||||
background-color: $color-gray-45;
|
||||
background-color: $color-white-04;
|
||||
}
|
||||
.module-spinner__arc--small {
|
||||
background-color: $color-gray-05;
|
||||
}
|
||||
|
||||
.module-spinner__circle--incoming {
|
||||
background-color: $color-gray-45;
|
||||
background-color: $color-white-04;
|
||||
}
|
||||
.module-spinner__arc--incoming {
|
||||
background-color: $color-gray-05;
|
||||
}
|
||||
.module-spinner__circle--small-incoming {
|
||||
background-color: $color-gray-45;
|
||||
background-color: $color-white-04;
|
||||
}
|
||||
.module-spinner__arc--small-incoming {
|
||||
background-color: $color-gray-05;
|
||||
}
|
||||
|
||||
.module-spinner__circle--outgoing {
|
||||
background-color: $color-gray-45;
|
||||
background-color: $color-white-04;
|
||||
}
|
||||
.module-spinner__arc--outgoing {
|
||||
background-color: $color-gray-05;
|
||||
}
|
||||
.module-spinner__circle--small-outgoing {
|
||||
background-color: $color-gray-45;
|
||||
background-color: $color-white-04;
|
||||
}
|
||||
.module-spinner__arc--small-outgoing {
|
||||
background-color: $color-gray-05;
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue