Update chart samples to use new variables

This commit is contained in:
Cagatay Civici 2024-03-27 00:24:49 +03:00
parent c06dd3f14c
commit dfcc243fe1
13 changed files with 169 additions and 169 deletions

View file

@ -49,19 +49,19 @@ export default {
{
type: 'bar',
label: 'Dataset 1',
backgroundColor: documentStyle.getPropertyValue('--cyan-500'),
backgroundColor: documentStyle.getPropertyValue('--p-cyan-500'),
data: [50, 25, 12, 48, 90, 76, 42]
},
{
type: 'bar',
label: 'Dataset 2',
backgroundColor: documentStyle.getPropertyValue('--gray-500'),
backgroundColor: documentStyle.getPropertyValue('--p-gray-500'),
data: [21, 84, 24, 75, 37, 65, 34]
},
{
type: 'bar',
label: 'Dataset 3',
backgroundColor: documentStyle.getPropertyValue('--orange-500'),
backgroundColor: documentStyle.getPropertyValue('--p-orange-500'),
data: [41, 52, 24, 74, 23, 21, 32]
}
]
@ -70,8 +70,8 @@ export default {
setChartOptions() {
const documentStyle = getComputedStyle(document.documentElement);
const textColor = documentStyle.getPropertyValue('--text-color');
const textColorSecondary = documentStyle.getPropertyValue('--text-color-secondary');
const surfaceBorder = documentStyle.getPropertyValue('--surface-border');
const textColorSecondary = documentStyle.getPropertyValue('--text-secondary-color');
const surfaceBorder = documentStyle.getPropertyValue('--border-color');
return {
maintainAspectRatio: false,
@ -140,19 +140,19 @@ const setChartData = () => {
{
type: 'bar',
label: 'Dataset 1',
backgroundColor: documentStyle.getPropertyValue('--cyan-500'),
backgroundColor: documentStyle.getPropertyValue('--p-cyan-500'),
data: [50, 25, 12, 48, 90, 76, 42]
},
{
type: 'bar',
label: 'Dataset 2',
backgroundColor: documentStyle.getPropertyValue('--gray-500'),
backgroundColor: documentStyle.getPropertyValue('--p-gray-500'),
data: [21, 84, 24, 75, 37, 65, 34]
},
{
type: 'bar',
label: 'Dataset 3',
backgroundColor: documentStyle.getPropertyValue('--orange-500'),
backgroundColor: documentStyle.getPropertyValue('--p-orange-500'),
data: [41, 52, 24, 74, 23, 21, 32]
}
]
@ -161,8 +161,8 @@ const setChartData = () => {
const setChartOptions = () => {
const documentStyle = getComputedStyle(document.documentElement);
const textColor = documentStyle.getPropertyValue('--text-color');
const textColorSecondary = documentStyle.getPropertyValue('--text-color-secondary');
const surfaceBorder = documentStyle.getPropertyValue('--surface-border');
const textColorSecondary = documentStyle.getPropertyValue('--text-secondary-color');
const surfaceBorder = documentStyle.getPropertyValue('--border-color');
return {
maintainAspectRatio: false,
@ -225,19 +225,19 @@ const setChartOptions = () => {
{
type: 'bar',
label: 'Dataset 1',
backgroundColor: documentStyle.getPropertyValue('--cyan-500'),
backgroundColor: documentStyle.getPropertyValue('--p-cyan-500'),
data: [50, 25, 12, 48, 90, 76, 42]
},
{
type: 'bar',
label: 'Dataset 2',
backgroundColor: documentStyle.getPropertyValue('--gray-500'),
backgroundColor: documentStyle.getPropertyValue('--p-gray-500'),
data: [21, 84, 24, 75, 37, 65, 34]
},
{
type: 'bar',
label: 'Dataset 3',
backgroundColor: documentStyle.getPropertyValue('--orange-500'),
backgroundColor: documentStyle.getPropertyValue('--p-orange-500'),
data: [41, 52, 24, 74, 23, 21, 32]
}
]
@ -246,8 +246,8 @@ const setChartOptions = () => {
setChartOptions() {
const documentStyle = getComputedStyle(document.documentElement);
const textColor = documentStyle.getPropertyValue('--text-color');
const textColorSecondary = documentStyle.getPropertyValue('--text-color-secondary');
const surfaceBorder = documentStyle.getPropertyValue('--surface-border');
const textColorSecondary = documentStyle.getPropertyValue('--text-secondary-color');
const surfaceBorder = documentStyle.getPropertyValue('--border-color');
return {
maintainAspectRatio: false,