fix(temperature): fix temperature dragger gradient, fix switcher button hover background (#1745)

This commit is contained in:
Denis Strigo 2018-06-21 19:01:32 +03:00 committed by Dmitry Nehaychik
parent a6d5d4956c
commit f12bd9f540
4 changed files with 20 additions and 11 deletions

View file

@ -14,8 +14,9 @@
&:hover { &:hover {
$color: nb-theme(switcher-background); $color: nb-theme(switcher-background);
$percentage: nb-theme(switcher-background-percentage);
background-color: tint($color, 14%); background-color: tint($color, $percentage);
} }
span { span {

View file

@ -16,6 +16,7 @@ $nb-themes: nb-register-theme((
font-secondary: Exo, font-secondary: Exo,
switcher-background: #ebeff5, switcher-background: #ebeff5,
switcher-background-percentage: 50%,
drops-icon-line-gadient: -webkit-linear-gradient(#01dbb5, #0bbb79), drops-icon-line-gadient: -webkit-linear-gradient(#01dbb5, #0bbb79),
), default, default); ), default, default);
@ -29,6 +30,7 @@ $nb-themes: nb-register-theme((
font-secondary: Exo, font-secondary: Exo,
switcher-background: #4e41a5, switcher-background: #4e41a5,
switcher-background-percentage: 14%,
drops-icon-line-gadient: -webkit-linear-gradient(#a258fe, #7958fa), drops-icon-line-gadient: -webkit-linear-gradient(#a258fe, #7958fa),
), cosmic, cosmic); ), cosmic, cosmic);
@ -42,5 +44,6 @@ $nb-themes: nb-register-theme((
font-secondary: Exo, font-secondary: Exo,
switcher-background: #2b2d34, switcher-background: #2b2d34,
switcher-background-percentage: 14%,
drops-icon-line-gadient: -webkit-linear-gradient(#e9e8eb, #a7a2be), drops-icon-line-gadient: -webkit-linear-gradient(#e9e8eb, #a7a2be),
), corporate, corporate); ), corporate, corporate);

View file

@ -2,7 +2,7 @@ import {Component, OnDestroy} from '@angular/core';
import { NbThemeService } from '@nebular/theme'; import { NbThemeService } from '@nebular/theme';
import { takeWhile } from 'rxjs/operators/takeWhile' ; import { takeWhile } from 'rxjs/operators/takeWhile' ;
interface ICardSettings { interface CardSettings {
title: string; title: string;
iconClass: string; iconClass: string;
type: string; type: string;
@ -17,22 +17,22 @@ export class DashboardComponent implements OnDestroy {
private alive = true; private alive = true;
lightCard: ICardSettings = { lightCard: CardSettings = {
title: 'Light', title: 'Light',
iconClass: 'nb-lightbulb', iconClass: 'nb-lightbulb',
type: 'primary', type: 'primary',
}; };
rollerShadesCard: ICardSettings = { rollerShadesCard: CardSettings = {
title: 'Roller Shades', title: 'Roller Shades',
iconClass: 'nb-roller-shades', iconClass: 'nb-roller-shades',
type: 'success', type: 'success',
}; };
wirelessAudioCard: ICardSettings = { wirelessAudioCard: CardSettings = {
title: 'Wireless Audio', title: 'Wireless Audio',
iconClass: 'nb-audio', iconClass: 'nb-audio',
type: 'info', type: 'info',
}; };
coffeeMakerCard: ICardSettings = { coffeeMakerCard: CardSettings = {
title: 'Coffee Maker', title: 'Coffee Maker',
iconClass: 'nb-coffee-maker', iconClass: 'nb-coffee-maker',
type: 'warning', type: 'warning',
@ -40,7 +40,7 @@ export class DashboardComponent implements OnDestroy {
statusCards: string; statusCards: string;
commonStatusCardsSet: ICardSettings[] = [ commonStatusCardsSet: CardSettings[] = [
this.lightCard, this.lightCard,
this.rollerShadesCard, this.rollerShadesCard,
this.wirelessAudioCard, this.wirelessAudioCard,
@ -48,9 +48,9 @@ export class DashboardComponent implements OnDestroy {
]; ];
statusCardsByThemes: { statusCardsByThemes: {
default: ICardSettings[]; default: CardSettings[];
cosmic: ICardSettings[]; cosmic: CardSettings[];
corporate: ICardSettings[]; corporate: CardSettings[];
} = { } = {
default: this.commonStatusCardsSet, default: this.commonStatusCardsSet,
cosmic: this.commonStatusCardsSet, cosmic: this.commonStatusCardsSet,

View file

@ -119,8 +119,13 @@ export class TemperatureDraggerComponent implements AfterViewInit, OnChanges {
this.calculateVars(); this.calculateVars();
this.invalidateClipPathStr(); this.invalidateClipPathStr();
this.invalidateGradientArcs();
this.invalidatePinPosition(); this.invalidatePinPosition();
// Chrome fix, temporary solution
// TODO: review set data to styles object
setTimeout(() => {
this.invalidateGradientArcs();
})
} }
private calculateVars() { private calculateVars() {