|
|
|
@ -266,6 +266,32 @@
|
|
|
|
|
border-left-color: $bg-color;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
@each $name, $color in $theme-colors {
|
|
|
|
|
&.bg-#{$name},
|
|
|
|
|
&.bg-gradient-#{$name} {
|
|
|
|
|
.direct-chat-timestamp {
|
|
|
|
|
@if (color-yiq($color) == $yiq-text-dark) {
|
|
|
|
|
color: lighten(color-yiq($color), 10%);
|
|
|
|
|
} @else {
|
|
|
|
|
color: darken(color-yiq($color), 20%);
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
@each $name, $color in $colors {
|
|
|
|
|
&.bg-#{$name},
|
|
|
|
|
&.bg-gradient-#{$name} {
|
|
|
|
|
.direct-chat-timestamp {
|
|
|
|
|
@if (color-yiq($color) == $yiq-text-dark) {
|
|
|
|
|
color: lighten(color-yiq($color), 10%);
|
|
|
|
|
} @else {
|
|
|
|
|
color: darken(color-yiq($color), 20%);
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// Background Variant
|
|
|
|
@ -281,13 +307,13 @@
|
|
|
|
|
&.btn {
|
|
|
|
|
&:hover {
|
|
|
|
|
border-color: darken($color, 10%);
|
|
|
|
|
color: color-yiq(darken($color, 7.5%));
|
|
|
|
|
color: darken(color-yiq($color), 7.5%);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
&:active,
|
|
|
|
|
&.active {
|
|
|
|
|
border-color: darken($color, 12.5%);
|
|
|
|
|
color: color-yiq(darken($color, 10%));
|
|
|
|
|
color: darken(color-yiq($color), 10%);
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
@ -311,14 +337,14 @@
|
|
|
|
|
&:hover {
|
|
|
|
|
@include bg-gradient-variant('&', darken($color, 7.5%));
|
|
|
|
|
border-color: darken($color, 10%);
|
|
|
|
|
color: color-yiq(darken($color, 7.5%));
|
|
|
|
|
color: darken(color-yiq($color), 7.5%);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
&:active,
|
|
|
|
|
&.active {
|
|
|
|
|
@include bg-gradient-variant('&', darken($color, 10%));
|
|
|
|
|
border-color: darken($color, 12.5%);
|
|
|
|
|
color: color-yiq(darken($color, 10%));
|
|
|
|
|
color: darken(color-yiq($color), 10%);
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|