Skip to content

Commit d87138f

Browse files
committed
- Fix popover text color;
- Fix modal buttons; - Fix typography color; - Fix colors in several charts; - Fix input colors in forms elements
1 parent 870863f commit d87138f

File tree

10 files changed

+2091
-1379
lines changed

10 files changed

+2091
-1379
lines changed

src/pages/Charts/Apex/mock.js

Lines changed: 412 additions & 290 deletions
Large diffs are not rendered by default.

src/pages/Charts/Charts.vue

Lines changed: 91 additions & 44 deletions
Original file line numberDiff line numberDiff line change
@@ -12,76 +12,117 @@
1212
<b-row>
1313
<b-col xs="12" lg="7">
1414
<Widget
15-
title="<h5>Apex <span class='fw-semi-bold'>Column Chart</span></h5>"
16-
close collapse customHeader
15+
title="<h5>Apex <span class='fw-semi-bold'>Column Chart</span></h5>"
16+
close
17+
collapse
18+
customHeader
1719
>
18-
<apexchart type="bar" height="350" :series="cd.apex.column.series" :options="cd.apex.column.options"/>
20+
<apexchart
21+
type="bar"
22+
height="350"
23+
:series="cd.apex.column.series"
24+
:options="cd.apex.column.options"
25+
/>
1926
</Widget>
20-
2127
</b-col>
2228
<b-col xs="12" lg="5">
2329
<Widget
24-
title="<h5>Echarts <span class='fw-semi-bold'>Line Chart</span></h5>"
25-
close collapse customHeader
30+
title="<h5>Echarts <span class='fw-semi-bold'>Line Chart</span></h5>"
31+
close
32+
collapse
33+
customHeader
2634
>
27-
<echart :options="cd.echarts.line" :init-options="initEchartsOptions" style="height: 370px"></echart>
35+
<echart
36+
:options="cd.echarts.line"
37+
:init-options="initEchartsOptions"
38+
style="height: 370px"
39+
></echart>
2840
</Widget>
2941
</b-col>
30-
<b-col xs='12' lg='5'>
42+
<b-col xs="12" lg="5">
3143
<Widget
32-
title="<h5>Highcharts <span class='fw-semi-bold'>Line Chart</span></h5>"
33-
close collapse customHeader
44+
title="<h5>Highcharts <span class='fw-semi-bold'>Line Chart</span></h5>"
45+
close
46+
collapse
47+
customHeader
3448
>
3549
<highcharts :options="cd.highcharts.mixed"></highcharts>
36-
<h5 class="mt">Interactive <span class="fw-semi-bold">Sparklines</span></h5>
50+
<h5 class="mt">
51+
Interactive <span class="fw-semi-bold">Sparklines</span>
52+
</h5>
3753
<b-row class="mt">
38-
<b-col md='6' xs='12'>
54+
<b-col md="6" xs="12">
3955
<div class="stats-row">
4056
<div class="stat-item">
4157
<p class="value5 fw-thin">34 567</p>
4258
<h6 class="name text-muted m-0 fs-mini">Overall Values</h6>
4359
</div>
4460
<div class="stat-item stat-item-mini-chart">
45-
<Sparklines :data="sparklineData.series" :options="sparklineData.options1" :width="80" :height="25"></Sparklines>
61+
<Sparklines
62+
:data="sparklineData.series"
63+
:options="sparklineData.options1"
64+
:width="80"
65+
:height="25"
66+
></Sparklines>
4667
</div>
4768
</div>
4869
</b-col>
49-
<b-col md='6' xs='12'>
70+
<b-col md="6" xs="12">
5071
<div class="stats-row">
5172
<div class="stat-item">
5273
<p class="value5 fw-thin">34 567</p>
5374
<h6 class="name text-muted m-0 fs-mini">Overall Values</h6>
5475
</div>
5576
<div class="stat-item stat-item-mini-chart">
56-
<Sparklines :data="sparklineData.series" :options="sparklineData.options2" :width="80" :height="25"></Sparklines>
77+
<Sparklines
78+
:data="sparklineData.series"
79+
:options="sparklineData.options2"
80+
:width="80"
81+
:height="25"
82+
></Sparklines>
5783
</div>
5884
</div>
5985
</b-col>
6086
</b-row>
6187
</Widget>
6288
</b-col>
63-
<b-col xs='12' lg='7'>
89+
<b-col xs="12" lg="7">
6490
<b-row>
6591
<b-col xs="12" lg="6">
6692
<Widget
67-
title="<h5>Apex <span class='fw-semi-bold'>Monochrome Pie</span></h5>"
68-
close collapse customHeader
93+
title="<h5>Apex <span class='fw-semi-bold'>Monochrome Pie</span></h5>"
94+
close
95+
collapse
96+
customHeader
6997
>
70-
<apexchart type="pie" height="200" :series="cd.apex.pie.series" :options="cd.apex.pie.options"/>
98+
<apexchart
99+
type="pie"
100+
height="200"
101+
:series="cd.apex.pie.series"
102+
:options="cd.apex.pie.options"
103+
/>
71104
</Widget>
72105
</b-col>
73106
<b-col xs="12" lg="6">
74107
<Widget
75-
title="<h5>Echart <span class='fw-semi-bold'>Donut Chart</span></h5>"
76-
close collapse customHeader
108+
title="<h5>Echart <span class='fw-semi-bold'>Donut Chart</span></h5>"
109+
close
110+
collapse
111+
customHeader
77112
>
78-
<echart :options="cd.echarts.donut" :init-options="initEchartsOptions" style="height: 175px"></echart>
113+
<echart
114+
:options="cd.echarts.donut"
115+
:init-options="initEchartsOptions"
116+
style="height: 175px"
117+
></echart>
79118
</Widget>
80119
</b-col>
81120
<b-col xs="12" lg="12">
82121
<Widget
83-
title="<h5>Highcharts <span class='fw-semi-bold'>Live Chart</span></h5>"
84-
close collapse customHeader
122+
title="<h5>Highcharts <span class='fw-semi-bold'>Live Chart</span></h5>"
123+
close
124+
collapse
125+
customHeader
85126
>
86127
<highcharts :options="ld" ref="highchart"></highcharts>
87128
</Widget>
@@ -90,10 +131,16 @@
90131
</b-col>
91132
<b-col xs="12" lg="12">
92133
<Widget
93-
title="<h5>Echart <span class='fw-semi-bold'>River Chart</span></h5>"
94-
close collapse customHeader
134+
title="<h5>Echart <span class='fw-semi-bold'>River Chart</span></h5>"
135+
close
136+
collapse
137+
customHeader
95138
>
96-
<echart :options="cd.echarts.river" :init-options="initEchartsOptions" style="height: 350px;"></echart>
139+
<echart
140+
:options="cd.echarts.river"
141+
:init-options="initEchartsOptions"
142+
style="height: 350px;"
143+
></echart>
97144
</Widget>
98145
</b-col>
99146
</b-row>
@@ -102,8 +149,8 @@
102149
</template>
103150

104151
<script>
105-
import Widget from "@/components/Widget/Widget";
106-
import {chartData, liveChart, liveChartInterval} from './mock';
152+
import Widget from '@/components/Widget/Widget';
153+
import { chartData, liveChart, liveChartInterval } from './mock';
107154
108155
import ECharts from 'vue-echarts/components/ECharts';
109156
import 'echarts/lib/chart/line';
@@ -119,46 +166,46 @@ exporting(Highcharts);
119166
exportData(Highcharts);
120167
121168
import { Chart } from 'highcharts-vue';
122-
import Sparklines from '../../components/Sparklines/Sparklines'
169+
import Sparklines from '../../components/Sparklines/Sparklines';
123170
124171
export default {
125-
name: "Charts",
172+
name: 'Charts',
126173
components: { Widget, echart: ECharts, highcharts: Chart, Sparklines },
127174
data() {
128175
return {
129176
cd: chartData,
130177
ld: liveChart,
131178
initEchartsOptions: {
132-
renderer: 'canvas'
133-
}
179+
renderer: 'canvas',
180+
},
134181
};
135182
},
136183
computed: {
137184
sparklineData() {
138185
return {
139-
series: [{data: [1, 7, 3, 5, 7, 8]}],
186+
series: [{ data: [1, 7, 3, 5, 7, 8] }],
140187
options1: {
141188
colors: [this.appConfig.colors.green],
142189
plotOptions: {
143190
bar: {
144-
columnWidth: '50%'
145-
}
146-
}
191+
columnWidth: '50%',
192+
},
193+
},
147194
},
148195
options2: {
149196
colors: [this.appConfig.colors.red],
150197
plotOptions: {
151198
bar: {
152-
columnWidth: '50%'
153-
}
154-
}
155-
}
156-
}
157-
}
199+
columnWidth: '50%',
200+
},
201+
},
202+
},
203+
};
204+
},
158205
},
159206
beforeDestroy() {
160207
clearInterval(liveChartInterval);
161-
}
208+
},
162209
};
163210
</script>
164211

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
@import '../../../styles/app';
22

33
.highcharts-page {
4-
.highchart-font text{
5-
font-family: $font-family-base!important;
4+
.highchart-font text {
5+
font-family: $font-family-base !important;
66
}
77
}

0 commit comments

Comments
 (0)