144 lines
3.2 KiB
CSS
144 lines
3.2 KiB
CSS
/* Global font */
|
|
@import url("https://fonts.googleapis.com/css?family=Unica+One");
|
|
@import url("../highcharts.css");
|
|
|
|
:root {
|
|
/* Chart background, point stroke for markers and columns etc */
|
|
--highcharts-background-color: #2a2a2b;
|
|
|
|
/* Colors for data series and points. */
|
|
--highcharts-color-0: #2b908f;
|
|
--highcharts-color-1: #90ee7e;
|
|
--highcharts-color-2: #f45b5b;
|
|
--highcharts-color-3: #7798bf;
|
|
--highcharts-color-4: #aaeeee;
|
|
--highcharts-color-5: #ff0066;
|
|
--highcharts-color-6: #eeaaee;
|
|
--highcharts-color-7: #55bf3b;
|
|
--highcharts-color-8: #df5353;
|
|
--highcharts-color-9: #7798bf;
|
|
|
|
/* Neutral colors */
|
|
--highcharts-neutral-color-100: #ffffff;
|
|
--highcharts-neutral-color-80: #e0e0e3;
|
|
--highcharts-neutral-color-60: #e0e0e3;
|
|
--highcharts-neutral-color-40: #666666;
|
|
--highcharts-neutral-color-20: #606063;
|
|
--highcharts-neutral-color-10: #707073;
|
|
--highcharts-neutral-color-5: #505053;
|
|
--highcharts-neutral-color-3: #303033;
|
|
|
|
/* Highlight colors https://jsfiddle.net/highcharts/pukradvh/ */
|
|
--highcharts-highlight-color-100: rgb(166, 199, 237);
|
|
--highcharts-highlight-color-80: rgb(134, 165, 201);
|
|
--highcharts-highlight-color-60: rgb(102, 131, 164);
|
|
--highcharts-highlight-color-20: rgb(39, 64, 91);
|
|
--highcharts-highlight-color-10: rgb(23, 47, 73);
|
|
}
|
|
|
|
.highcharts-container {
|
|
font-family: "Unica One", arial, helvetica, sans-serif;
|
|
}
|
|
|
|
/* Titles */
|
|
.highcharts-title,
|
|
.highcharts-subtitle {
|
|
text-transform: uppercase;
|
|
}
|
|
|
|
.highcharts-title {
|
|
font-size: 1.7em;
|
|
}
|
|
|
|
/* Tooltip */
|
|
.highcharts-tooltip text {
|
|
fill: #f0f0f0;
|
|
}
|
|
|
|
.highcharts-tooltip-box {
|
|
fill: #000000;
|
|
}
|
|
|
|
/* 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: var(--highcharts-neutral-color-40);
|
|
stroke: #aaaaaa;
|
|
}
|
|
|
|
.highcharts-navigator .highcharts-navigator-outline {
|
|
stroke: #cccccc;
|
|
}
|
|
|
|
.highcharts-navigator .highcharts-navigator-xaxis .highcharts-grid-line {
|
|
stroke: var(--highcharts-neutral-color-5);
|
|
}
|
|
|
|
/* Buttons */
|
|
.highcharts-button {
|
|
fill: var(--highcharts-neutral-color-5);
|
|
}
|
|
|
|
.highcharts-button text {
|
|
fill: #cccccc;
|
|
}
|
|
|
|
.highcharts-button-hover {
|
|
fill: var(--highcharts-neutral-color-10);
|
|
}
|
|
|
|
.highcharts-button-hover text {
|
|
fill: var(--highcharts-neutral-color-100);
|
|
}
|
|
|
|
.highcharts-button-pressed {
|
|
fill: #000003;
|
|
stroke: var(--highcharts-neutral-color-100);
|
|
}
|
|
|
|
.highcharts-button-pressed text {
|
|
fill: var(--highcharts-neutral-color-100);
|
|
}
|
|
|
|
/* Scrollbar */
|
|
.highcharts-scrollbar .highcharts-scrollbar-rifles {
|
|
stroke: var(--highcharts-neutral-color-100);
|
|
}
|
|
|
|
.highcharts-scrollbar .highcharts-scrollbar-button {
|
|
stroke: #606063;
|
|
fill: #606063;
|
|
}
|
|
|
|
.highcharts-scrollbar .highcharts-scrollbar-arrow {
|
|
fill: #cccccc;
|
|
}
|
|
|
|
.highcharts-scrollbar .highcharts-scrollbar-thumb {
|
|
fill: #808083;
|
|
stroke: #808083;
|
|
}
|
|
|
|
/* Navigation */
|
|
.highcharts-contextbutton {
|
|
fill: var(--highcharts-neutral-color-5);
|
|
}
|
|
|
|
.highcharts-contextbutton .highcharts-button-symbol {
|
|
stroke: #dddddd;
|
|
}
|