Skip to content

Commit 8e2dd2d

Browse files
TorsteinHonsiTorsteinHonsi
committed
v12.3.0
1 parent 0fd4ec5 commit 8e2dd2d

File tree

1,253 files changed

+32698
-22484
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

1,253 files changed

+32698
-22484
lines changed

‎bower.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "highcharts",
3-
"version": "12.2.0",
3+
"version": "12.3.0",
44
"main": "highcharts.js",
55
"license": "https://www.highcharts.com/license",
66
"types": "highcharts.d.ts"

‎css/annotations/popup.css‎

Lines changed: 86 additions & 45 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,3 @@
1-
/* Colors, using same names and values as in highcharts.css */
2-
:root {
3-
--highcharts-background-color: #ffffff;
4-
--highcharts-neutral-color-100: #000000;
5-
--highcharts-neutral-color-80: #333333;
6-
--highcharts-neutral-color-60: #666666;
7-
--highcharts-neutral-color-20: #cccccc;
8-
--highcharts-neutral-color-10: #e6e6e6;
9-
--highcharts-neutral-color-3: #f7f7f7;
10-
--highcharts-highlight-color-80: #335cad;
11-
}
12-
131
.highcharts-popup.highcharts-annotation-toolbar {
142
right: 10%;
153
left: auto;
@@ -23,7 +11,7 @@
2311
.highcharts-annotation-toolbar button {
2412
margin-top: 0;
2513
cursor: pointer;
26-
background-color: var(--highcharts-neutral-color-3);
14+
background-color: var(--highcharts-neutral-color-3, #f7f7f7);
2715
}
2816

2917
.highcharts-popup.highcharts-annotation-toolbar > p {
@@ -45,8 +33,9 @@
4533
"Segoe UI Emoji",
4634
"Segoe UI Symbol",
4735
sans-serif;
48-
background-color: var(--highcharts-background-color);
49-
color: var(--highcharts-neutral-color-60);
36+
background-color: var(--highcharts-background-color, #ffffff);
37+
border-radius: 4px;
38+
color: var(--highcharts-neutral-color-60, #666666);
5039
display: none;
5140
font-size: 0.9em;
5241
max-height: 90%;
@@ -59,9 +48,9 @@
5948
max-width: 600px;
6049
position: absolute;
6150
z-index: 100;
62-
-webkit-box-shadow: 0 0 8px 0 rgba(61, 61, 61, 0.3);
63-
-moz-box-shadow: 0 0 8px 0 rgba(61, 61, 61, 0.3);
64-
box-shadow: 0 0 8px 0 rgba(61, 61, 61, 0.3);
51+
-webkit-box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.5);
52+
-moz-box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.5);
53+
box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.5);
6554
}
6655

6756
.highcharts-popup div,
@@ -79,8 +68,14 @@
7968
box-sizing: border-box;
8069
}
8170

71+
.highcharts-popup input,
72+
.highcharts-popup select {
73+
background: var(--highcharts-neutral-color-3, #f7f7f7);
74+
color: var(--highcharts-neutral-color-100, #000000);
75+
}
76+
8277
.highcharts-popup input {
83-
border: 1px solid var(--highcharts-neutral-color-10);
78+
border: 1px solid var(--highcharts-neutral-color-10, #e6e6e6);
8479
border-radius: 0.3rem;
8580
padding: 5px;
8681
width: 100%;
@@ -109,15 +104,21 @@
109104
.highcharts-popup-lhs-col {
110105
clear: both;
111106
width: 30%;
112-
border-right: 1px solid var(--highcharts-neutral-color-10);
107+
border-right: 1px solid var(--highcharts-neutral-color-10, #e6e6e6);
113108
}
114109

115110
.highcharts-popup-bottom-row {
116111
float: left;
117112
padding: 0 20px;
118113
padding-bottom: 12px;
119114
width: 100%;
120-
border-top: 1px solid var(--highcharts-neutral-color-10);
115+
border-top: 1px solid var(--highcharts-neutral-color-10, #e6e6e6);
116+
}
117+
118+
.highcharts-popup .highcharts-popup-bottom-row > button {
119+
margin-top: 10px;
120+
padding: 5px 10px;
121+
border-radius: 4px;
121122
}
122123

123124
.highcharts-popup-rhs-col {
@@ -139,7 +140,7 @@
139140
.highcharts-bindings-wrapper ul.highcharts-indicator-list,
140141
.highcharts-indicator-list {
141142
float: left;
142-
color: var(--highcharts-neutral-color-60);
143+
color: var(--highcharts-neutral-color-60, #666666);
143144
height: calc(100% - 150px);
144145
width: 100%;
145146
overflow-x: hidden;
@@ -155,7 +156,8 @@ button.highcharts-indicator-list-item {
155156
overflow: hidden;
156157
word-break: break-all;
157158
box-sizing: border-box;
158-
background-color: var(--highcharts-background-color);
159+
color: var(--highcharts-neutral-color-100, #000000);
160+
background-color: var(--highcharts-background-color, #ffffff);
159161
text-align: left;
160162
}
161163

@@ -167,7 +169,8 @@ button.highcharts-indicator-list-item {
167169

168170
.highcharts-popup > button.highcharts-tab-item {
169171
margin: 0;
170-
background-color: var(--highcharts-neutral-color-3);
172+
color: var(--highcharts-neutral-color-100, #000000);
173+
background-color: var(--highcharts-neutral-color-3, #f7f7f7);
171174
cursor: pointer;
172175
display: block;
173176
float: left;
@@ -177,7 +180,7 @@ button.highcharts-indicator-list-item {
177180
}
178181

179182
button.highcharts-tab-item.highcharts-tab-item-active {
180-
background-color: var(--highcharts-neutral-color-10);
183+
background-color: var(--highcharts-neutral-color-10, #e6e6e6);
181184
}
182185

183186
.highcharts-tab-item-content {
@@ -186,7 +189,7 @@ button.highcharts-tab-item.highcharts-tab-item-active {
186189
height: 100%;
187190
overflow: hidden;
188191
width: 100%;
189-
border-top: 1px solid var(--highcharts-neutral-color-10);
192+
border-top: 1px solid var(--highcharts-neutral-color-10, #e6e6e6);
190193
}
191194

192195
.highcharts-tab-item-show {
@@ -195,28 +198,68 @@ button.highcharts-tab-item.highcharts-tab-item-active {
195198

196199
.highcharts-popup > .highcharts-popup-close {
197200
margin: 0;
198-
background-repeat: no-repeat;
199-
background-position: 50% 50%;
200-
background-color: var(--highcharts-background-color);
201+
background-color: var(--highcharts-background-color, #ffffff);
201202
width: 40px;
202203
height: 40px;
203204
cursor: pointer;
204205
position: absolute;
205206
padding: 10px;
206207
top: 0%;
207208
right: 0%;
208-
color: var(--highcharts-neutral-color-80);
209+
color: var(--highcharts-neutral-color-80, #333333);
210+
}
211+
212+
.highcharts-popup .highcharts-icon {
213+
position: absolute;
214+
top: 0;
215+
left: 0;
216+
display: block;
217+
width: 100%;
218+
height: 100%;
219+
background-repeat: no-repeat;
220+
background-position: 50% 50%;
221+
}
222+
223+
.highcharts-dark .highcharts-popup {
224+
color-scheme: dark;
225+
border: 1px solid var(--highcharts-neutral-color-10, #e6e6e6);
226+
}
227+
228+
.highcharts-dark .highcharts-popup .highcharts-icon {
229+
filter: invert(1);
230+
}
231+
232+
@media (prefers-color-scheme: dark) {
233+
.highcharts-popup {
234+
color-scheme: dark;
235+
border: 1px solid var(--highcharts-neutral-color-10, #e6e6e6);
236+
}
237+
238+
.highcharts-popup .highcharts-icon {
239+
filter: invert(1);
240+
}
241+
242+
.highcharts-light .highcharts-popup {
243+
color-scheme: light;
244+
border: none;
245+
}
246+
247+
.highcharts-light .highcharts-popup .highcharts-icon {
248+
filter: none;
249+
}
209250
}
210251

211252
.highcharts-popup-close:hover,
212253
.highcharts-popup button:hover,
213254
.highcharts-popup button.highcharts-annotation-edit-button:hover,
214255
.highcharts-popup button.highcharts-annotation-remove-button:hover {
215-
background-color: var(--highcharts-neutral-color-10);
256+
background-color: var(--highcharts-neutral-color-10, #e6e6e6);
216257
}
217258

218259
div.highcharts-popup-rhs-col > button {
219260
float: right;
261+
padding: 5px 10px;
262+
border-radius: 4px;
220263
}
221264

222265
.highcharts-popup button {
@@ -225,11 +268,11 @@ div.highcharts-popup-rhs-col > button {
225268
}
226269

227270
button.highcharts-tab-item.highcharts-tab-disabled {
228-
color: var(--highcharts-neutral-color-20);
271+
color: var(--highcharts-neutral-color-20, #cccccc);
229272
}
230273

231274
button.highcharts-tab-item.highcharts-tab-disabled:hover {
232-
background-color: var(--highcharts-neutral-color-3);
275+
background-color: var(--highcharts-neutral-color-3, #f7f7f7);
233276
}
234277

235278
/* annotation edit small popup */
@@ -241,14 +284,12 @@ button.highcharts-tab-item.highcharts-tab-disabled:hover {
241284
}
242285

243286
.highcharts-popup button.highcharts-annotation-edit-button {
244-
background-repeat: no-repeat;
245-
background-position: 50% 50%;
287+
position: relative;
246288
text-indent: -9999px;
247289
}
248290

249291
.highcharts-popup button.highcharts-annotation-remove-button {
250-
background-repeat: no-repeat;
251-
background-position: 50% 50%;
292+
position: relative;
252293
text-indent: -9999px;
253294
}
254295

@@ -262,7 +303,7 @@ button.highcharts-tab-item.highcharts-tab-disabled:hover {
262303
}
263304

264305
.highcharts-popup .highcharts-popup-main-title {
265-
border-bottom: 1px solid var(--highcharts-neutral-color-10);
306+
border-bottom: 1px solid var(--highcharts-neutral-color-10, #e6e6e6);
266307
margin: 0;
267308
padding: 8px 0 6px 20px;
268309
}
@@ -283,28 +324,28 @@ button.highcharts-tab-item.highcharts-tab-disabled:hover {
283324
.highcharts-input-search-indicators-label {
284325
text-align: center;
285326
font-weight: bold;
286-
color: var(--highcharts-neutral-color-100);
327+
color: var(--highcharts-neutral-color-100, #000000);
287328
margin-top: 0.5rem;
288329
}
289330

290331
input.highcharts-input-search-indicators {
291332
width: 80%;
292333
margin: 0 auto;
293334
float: none;
294-
border-color: #949494;
335+
border-color: var(--highcharts-neutral-color-40, #999999);
295336
}
296337

297338
.highcharts-popup a.clear-filter-button {
298339
margin: 0 auto;
299340
display: none;
300-
color: var(--highcharts-highlight-color-80);
301-
background-color: var(--highcharts-background-color);
302-
border: 1px solid var(--highcharts-highlight-color-80);
341+
color: var(--highcharts-highlight-color-80, #335cad);
342+
background-color: var(--highcharts-background-color, #ffffff);
343+
border: 1px solid var(--highcharts-highlight-color-80, #335cad);
303344
margin-top: 10px;
304345
}
305346

306347
.highcharts-popup a.clear-filter-button:hover {
307-
color: var(--highcharts-background-color);
308-
background-color: var(--highcharts-highlight-color-80);
348+
color: var(--highcharts-background-color, #ffffff);
349+
background-color: var(--highcharts-highlight-color-80, #335cad);
309350
cursor: pointer;
310351
}

‎css/highcharts.css‎

Lines changed: 40 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -90,51 +90,59 @@
9090

9191
@media (prefers-color-scheme: dark) {
9292
:root {
93+
/* Colors for data series and points */
94+
--highcharts-color-1: #00e272;
95+
--highcharts-color-2: #efdf00;
96+
9397
/* UI colors */
94-
--highcharts-background-color: rgb(48, 48, 48);
98+
--highcharts-background-color: #141414;
9599

96100
/*
97101
Neutral color variations
98102
https://www.highcharts.com/samples/highcharts/css/palette-helper
99103
*/
100-
--highcharts-neutral-color-100: rgb(255, 255, 255);
101-
--highcharts-neutral-color-80: rgb(214, 214, 214);
102-
--highcharts-neutral-color-60: rgb(173, 173, 173);
103-
--highcharts-neutral-color-40: rgb(133, 133, 133);
104-
--highcharts-neutral-color-20: rgb(92, 92, 92);
105-
--highcharts-neutral-color-10: rgb(71, 71, 71);
106-
--highcharts-neutral-color-5: rgb(61, 61, 61);
107-
--highcharts-neutral-color-3: rgb(57, 57, 57);
104+
--highcharts-neutral-color-100: #ffffff;
105+
--highcharts-neutral-color-80: #d0d0d0;
106+
--highcharts-neutral-color-60: #a1a1a1;
107+
--highcharts-neutral-color-40: #727272;
108+
--highcharts-neutral-color-20: #434343;
109+
--highcharts-neutral-color-10: #2c2c2c;
110+
--highcharts-neutral-color-5: #202020;
111+
--highcharts-neutral-color-3: #1b1b1b;
108112

109113
/* Highlight color variations */
110-
--highcharts-highlight-color-100: rgb(122, 167, 255);
111-
--highcharts-highlight-color-80: rgb(108, 144, 214);
112-
--highcharts-highlight-color-60: rgb(94, 121, 173);
113-
--highcharts-highlight-color-20: rgb(65, 74, 92);
114-
--highcharts-highlight-color-10: rgb(58, 63, 71);
114+
--highcharts-highlight-color-100: #2caffe;
115+
--highcharts-highlight-color-80: #2790cf;
116+
--highcharts-highlight-color-60: #2271a0;
117+
--highcharts-highlight-color-20: #193343;
118+
--highcharts-highlight-color-10: #16242b;
115119
}
116120
}
117121

118122
.highcharts-dark {
123+
/* Colors for data series and points */
124+
--highcharts-color-1: #00e272;
125+
--highcharts-color-2: #efdf00;
126+
119127
/* UI colors */
120-
--highcharts-background-color: rgb(48, 48, 48);
128+
--highcharts-background-color: #141414;
121129

122130
/* Neutral color variations */
123-
--highcharts-neutral-color-100: rgb(255, 255, 255);
124-
--highcharts-neutral-color-80: rgb(214, 214, 214);
125-
--highcharts-neutral-color-60: rgb(173, 173, 173);
126-
--highcharts-neutral-color-40: rgb(133, 133, 133);
127-
--highcharts-neutral-color-20: rgb(92, 92, 92);
128-
--highcharts-neutral-color-10: rgb(71, 71, 71);
129-
--highcharts-neutral-color-5: rgb(61, 61, 61);
130-
--highcharts-neutral-color-3: rgb(57, 57, 57);
131+
--highcharts-neutral-color-100: #ffffff;
132+
--highcharts-neutral-color-80: #d0d0d0;
133+
--highcharts-neutral-color-60: #a1a1a1;
134+
--highcharts-neutral-color-40: #727272;
135+
--highcharts-neutral-color-20: #434343;
136+
--highcharts-neutral-color-10: #2c2c2c;
137+
--highcharts-neutral-color-5: #202020;
138+
--highcharts-neutral-color-3: #1b1b1b;
131139

132140
/* Highlight color variations */
133-
--highcharts-highlight-color-100: rgb(122, 167, 255);
134-
--highcharts-highlight-color-80: rgb(108, 144, 214);
135-
--highcharts-highlight-color-60: rgb(94, 121, 173);
136-
--highcharts-highlight-color-20: rgb(65, 74, 92);
137-
--highcharts-highlight-color-10: rgb(58, 63, 71);
141+
--highcharts-highlight-color-100: #2caffe;
142+
--highcharts-highlight-color-80: #2790cf;
143+
--highcharts-highlight-color-60: #2271a0;
144+
--highcharts-highlight-color-20: #193343;
145+
--highcharts-highlight-color-10: #16242b;
138146
}
139147

140148
.highcharts-container {
@@ -519,11 +527,13 @@ text.highcharts-data-label {
519527
stroke: var(--highcharts-background-color);
520528
}
521529

522-
.highcharts-column-series .highcharts-point {
530+
.highcharts-column-series .highcharts-point,
531+
.highcharts-bar-series .highcharts-point {
523532
transition: fill-opacity 250ms;
524533
}
525534

526-
.highcharts-column-series .highcharts-point-hover {
535+
.highcharts-column-series .highcharts-point-hover,
536+
.highcharts-bar-series .highcharts-point-hover {
527537
fill-opacity: 0.75;
528538
transition: fill-opacity 50ms;
529539
}

0 commit comments

Comments
 (0)