playbook_ui 14.5.0.pre.alpha.PLAY1486highchartscssdrivenPOC3930 → 14.5.0.pre.alpha.PLAY1486highchartscssdrivenPOC3940
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/app/pb_kits/playbook/_playbook.scss +1 -0
- data/app/pb_kits/playbook/pb_bar_graph/_bar_graph.scss +0 -52
- data/app/pb_kits/playbook/pb_dashboard/_highcharts_theme.scss +52 -0
- data/app/pb_kits/playbook/pb_dashboard/{pbChartsDarkTheme.ts → pbChartsDarkTheme.js} +2 -6
- data/app/pb_kits/playbook/pb_dashboard/{pbChartsLightTheme.ts → pbChartsLightTheme.js} +2 -6
- data/dist/playbook.css +1 -1
- data/lib/playbook/version.rb +1 -1
- metadata +4 -3
checksums.yaml
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
---
|
|
2
2
|
SHA256:
|
|
3
|
-
metadata.gz:
|
|
4
|
-
data.tar.gz:
|
|
3
|
+
metadata.gz: dae893bb342f7639fcd8322b6dccedc17c9e8464fb03a2fd4cb95921385b6704
|
|
4
|
+
data.tar.gz: 10a1f8640c9a1c492d60a2d2487d90f5b784b2859823baa80efb02bf9ad528d3
|
|
5
5
|
SHA512:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
6
|
+
metadata.gz: f3cc1dd7e19c25a20efb23b88e97efd22dad0e6f46788158eb89de359592d366f4c6c41e464136febdf7ba35e80e1e800246bfd23fde52248f9efbe95721841d
|
|
7
|
+
data.tar.gz: 00e31566f6fe3cb342a72ce4290303c617c4096e26de7eabbe70f3d0b6786770e44b89b8e78ae0f5787ca345fa82a0fba314d896b643b6ac1926979f516dcc11
|
|
@@ -17,6 +17,7 @@
|
|
|
17
17
|
@import 'pb_collapsible/collapsible';
|
|
18
18
|
@import 'pb_contact/contact';
|
|
19
19
|
@import 'pb_currency/currency';
|
|
20
|
+
@import 'pb_dashboard/highcharts_theme.scss';
|
|
20
21
|
@import 'pb_dashboard_value/dashboard_value';
|
|
21
22
|
@import 'pb_date/date';
|
|
22
23
|
@import 'pb_date_picker/date_picker';
|
|
@@ -6,55 +6,3 @@
|
|
|
6
6
|
fill: #0000 !important;
|
|
7
7
|
}
|
|
8
8
|
}
|
|
9
|
-
|
|
10
|
-
@import url("https://code.highcharts.com/css/highcharts.css");
|
|
11
|
-
|
|
12
|
-
// @import "highcharts/css/highcharts";
|
|
13
|
-
// @import "highcharts/highcharts.css";
|
|
14
|
-
|
|
15
|
-
:root {
|
|
16
|
-
--highcharts-color-0: #{$data_1};
|
|
17
|
-
--highcharts-color-1: #{$data_2};
|
|
18
|
-
--highcharts-color-2: #{$data_3};
|
|
19
|
-
--highcharts-color-3: #{$data_4};
|
|
20
|
-
--highcharts-color-4: #{$data_5};
|
|
21
|
-
--highcharts-color-5: #{$data_6};
|
|
22
|
-
--highcharts-color-6: #{$data_7};
|
|
23
|
-
--highcharts-color-7: #{$data_8};
|
|
24
|
-
}
|
|
25
|
-
|
|
26
|
-
.highcharts-title {
|
|
27
|
-
font-family: $font_family_base;
|
|
28
|
-
font-weight: $bold;
|
|
29
|
-
font-size: $heading_3;
|
|
30
|
-
color: $text_lt_default;
|
|
31
|
-
fill: $text_lt_default;
|
|
32
|
-
}
|
|
33
|
-
|
|
34
|
-
.highcharts-subtitle {
|
|
35
|
-
font-family: $font_family_base;
|
|
36
|
-
color: $text_lt_light;
|
|
37
|
-
fill: $text_lt_light;
|
|
38
|
-
font-weight: $regular;
|
|
39
|
-
font-size: $text_base;
|
|
40
|
-
}
|
|
41
|
-
|
|
42
|
-
.highcharts-yaxis > .highcharts-axis-title {
|
|
43
|
-
color: $text_lt_lighter;
|
|
44
|
-
fill: $text_lt_lighter;
|
|
45
|
-
font-family: $font_family_base;
|
|
46
|
-
font-weight: $bold;
|
|
47
|
-
font-size: $text_smaller;
|
|
48
|
-
}
|
|
49
|
-
|
|
50
|
-
.highcharts-axis-labels {
|
|
51
|
-
font-family: $font_family_base;
|
|
52
|
-
color: $text_lt_lighter;
|
|
53
|
-
fill: $text_lt_lighter;
|
|
54
|
-
font-weight: $bold;
|
|
55
|
-
font-size: $text_smaller;
|
|
56
|
-
}
|
|
57
|
-
|
|
58
|
-
.highcharts-grid-line {
|
|
59
|
-
stroke: $border_light;
|
|
60
|
-
}
|
|
@@ -0,0 +1,52 @@
|
|
|
1
|
+
@import "../tokens/colors";
|
|
2
|
+
@import "../tokens/typography";
|
|
3
|
+
@import url("https://code.highcharts.com/css/highcharts.css");
|
|
4
|
+
// @import "highcharts/css/highcharts";
|
|
5
|
+
// @import "highcharts/highcharts.css";
|
|
6
|
+
|
|
7
|
+
:root {
|
|
8
|
+
--highcharts-color-0: #{$data_1};
|
|
9
|
+
--highcharts-color-1: #{$data_2};
|
|
10
|
+
--highcharts-color-2: #{$data_3};
|
|
11
|
+
--highcharts-color-3: #{$data_4};
|
|
12
|
+
--highcharts-color-4: #{$data_5};
|
|
13
|
+
--highcharts-color-5: #{$data_6};
|
|
14
|
+
--highcharts-color-6: #{$data_7};
|
|
15
|
+
--highcharts-color-7: #{$data_8};
|
|
16
|
+
}
|
|
17
|
+
|
|
18
|
+
.highcharts-title {
|
|
19
|
+
font-family: $font_family_base;
|
|
20
|
+
font-weight: $bold;
|
|
21
|
+
font-size: $heading_3;
|
|
22
|
+
color: $text_lt_default;
|
|
23
|
+
fill: $text_lt_default;
|
|
24
|
+
}
|
|
25
|
+
|
|
26
|
+
.highcharts-subtitle {
|
|
27
|
+
font-family: $font_family_base;
|
|
28
|
+
color: $text_lt_light;
|
|
29
|
+
fill: $text_lt_light;
|
|
30
|
+
font-weight: $regular;
|
|
31
|
+
font-size: $text_base;
|
|
32
|
+
}
|
|
33
|
+
|
|
34
|
+
.highcharts-yaxis > .highcharts-axis-title {
|
|
35
|
+
color: $text_lt_lighter;
|
|
36
|
+
fill: $text_lt_lighter;
|
|
37
|
+
font-family: $font_family_base;
|
|
38
|
+
font-weight: $bold;
|
|
39
|
+
font-size: $text_smaller;
|
|
40
|
+
}
|
|
41
|
+
|
|
42
|
+
.highcharts-axis-labels {
|
|
43
|
+
font-family: $font_family_base;
|
|
44
|
+
color: $text_lt_lighter;
|
|
45
|
+
fill: $text_lt_lighter;
|
|
46
|
+
font-weight: $bold;
|
|
47
|
+
font-size: $text_smaller;
|
|
48
|
+
}
|
|
49
|
+
|
|
50
|
+
.highcharts-grid-line {
|
|
51
|
+
stroke: $border_light;
|
|
52
|
+
}
|
|
@@ -1,11 +1,7 @@
|
|
|
1
1
|
import colors from '../tokens/exports/_colors.module.scss'
|
|
2
2
|
import typography from '../tokens/exports/_typography.module.scss'
|
|
3
3
|
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
import { PlotTreemapOptions } from "highcharts";
|
|
7
|
-
|
|
8
|
-
const highchartsDarkTheme: ThemeProps = {
|
|
4
|
+
const highchartsDarkTheme = {
|
|
9
5
|
lang: {
|
|
10
6
|
thousandsSep: ',',
|
|
11
7
|
},
|
|
@@ -202,7 +198,7 @@ const highchartsDarkTheme: ThemeProps = {
|
|
|
202
198
|
traverseUpButton: {
|
|
203
199
|
position: { y: -50 },
|
|
204
200
|
},
|
|
205
|
-
}
|
|
201
|
+
},
|
|
206
202
|
},
|
|
207
203
|
credits: {
|
|
208
204
|
enabled: false
|
|
@@ -1,11 +1,7 @@
|
|
|
1
1
|
import colors from '../tokens/exports/_colors.module.scss'
|
|
2
2
|
import typography from '../tokens/exports/_typography.module.scss'
|
|
3
3
|
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
import { PlotTreemapOptions } from "highcharts";
|
|
7
|
-
|
|
8
|
-
const highchartsTheme: ThemeProps = {
|
|
4
|
+
const highchartsTheme = {
|
|
9
5
|
lang: {
|
|
10
6
|
thousandsSep: ',',
|
|
11
7
|
},
|
|
@@ -201,7 +197,7 @@ const highchartsTheme: ThemeProps = {
|
|
|
201
197
|
traverseUpButton: {
|
|
202
198
|
position: { y: -50 },
|
|
203
199
|
},
|
|
204
|
-
}
|
|
200
|
+
},
|
|
205
201
|
},
|
|
206
202
|
credits: {
|
|
207
203
|
enabled: false
|