From 224b4ee9ff2a4c8a9b804c576e579733ddc013f1 Mon Sep 17 00:00:00 2001 From: Cagatay Civici Date: Tue, 21 May 2024 11:07:57 +0300 Subject: [PATCH] Fixed chart colors --- components/landing/HeroSection.vue | 4 ++-- doc/chart/BasicDoc.vue | 18 +++++++++--------- doc/chart/ComboDoc.vue | 18 +++++++++--------- doc/chart/DoughnutDoc.vue | 6 +++--- doc/chart/HorizontalBarDoc.vue | 18 +++++++++--------- doc/chart/LineDoc.vue | 18 +++++++++--------- doc/chart/LineStylesDoc.vue | 18 +++++++++--------- doc/chart/MultiAxisDoc.vue | 18 +++++++++--------- doc/chart/PieChartDoc.vue | 6 +++--- doc/chart/PolarAreaDoc.vue | 12 ++++++------ doc/chart/RadarDoc.vue | 18 +++++++++--------- doc/chart/StackedBarDoc.vue | 18 +++++++++--------- doc/chart/VerticalBarDoc.vue | 18 +++++++++--------- 13 files changed, 95 insertions(+), 95 deletions(-) diff --git a/components/landing/HeroSection.vue b/components/landing/HeroSection.vue index 6210257ea..79be1223f 100644 --- a/components/landing/HeroSection.vue +++ b/components/landing/HeroSection.vue @@ -245,8 +245,8 @@ export default { }, setChartOptions() { const documentStyle = getComputedStyle(document.documentElement); - const textColorSecondary = documentStyle.getPropertyValue('--text-surface-500 dark:text-surface-400-color'); - const surfaceBorder = documentStyle.getPropertyValue('--border-color'); + const textColorSecondary = documentStyle.getPropertyValue('--p-text-muted-color'); + const surfaceBorder = documentStyle.getPropertyValue('p-content-border-color'); return { plugins: { diff --git a/doc/chart/BasicDoc.vue b/doc/chart/BasicDoc.vue index 5b547d911..fec24917a 100644 --- a/doc/chart/BasicDoc.vue +++ b/doc/chart/BasicDoc.vue @@ -60,9 +60,9 @@ export default { }, setChartOptions() { const documentStyle = getComputedStyle(document.documentElement); - const textColor = documentStyle.getPropertyValue('--text-color'); - const textColorSecondary = documentStyle.getPropertyValue('--text-secondary-color'); - const surfaceBorder = documentStyle.getPropertyValue('--border-color'); + const textColor = documentStyle.getPropertyValue('--p-text-color'); + const textColorSecondary = documentStyle.getPropertyValue('--p-text-muted-color'); + const surfaceBorder = documentStyle.getPropertyValue('--p-content-border-color'); return { plugins: { @@ -131,9 +131,9 @@ const setChartData = () => { }; const setChartOptions = () => { const documentStyle = getComputedStyle(document.documentElement); - const textColor = documentStyle.getPropertyValue('--text-color'); - const textColorSecondary = documentStyle.getPropertyValue('--text-secondary-color'); - const surfaceBorder = documentStyle.getPropertyValue('--border-color'); + const textColor = documentStyle.getPropertyValue('--p-text-color'); + const textColorSecondary = documentStyle.getPropertyValue('--p-text-muted-color'); + const surfaceBorder = documentStyle.getPropertyValue('--p-content-border-color'); return { plugins: { @@ -201,9 +201,9 @@ const setChartOptions = () => { }, setChartOptions() { const documentStyle = getComputedStyle(document.documentElement); - const textColor = documentStyle.getPropertyValue('--text-color'); - const textColorSecondary = documentStyle.getPropertyValue('--text-secondary-color'); - const surfaceBorder = documentStyle.getPropertyValue('--border-color'); + const textColor = documentStyle.getPropertyValue('--p-text-color'); + const textColorSecondary = documentStyle.getPropertyValue('--p-text-muted-color'); + const surfaceBorder = documentStyle.getPropertyValue('--p-content-border-color'); return { plugins: { diff --git a/doc/chart/ComboDoc.vue b/doc/chart/ComboDoc.vue index 3b6c09fc9..2e0b73f8c 100644 --- a/doc/chart/ComboDoc.vue +++ b/doc/chart/ComboDoc.vue @@ -75,9 +75,9 @@ export default { }, setChartOptions() { const documentStyle = getComputedStyle(document.documentElement); - const textColor = documentStyle.getPropertyValue('--text-color'); - const textColorSecondary = documentStyle.getPropertyValue('--text-secondary-color'); - const surfaceBorder = documentStyle.getPropertyValue('--border-color'); + const textColor = documentStyle.getPropertyValue('--p-text-color'); + const textColorSecondary = documentStyle.getPropertyValue('--p-text-muted-color'); + const surfaceBorder = documentStyle.getPropertyValue('--p-content-border-color'); return { maintainAspectRatio: false, @@ -165,9 +165,9 @@ const setChartData = () => { }; const setChartOptions = () => { const documentStyle = getComputedStyle(document.documentElement); - const textColor = documentStyle.getPropertyValue('--text-color'); - const textColorSecondary = documentStyle.getPropertyValue('--text-secondary-color'); - const surfaceBorder = documentStyle.getPropertyValue('--border-color'); + const textColor = documentStyle.getPropertyValue('--p-text-color'); + const textColorSecondary = documentStyle.getPropertyValue('--p-text-muted-color'); + const surfaceBorder = documentStyle.getPropertyValue('--p-content-border-color'); return { maintainAspectRatio: false, @@ -254,9 +254,9 @@ const setChartOptions = () => { }, setChartOptions() { const documentStyle = getComputedStyle(document.documentElement); - const textColor = documentStyle.getPropertyValue('--text-color'); - const textColorSecondary = documentStyle.getPropertyValue('--text-secondary-color'); - const surfaceBorder = documentStyle.getPropertyValue('--border-color'); + const textColor = documentStyle.getPropertyValue('--p-text-color'); + const textColorSecondary = documentStyle.getPropertyValue('--p-text-muted-color'); + const surfaceBorder = documentStyle.getPropertyValue('--p-content-border-color'); return { maintainAspectRatio: false, diff --git a/doc/chart/DoughnutDoc.vue b/doc/chart/DoughnutDoc.vue index 878397513..dcc27dc0f 100644 --- a/doc/chart/DoughnutDoc.vue +++ b/doc/chart/DoughnutDoc.vue @@ -59,7 +59,7 @@ export default { }, setChartOptions() { const documentStyle = getComputedStyle(document.documentElement); - const textColor = documentStyle.getPropertyValue('--text-color'); + const textColor = documentStyle.getPropertyValue('--p-text-color'); return { plugins: { @@ -111,7 +111,7 @@ const setChartData = () => { const setChartOptions = () => { const documentStyle = getComputedStyle(document.documentElement); - const textColor = documentStyle.getPropertyValue('--text-color'); + const textColor = documentStyle.getPropertyValue('--p-text-color'); return { plugins: { @@ -161,7 +161,7 @@ const setChartOptions = () => { }, setChartOptions() { const documentStyle = getComputedStyle(document.documentElement); - const textColor = documentStyle.getPropertyValue('--text-color'); + const textColor = documentStyle.getPropertyValue('--p-text-color'); return { plugins: { diff --git a/doc/chart/HorizontalBarDoc.vue b/doc/chart/HorizontalBarDoc.vue index fea4a93d6..f82b907ac 100644 --- a/doc/chart/HorizontalBarDoc.vue +++ b/doc/chart/HorizontalBarDoc.vue @@ -64,9 +64,9 @@ export default { }, setChartOptions() { const documentStyle = getComputedStyle(document.documentElement); - const textColor = documentStyle.getPropertyValue('--text-color'); - const textColorSecondary = documentStyle.getPropertyValue('--text-secondary-color'); - const surfaceBorder = documentStyle.getPropertyValue('--border-color'); + const textColor = documentStyle.getPropertyValue('--p-text-color'); + const textColorSecondary = documentStyle.getPropertyValue('--p-text-muted-color'); + const surfaceBorder = documentStyle.getPropertyValue('--p-content-border-color'); return { indexAxis: 'y', @@ -149,9 +149,9 @@ const setChartData = () => { }; const setChartOptions = () => { const documentStyle = getComputedStyle(document.documentElement); - const textColor = documentStyle.getPropertyValue('--text-color'); - const textColorSecondary = documentStyle.getPropertyValue('--text-secondary-color'); - const surfaceBorder = documentStyle.getPropertyValue('--border-color'); + const textColor = documentStyle.getPropertyValue('--p-text-color'); + const textColorSecondary = documentStyle.getPropertyValue('--p-text-muted-color'); + const surfaceBorder = documentStyle.getPropertyValue('--p-content-border-color'); return { indexAxis: 'y', @@ -233,9 +233,9 @@ const setChartOptions = () => { }, setChartOptions() { const documentStyle = getComputedStyle(document.documentElement); - const textColor = documentStyle.getPropertyValue('--text-color'); - const textColorSecondary = documentStyle.getPropertyValue('--text-secondary-color'); - const surfaceBorder = documentStyle.getPropertyValue('--border-color'); + const textColor = documentStyle.getPropertyValue('--p-text-color'); + const textColorSecondary = documentStyle.getPropertyValue('--p-text-muted-color'); + const surfaceBorder = documentStyle.getPropertyValue('--p-content-border-color'); return { indexAxis: 'y', diff --git a/doc/chart/LineDoc.vue b/doc/chart/LineDoc.vue index 6f69233ce..b288c2c50 100644 --- a/doc/chart/LineDoc.vue +++ b/doc/chart/LineDoc.vue @@ -66,9 +66,9 @@ export default { }, setChartOptions() { const documentStyle = getComputedStyle(document.documentElement); - const textColor = documentStyle.getPropertyValue('--text-color'); - const textColorSecondary = documentStyle.getPropertyValue('--text-secondary-color'); - const surfaceBorder = documentStyle.getPropertyValue('--border-color'); + const textColor = documentStyle.getPropertyValue('--p-text-color'); + const textColorSecondary = documentStyle.getPropertyValue('--p-text-muted-color'); + const surfaceBorder = documentStyle.getPropertyValue('--p-content-border-color'); return { maintainAspectRatio: false, @@ -147,9 +147,9 @@ const setChartData = () => { }; const setChartOptions = () => { const documentStyle = getComputedStyle(document.documentElement); - const textColor = documentStyle.getPropertyValue('--text-color'); - const textColorSecondary = documentStyle.getPropertyValue('--text-secondary-color'); - const surfaceBorder = documentStyle.getPropertyValue('--border-color'); + const textColor = documentStyle.getPropertyValue('--p-text-color'); + const textColorSecondary = documentStyle.getPropertyValue('--p-text-muted-color'); + const surfaceBorder = documentStyle.getPropertyValue('--p-content-border-color'); return { maintainAspectRatio: false, @@ -227,9 +227,9 @@ const setChartOptions = () => { }, setChartOptions() { const documentStyle = getComputedStyle(document.documentElement); - const textColor = documentStyle.getPropertyValue('--text-color'); - const textColorSecondary = documentStyle.getPropertyValue('--text-secondary-color'); - const surfaceBorder = documentStyle.getPropertyValue('--border-color'); + const textColor = documentStyle.getPropertyValue('--p-text-color'); + const textColorSecondary = documentStyle.getPropertyValue('--p-text-muted-color'); + const surfaceBorder = documentStyle.getPropertyValue('--p-content-border-color'); return { maintainAspectRatio: false, diff --git a/doc/chart/LineStylesDoc.vue b/doc/chart/LineStylesDoc.vue index f99041c8b..045981296 100644 --- a/doc/chart/LineStylesDoc.vue +++ b/doc/chart/LineStylesDoc.vue @@ -75,9 +75,9 @@ export default { }, setChartOptions() { const documentStyle = getComputedStyle(document.documentElement); - const textColor = documentStyle.getPropertyValue('--text-color'); - const textColorSecondary = documentStyle.getPropertyValue('--text-secondary-color'); - const surfaceBorder = documentStyle.getPropertyValue('--border-color'); + const textColor = documentStyle.getPropertyValue('--p-text-color'); + const textColorSecondary = documentStyle.getPropertyValue('--p-text-muted-color'); + const surfaceBorder = documentStyle.getPropertyValue('--p-content-border-color'); return { maintainAspectRatio: false, @@ -165,9 +165,9 @@ const setChartData = () => { }; const setChartOptions = () => { const documentStyle = getComputedStyle(document.documentElement); - const textColor = documentStyle.getPropertyValue('--text-color'); - const textColorSecondary = documentStyle.getPropertyValue('--text-secondary-color'); - const surfaceBorder = documentStyle.getPropertyValue('--border-color'); + const textColor = documentStyle.getPropertyValue('--p-text-color'); + const textColorSecondary = documentStyle.getPropertyValue('--p-text-muted-color'); + const surfaceBorder = documentStyle.getPropertyValue('--p-content-border-color'); return { maintainAspectRatio: false, @@ -254,9 +254,9 @@ const setChartOptions = () => { }, setChartOptions() { const documentStyle = getComputedStyle(document.documentElement); - const textColor = documentStyle.getPropertyValue('--text-color'); - const textColorSecondary = documentStyle.getPropertyValue('--text-secondary-color'); - const surfaceBorder = documentStyle.getPropertyValue('--border-color'); + const textColor = documentStyle.getPropertyValue('--p-text-color'); + const textColorSecondary = documentStyle.getPropertyValue('--p-text-muted-color'); + const surfaceBorder = documentStyle.getPropertyValue('--p-content-border-color'); return { maintainAspectRatio: false, diff --git a/doc/chart/MultiAxisDoc.vue b/doc/chart/MultiAxisDoc.vue index 19a4eacee..94bccb842 100644 --- a/doc/chart/MultiAxisDoc.vue +++ b/doc/chart/MultiAxisDoc.vue @@ -68,9 +68,9 @@ export default { }, setChartOptions() { const documentStyle = getComputedStyle(document.documentElement); - const textColor = documentStyle.getPropertyValue('--text-color'); - const textColorSecondary = documentStyle.getPropertyValue('--text-secondary-color'); - const surfaceBorder = documentStyle.getPropertyValue('--border-color'); + const textColor = documentStyle.getPropertyValue('--p-text-color'); + const textColorSecondary = documentStyle.getPropertyValue('--p-text-muted-color'); + const surfaceBorder = documentStyle.getPropertyValue('--p-content-border-color'); return { stacked: false, @@ -167,9 +167,9 @@ const setChartData = () => { }; const setChartOptions = () => { const documentStyle = getComputedStyle(document.documentElement); - const textColor = documentStyle.getPropertyValue('--text-color'); - const textColorSecondary = documentStyle.getPropertyValue('--text-secondary-color'); - const surfaceBorder = documentStyle.getPropertyValue('--border-color'); + const textColor = documentStyle.getPropertyValue('--p-text-color'); + const textColorSecondary = documentStyle.getPropertyValue('--p-text-muted-color'); + const surfaceBorder = documentStyle.getPropertyValue('--p-content-border-color'); return { stacked: false, @@ -265,9 +265,9 @@ const setChartOptions = () => { }, setChartOptions() { const documentStyle = getComputedStyle(document.documentElement); - const textColor = documentStyle.getPropertyValue('--text-color'); - const textColorSecondary = documentStyle.getPropertyValue('--text-secondary-color'); - const surfaceBorder = documentStyle.getPropertyValue('--border-color'); + const textColor = documentStyle.getPropertyValue('--p-text-color'); + const textColorSecondary = documentStyle.getPropertyValue('--p-text-muted-color'); + const surfaceBorder = documentStyle.getPropertyValue('--p-content-border-color'); return { stacked: false, diff --git a/doc/chart/PieChartDoc.vue b/doc/chart/PieChartDoc.vue index f2a94d65f..011303146 100644 --- a/doc/chart/PieChartDoc.vue +++ b/doc/chart/PieChartDoc.vue @@ -57,7 +57,7 @@ export default { }, setChartOptions() { const documentStyle = getComputedStyle(document.documentElement); - const textColor = documentStyle.getPropertyValue('--text-color'); + const textColor = documentStyle.getPropertyValue('--p-text-color'); return { plugins: { @@ -109,7 +109,7 @@ const setChartData = () => { const setChartOptions = () => { const documentStyle = getComputedStyle(document.documentElement); - const textColor = documentStyle.getPropertyValue('--text-color'); + const textColor = documentStyle.getPropertyValue('--p-text-color'); return { plugins: { @@ -159,7 +159,7 @@ const setChartOptions = () => { }, setChartOptions() { const documentStyle = getComputedStyle(document.documentElement); - const textColor = documentStyle.getPropertyValue('--text-color'); + const textColor = documentStyle.getPropertyValue('--p-text-color'); return { plugins: { diff --git a/doc/chart/PolarAreaDoc.vue b/doc/chart/PolarAreaDoc.vue index 1d0ad2e09..6a9eb575b 100644 --- a/doc/chart/PolarAreaDoc.vue +++ b/doc/chart/PolarAreaDoc.vue @@ -63,8 +63,8 @@ export default { }, setChartOptions() { const documentStyle = getComputedStyle(document.documentElement); - const textColor = documentStyle.getPropertyValue('--text-color'); - const surfaceBorder = documentStyle.getPropertyValue('--border-color'); + const textColor = documentStyle.getPropertyValue('--p-text-color'); + const surfaceBorder = documentStyle.getPropertyValue('--p-content-border-color'); return { plugins: { @@ -127,8 +127,8 @@ const setChartData = () => { }; const setChartOptions = () => { const documentStyle = getComputedStyle(document.documentElement); - const textColor = documentStyle.getPropertyValue('--text-color'); - const surfaceBorder = documentStyle.getPropertyValue('--border-color'); + const textColor = documentStyle.getPropertyValue('--p-text-color'); + const surfaceBorder = documentStyle.getPropertyValue('--p-content-border-color'); return { plugins: { @@ -190,8 +190,8 @@ const setChartOptions = () => { }, setChartOptions() { const documentStyle = getComputedStyle(document.documentElement); - const textColor = documentStyle.getPropertyValue('--text-color'); - const surfaceBorder = documentStyle.getPropertyValue('--border-color'); + const textColor = documentStyle.getPropertyValue('--p-text-color'); + const surfaceBorder = documentStyle.getPropertyValue('--p-content-border-color'); return { plugins: { diff --git a/doc/chart/RadarDoc.vue b/doc/chart/RadarDoc.vue index 83239ef48..5a90f90c6 100644 --- a/doc/chart/RadarDoc.vue +++ b/doc/chart/RadarDoc.vue @@ -43,7 +43,7 @@ export default { methods: { setChartData() { const documentStyle = getComputedStyle(document.documentElement); - const textColor = documentStyle.getPropertyValue('--text-color'); + const textColor = documentStyle.getPropertyValue('--p-text-color'); return { labels: ['Eating', 'Drinking', 'Sleeping', 'Designing', 'Coding', 'Cycling', 'Running'], @@ -71,8 +71,8 @@ export default { }, setChartOptions() { const documentStyle = getComputedStyle(document.documentElement); - const textColor = documentStyle.getPropertyValue('--text-color'); - const textColorSecondary = documentStyle.getPropertyValue('--text-secondary-color'); + const textColor = documentStyle.getPropertyValue('--p-text-color'); + const textColorSecondary = documentStyle.getPropertyValue('--p-text-muted-color'); return { plugins: { @@ -115,7 +115,7 @@ const chartOptions = ref(); const setChartData = () => { const documentStyle = getComputedStyle(document.documentElement); - const textColor = documentStyle.getPropertyValue('--text-color'); + const textColor = documentStyle.getPropertyValue('--p-text-color'); return { labels: ['Eating', 'Drinking', 'Sleeping', 'Designing', 'Coding', 'Cycling', 'Running'], @@ -143,8 +143,8 @@ const setChartData = () => { }; const setChartOptions = () => { const documentStyle = getComputedStyle(document.documentElement); - const textColor = documentStyle.getPropertyValue('--text-color'); - const textColorSecondary = documentStyle.getPropertyValue('--text-secondary-color'); + const textColor = documentStyle.getPropertyValue('--p-text-color'); + const textColorSecondary = documentStyle.getPropertyValue('--p-text-muted-color'); return { plugins: { @@ -186,7 +186,7 @@ const setChartOptions = () => { methods: { setChartData() { const documentStyle = getComputedStyle(document.documentElement); - const textColor = documentStyle.getPropertyValue('--text-color'); + const textColor = documentStyle.getPropertyValue('--p-text-color'); return { labels: ['Eating', 'Drinking', 'Sleeping', 'Designing', 'Coding', 'Cycling', 'Running'], @@ -214,8 +214,8 @@ const setChartOptions = () => { }, setChartOptions() { const documentStyle = getComputedStyle(document.documentElement); - const textColor = documentStyle.getPropertyValue('--text-color'); - const textColorSecondary = documentStyle.getPropertyValue('--text-secondary-color'); + const textColor = documentStyle.getPropertyValue('--p-text-color'); + const textColorSecondary = documentStyle.getPropertyValue('--p-text-muted-color'); return { plugins: { diff --git a/doc/chart/StackedBarDoc.vue b/doc/chart/StackedBarDoc.vue index 4dc868265..b146b951c 100644 --- a/doc/chart/StackedBarDoc.vue +++ b/doc/chart/StackedBarDoc.vue @@ -70,9 +70,9 @@ export default { }, setChartOptions() { const documentStyle = getComputedStyle(document.documentElement); - const textColor = documentStyle.getPropertyValue('--text-color'); - const textColorSecondary = documentStyle.getPropertyValue('--text-secondary-color'); - const surfaceBorder = documentStyle.getPropertyValue('--border-color'); + const textColor = documentStyle.getPropertyValue('--p-text-color'); + const textColorSecondary = documentStyle.getPropertyValue('--p-text-muted-color'); + const surfaceBorder = documentStyle.getPropertyValue('--p-content-border-color'); return { maintainAspectRatio: false, @@ -161,9 +161,9 @@ const setChartData = () => { }; const setChartOptions = () => { const documentStyle = getComputedStyle(document.documentElement); - const textColor = documentStyle.getPropertyValue('--text-color'); - const textColorSecondary = documentStyle.getPropertyValue('--text-secondary-color'); - const surfaceBorder = documentStyle.getPropertyValue('--border-color'); + const textColor = documentStyle.getPropertyValue('--p-text-color'); + const textColorSecondary = documentStyle.getPropertyValue('--p-text-muted-color'); + const surfaceBorder = documentStyle.getPropertyValue('--p-content-border-color'); return { maintainAspectRatio: false, @@ -251,9 +251,9 @@ const setChartOptions = () => { }, setChartOptions() { const documentStyle = getComputedStyle(document.documentElement); - const textColor = documentStyle.getPropertyValue('--text-color'); - const textColorSecondary = documentStyle.getPropertyValue('--text-secondary-color'); - const surfaceBorder = documentStyle.getPropertyValue('--border-color'); + const textColor = documentStyle.getPropertyValue('--p-text-color'); + const textColorSecondary = documentStyle.getPropertyValue('--p-text-muted-color'); + const surfaceBorder = documentStyle.getPropertyValue('--p-content-border-color'); return { maintainAspectRatio: false, diff --git a/doc/chart/VerticalBarDoc.vue b/doc/chart/VerticalBarDoc.vue index aa147c8fc..f2b996d5b 100644 --- a/doc/chart/VerticalBarDoc.vue +++ b/doc/chart/VerticalBarDoc.vue @@ -64,9 +64,9 @@ export default { }, setChartOptions() { const documentStyle = getComputedStyle(document.documentElement); - const textColor = documentStyle.getPropertyValue('--text-color'); - const textColorSecondary = documentStyle.getPropertyValue('--text-secondary-color'); - const surfaceBorder = documentStyle.getPropertyValue('--border-color'); + const textColor = documentStyle.getPropertyValue('--p-text-color'); + const textColorSecondary = documentStyle.getPropertyValue('--p-text-muted-color'); + const surfaceBorder = documentStyle.getPropertyValue('--p-content-border-color'); return { maintainAspectRatio: false, @@ -148,9 +148,9 @@ const setChartData = () => { }; const setChartOptions = () => { const documentStyle = getComputedStyle(document.documentElement); - const textColor = documentStyle.getPropertyValue('--text-color'); - const textColorSecondary = documentStyle.getPropertyValue('--text-secondary-color'); - const surfaceBorder = documentStyle.getPropertyValue('--border-color'); + const textColor = documentStyle.getPropertyValue('--p-text-color'); + const textColorSecondary = documentStyle.getPropertyValue('--p-text-muted-color'); + const surfaceBorder = documentStyle.getPropertyValue('--p-content-border-color'); return { maintainAspectRatio: false, @@ -231,9 +231,9 @@ const setChartOptions = () => { }, setChartOptions() { const documentStyle = getComputedStyle(document.documentElement); - const textColor = documentStyle.getPropertyValue('--text-color'); - const textColorSecondary = documentStyle.getPropertyValue('--text-secondary-color'); - const surfaceBorder = documentStyle.getPropertyValue('--border-color'); + const textColor = documentStyle.getPropertyValue('--p-text-color'); + const textColorSecondary = documentStyle.getPropertyValue('--p-text-muted-color'); + const surfaceBorder = documentStyle.getPropertyValue('--p-content-border-color'); return { maintainAspectRatio: false,