dark-unica.scss
2.51 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
// Global font
@import 'https://fonts.googleapis.com/css?family=Unica+One';
// Chart background, point stroke for markers and columns etc
$background-color: #2a2a2b;
// Colors for data series and points.
$colors: #2b908f #90ee7e #f45b5b #7798BF #aaeeee #ff0066 #eeaaee #55BF3B #DF5353 #7798BF #aaeeee;
// Neutral colors
$neutral-color-100: #fff;
$neutral-color-80: #E0E0E3;
$neutral-color-60: #E0E0E3;
$neutral-color-40: #666;
$neutral-color-20: #606063;
$neutral-color-10: #707073;
$neutral-color-5: #505053;
// Colored, shades
$highlight-color-100: #F0F0F3;
$highlight-color-60: rgba(255,255,255,0.1);
$highlight-color-20: $neutral-color-10;
// Data-labels
$data-label-color: #B0B0B3;
// Fonts
$font-family: 'Unica One', Arial, Helvetica, sans-serif;
$title-font-size: 20px;
// Tooltip
$tooltip-background: rgba(0, 0, 0, 0.85);
// Range-selector
$range-selector-input-text: silver;
$range-selector-input-border: $neutral-color-5;
// Buttons
$highcharts-button-background: $neutral-color-5;
$highcharts-button-text: #ccc;
$highcharts-button-pressed-background: #000003;
$highcharts-button-pressed-text: $neutral-color-100;
$highcharts-button-hover-background: $neutral-color-10;
$highcharts-button-hover-text: $neutral-color-100;
$context-button-background: $neutral-color-5;
// Navigator
$navigator-series-fill: #7798BF;
$navigator-series-border: #A6C7ED;
// Navigator
$scrollbar-track-background: #404043;
$scrollbar-track-border: #404043;
// Titles
.highcharts-title, .highcharts-subtitle {
text-transform: uppercase;
}
// Tooltip
.highcharts-tooltip text {
fill: #F0F0F0
}
// Range-selector
.highcharts-range-selector-buttons text {
fill: silver;
}
// Axes
.highcharts-yaxis-grid {
stroke-width: 1px;
}
.highcharts-axis-labels, .highcharts-axis-title {
fill: #E0E0E3;
}
// Navigator
.highcharts-navigator .highcharts-navigator-handle {
fill: $neutral-color-40;
stroke: #aaa;
}
.highcharts-navigator .highcharts-navigator-outline {
stroke: #CCC;
}
.highcharts-navigator .highcharts-navigator-xaxis .highcharts-grid-line {
stroke: $neutral-color-5;
}
// Scrollbar
.highcharts-scrollbar .highcharts-scrollbar-rifles {
stroke: $neutral-color-100;
}
.highcharts-scrollbar .highcharts-scrollbar-button {
stroke: #606063;
fill: #606063;
}
.highcharts-scrollbar .highcharts-scrollbar-arrow {
fill: #CCC;
}
.highcharts-scrollbar .highcharts-scrollbar-thumb {
fill: #808083;
stroke: #808083;
}
// Navigation
.highcharts-contextbutton .highcharts-button-symbol {
stroke: #DDDDDD;
}
@import '../highcharts';