diff --git a/doc/chart/BasicDoc.vue b/doc/chart/BasicDoc.vue index 7843d79bd..07b9ee35d 100644 --- a/doc/chart/BasicDoc.vue +++ b/doc/chart/BasicDoc.vue @@ -51,8 +51,8 @@ export default { { label: 'Sales', data: [540, 325, 702, 620], - backgroundColor: ['rgba(255, 159, 64, 0.2)', 'rgba(75, 192, 192, 0.2)', 'rgba(54, 162, 235, 0.2)', 'rgba(153, 102, 255, 0.2)'], - borderColor: ['rgb(255, 159, 64)', 'rgb(75, 192, 192)', 'rgb(54, 162, 235)', 'rgb(153, 102, 255)'], + backgroundColor: ['rgba(249, 115, 22, 0.2)', 'rgba(6, 182, 212, 0.2)', 'rgb(107, 114, 128, 0.2)', 'rgba(139, 92, 246, 0.2)'], + borderColor: ['rgb(249, 115, 22)', 'rgb(6, 182, 212)', 'rgb(107, 114, 128)', 'rgb(139, 92, 246)'], borderWidth: 1 } ] @@ -122,8 +122,8 @@ const setChartData = () => { { label: 'Sales', data: [540, 325, 702, 620], - backgroundColor: ['rgba(255, 159, 64, 0.2)', 'rgba(75, 192, 192, 0.2)', 'rgba(54, 162, 235, 0.2)', 'rgba(153, 102, 255, 0.2)'], - borderColor: ['rgb(255, 159, 64)', 'rgb(75, 192, 192)', 'rgb(54, 162, 235)', 'rgb(153, 102, 255)'], + backgroundColor: ['rgba(249, 115, 22, 0.2)', 'rgba(6, 182, 212, 0.2)', 'rgb(107, 114, 128, 0.2)', 'rgba(139, 92, 246 0.2)'], + borderColor: ['rgb(249, 115, 22)', 'rgb(6, 182, 212)', 'rgb(107, 114, 128)', 'rgb(139, 92, 246)'], borderWidth: 1 } ] @@ -190,8 +190,8 @@ const setChartOptions = () => { { label: 'Sales', data: [540, 325, 702, 620], - backgroundColor: ['rgba(255, 159, 64, 0.2)', 'rgba(75, 192, 192, 0.2)', 'rgba(54, 162, 235, 0.2)', 'rgba(153, 102, 255, 0.2)'], - borderColor: ['rgb(255, 159, 64)', 'rgb(75, 192, 192)', 'rgb(54, 162, 235)', 'rgb(153, 102, 255)'], + backgroundColor: ['rgba(249, 115, 22, 0.2)', 'rgba(6, 182, 212, 0.2)', 'rgb(107, 114, 128, 0.2)', 'rgba(139, 92, 246, 0.2)'], + borderColor: ['rgb(249, 115, 22)', 'rgb(6, 182, 212)', 'rgb(107, 114, 128)', 'rgb(139, 92, 246)'], borderWidth: 1 } ] diff --git a/doc/chart/ComboDoc.vue b/doc/chart/ComboDoc.vue index a1133bf26..3886879af 100644 --- a/doc/chart/ComboDoc.vue +++ b/doc/chart/ComboDoc.vue @@ -49,7 +49,7 @@ export default { { type: 'line', label: 'Dataset 1', - borderColor: documentStyle.getPropertyValue('--blue-500'), + borderColor: documentStyle.getPropertyValue('--orange-500'), borderWidth: 2, fill: false, tension: 0.4, @@ -58,7 +58,7 @@ export default { { type: 'bar', label: 'Dataset 2', - backgroundColor: documentStyle.getPropertyValue('--green-500'), + backgroundColor: documentStyle.getPropertyValue('--gray-500'), data: [21, 84, 24, 75, 37, 65, 34], borderColor: 'white', borderWidth: 2 @@ -66,7 +66,7 @@ export default { { type: 'bar', label: 'Dataset 3', - backgroundColor: documentStyle.getPropertyValue('--orange-500'), + backgroundColor: documentStyle.getPropertyValue('--cyan-500'), data: [41, 52, 24, 74, 23, 21, 32] } ] @@ -139,7 +139,7 @@ const setChartData = () => { { type: 'line', label: 'Dataset 1', - borderColor: documentStyle.getPropertyValue('--blue-500'), + borderColor: documentStyle.getPropertyValue('--orange-500'), borderWidth: 2, fill: false, tension: 0.4, @@ -148,7 +148,7 @@ const setChartData = () => { { type: 'bar', label: 'Dataset 2', - backgroundColor: documentStyle.getPropertyValue('--green-500'), + backgroundColor: documentStyle.getPropertyValue('--gray-500'), data: [21, 84, 24, 75, 37, 65, 34], borderColor: 'white', borderWidth: 2 @@ -156,7 +156,7 @@ const setChartData = () => { { type: 'bar', label: 'Dataset 3', - backgroundColor: documentStyle.getPropertyValue('--orange-500'), + backgroundColor: documentStyle.getPropertyValue('--cyan-500'), data: [41, 52, 24, 74, 23, 21, 32] } ] @@ -223,7 +223,7 @@ const setChartOptions = () => { { type: 'line', label: 'Dataset 1', - borderColor: documentStyle.getPropertyValue('--blue-500'), + borderColor: documentStyle.getPropertyValue('--orange-500'), borderWidth: 2, fill: false, tension: 0.4, @@ -232,7 +232,7 @@ const setChartOptions = () => { { type: 'bar', label: 'Dataset 2', - backgroundColor: documentStyle.getPropertyValue('--green-500'), + backgroundColor: documentStyle.getPropertyValue('--gray-500'), data: [21, 84, 24, 75, 37, 65, 34], borderColor: 'white', borderWidth: 2 @@ -240,7 +240,7 @@ const setChartOptions = () => { { type: 'bar', label: 'Dataset 3', - backgroundColor: documentStyle.getPropertyValue('--orange-500'), + backgroundColor: documentStyle.getPropertyValue('--cyan-500'), data: [41, 52, 24, 74, 23, 21, 32] } ] diff --git a/doc/chart/DoughnutDoc.vue b/doc/chart/DoughnutDoc.vue index 4263b2bcf..3079402ff 100644 --- a/doc/chart/DoughnutDoc.vue +++ b/doc/chart/DoughnutDoc.vue @@ -50,8 +50,8 @@ export default { datasets: [ { data: [540, 325, 702], - backgroundColor: [documentStyle.getPropertyValue('--blue-500'), documentStyle.getPropertyValue('--yellow-500'), documentStyle.getPropertyValue('--green-500')], - hoverBackgroundColor: [documentStyle.getPropertyValue('--blue-400'), documentStyle.getPropertyValue('--yellow-400'), documentStyle.getPropertyValue('--green-400')] + backgroundColor: [documentStyle.getPropertyValue('--cyan-500'), documentStyle.getPropertyValue('--orange-500'), documentStyle.getPropertyValue('--gray-500')], + hoverBackgroundColor: [documentStyle.getPropertyValue('--cyan-400'), documentStyle.getPropertyValue('--orange-400'), documentStyle.getPropertyValue('--gray-400')] } ] }; @@ -101,8 +101,8 @@ const setChartData = () => { datasets: [ { data: [540, 325, 702], - backgroundColor: [documentStyle.getPropertyValue('--blue-500'), documentStyle.getPropertyValue('--yellow-500'), documentStyle.getPropertyValue('--green-500')], - hoverBackgroundColor: [documentStyle.getPropertyValue('--blue-400'), documentStyle.getPropertyValue('--yellow-400'), documentStyle.getPropertyValue('--green-400')] + backgroundColor: [documentStyle.getPropertyValue('--cyan-500'), documentStyle.getPropertyValue('--orange-500'), documentStyle.getPropertyValue('--gray-500')], + hoverBackgroundColor: [documentStyle.getPropertyValue('--cyan-400'), documentStyle.getPropertyValue('--orange-400'), documentStyle.getPropertyValue('--gray-400')] } ] }; @@ -147,8 +147,8 @@ const setChartOptions = () => { datasets: [ { data: [300, 50, 100], - backgroundColor: [documentStyle.getPropertyValue('--blue-500'), documentStyle.getPropertyValue('--yellow-500'), documentStyle.getPropertyValue('--green-500')], - hoverBackgroundColor: [documentStyle.getPropertyValue('--blue-400'), documentStyle.getPropertyValue('--yellow-400'), documentStyle.getPropertyValue('--green-400')] + backgroundColor: [documentStyle.getPropertyValue('--cyan-500'), documentStyle.getPropertyValue('--orange-500'), documentStyle.getPropertyValue('--gray-500')], + hoverBackgroundColor: [documentStyle.getPropertyValue('--cyan-400'), documentStyle.getPropertyValue('--orange-400'), documentStyle.getPropertyValue('--gray-400')] } ] }; diff --git a/doc/chart/HorizontalBarDoc.vue b/doc/chart/HorizontalBarDoc.vue index a914a756c..910d2a1c4 100644 --- a/doc/chart/HorizontalBarDoc.vue +++ b/doc/chart/HorizontalBarDoc.vue @@ -48,14 +48,14 @@ export default { datasets: [ { label: 'My First dataset', - backgroundColor: documentStyle.getPropertyValue('--blue-500'), - borderColor: documentStyle.getPropertyValue('--blue-500'), + backgroundColor: documentStyle.getPropertyValue('--cyan-500'), + borderColor: documentStyle.getPropertyValue('--cyan-500'), data: [65, 59, 80, 81, 56, 55, 40] }, { label: 'My Second dataset', - backgroundColor: documentStyle.getPropertyValue('--pink-500'), - borderColor: documentStyle.getPropertyValue('--pink-500'), + backgroundColor: documentStyle.getPropertyValue('--gray-500'), + borderColor: documentStyle.getPropertyValue('--gray-500'), data: [28, 48, 40, 19, 86, 27, 90] } ] @@ -133,14 +133,14 @@ const setChartData = () => { datasets: [ { label: 'My First dataset', - backgroundColor: documentStyle.getPropertyValue('--blue-500'), - borderColor: documentStyle.getPropertyValue('--blue-500'), + backgroundColor: documentStyle.getPropertyValue('--cyan-500'), + borderColor: documentStyle.getPropertyValue('--cyan-500'), data: [65, 59, 80, 81, 56, 55, 40] }, { label: 'My Second dataset', - backgroundColor: documentStyle.getPropertyValue('--pink-500'), - borderColor: documentStyle.getPropertyValue('--pink-500'), + backgroundColor: documentStyle.getPropertyValue('--gray-500'), + borderColor: documentStyle.getPropertyValue('--gray-500'), data: [28, 48, 40, 19, 86, 27, 90] } ] @@ -212,14 +212,14 @@ const setChartOptions = () => { datasets: [ { label: 'My First dataset', - backgroundColor: documentStyle.getPropertyValue('--blue-500'), - borderColor: documentStyle.getPropertyValue('--blue-500'), + backgroundColor: documentStyle.getPropertyValue('--cyan-500'), + borderColor: documentStyle.getPropertyValue('--cyan-500'), data: [65, 59, 80, 81, 56, 55, 40] }, { label: 'My Second dataset', - backgroundColor: documentStyle.getPropertyValue('--pink-500'), - borderColor: documentStyle.getPropertyValue('--pink-500'), + backgroundColor: documentStyle.getPropertyValue('--gray-500'), + borderColor: documentStyle.getPropertyValue('--gray-500'), data: [28, 48, 40, 19, 86, 27, 90] } ] diff --git a/doc/chart/LineDoc.vue b/doc/chart/LineDoc.vue index c360f2ad4..c12ef8e6f 100644 --- a/doc/chart/LineDoc.vue +++ b/doc/chart/LineDoc.vue @@ -50,14 +50,14 @@ export default { label: 'First Dataset', data: [65, 59, 80, 81, 56, 55, 40], fill: false, - borderColor: documentStyle.getPropertyValue('--blue-500'), + borderColor: documentStyle.getPropertyValue('--cyan-500'), tension: 0.4 }, { label: 'Second Dataset', data: [28, 48, 40, 19, 86, 27, 90], fill: false, - borderColor: documentStyle.getPropertyValue('--pink-500'), + borderColor: documentStyle.getPropertyValue('--gray-500'), tension: 0.4 } ] @@ -131,14 +131,14 @@ const setChartData = () => { label: 'First Dataset', data: [65, 59, 80, 81, 56, 55, 40], fill: false, - borderColor: documentStyle.getPropertyValue('--blue-500'), + borderColor: documentStyle.getPropertyValue('--cyan-500'), tension: 0.4 }, { label: 'Second Dataset', data: [28, 48, 40, 19, 86, 27, 90], fill: false, - borderColor: documentStyle.getPropertyValue('--pink-500'), + borderColor: documentStyle.getPropertyValue('--gray-500'), tension: 0.4 } ] @@ -206,14 +206,14 @@ const setChartOptions = () => { label: 'First Dataset', data: [65, 59, 80, 81, 56, 55, 40], fill: false, - borderColor: documentStyle.getPropertyValue('--blue-500'), + borderColor: documentStyle.getPropertyValue('--cyan-500'), tension: 0.4 }, { label: 'Second Dataset', data: [28, 48, 40, 19, 86, 27, 90], fill: false, - borderColor: documentStyle.getPropertyValue('--pink-500'), + borderColor: documentStyle.getPropertyValue('--gray-500'), tension: 0.4 } ] diff --git a/doc/chart/LineStylesDoc.vue b/doc/chart/LineStylesDoc.vue index 9d6888ce1..444f17bc4 100644 --- a/doc/chart/LineStylesDoc.vue +++ b/doc/chart/LineStylesDoc.vue @@ -51,7 +51,7 @@ export default { data: [65, 59, 80, 81, 56, 55, 40], fill: false, tension: 0.4, - borderColor: documentStyle.getPropertyValue('--blue-500') + borderColor: documentStyle.getPropertyValue('--cyan-500') }, { label: 'Second Dataset', @@ -59,15 +59,15 @@ export default { fill: false, borderDash: [5, 5], tension: 0.4, - borderColor: documentStyle.getPropertyValue('--teal-500') + borderColor: documentStyle.getPropertyValue('--orange-500') }, { label: 'Third Dataset', data: [12, 51, 62, 33, 21, 62, 45], fill: true, - borderColor: documentStyle.getPropertyValue('--orange-500'), + borderColor: documentStyle.getPropertyValue('--gray-500'), tension: 0.4, - backgroundColor: 'rgba(255,167,38,0.2)' + backgroundColor: 'rgba(107, 114, 128, 0.2)' } ] }; @@ -141,7 +141,7 @@ const setChartData = () => { data: [65, 59, 80, 81, 56, 55, 40], fill: false, tension: 0.4, - borderColor: documentStyle.getPropertyValue('--blue-500') + borderColor: documentStyle.getPropertyValue('--cyan-500') }, { label: 'Second Dataset', @@ -149,15 +149,15 @@ const setChartData = () => { fill: false, borderDash: [5, 5], tension: 0.4, - borderColor: documentStyle.getPropertyValue('--teal-500') + borderColor: documentStyle.getPropertyValue('--orange-500') }, { label: 'Third Dataset', data: [12, 51, 62, 33, 21, 62, 45], fill: true, - borderColor: documentStyle.getPropertyValue('--orange-500'), + borderColor: documentStyle.getPropertyValue('--gray-500'), tension: 0.4, - backgroundColor: 'rgba(255,167,38,0.2)' + backgroundColor: 'rgba(107, 114, 128, 0.2)' } ] }; @@ -225,7 +225,7 @@ const setChartOptions = () => { data: [65, 59, 80, 81, 56, 55, 40], fill: false, tension: 0.4, - borderColor: documentStyle.getPropertyValue('--blue-500') + borderColor: documentStyle.getPropertyValue('--cyan-500') }, { label: 'Second Dataset', @@ -233,15 +233,15 @@ const setChartOptions = () => { fill: false, borderDash: [5, 5], tension: 0.4, - borderColor: documentStyle.getPropertyValue('--teal-500') + borderColor: documentStyle.getPropertyValue('--orange-500') }, { label: 'Third Dataset', data: [12, 51, 62, 33, 21, 62, 45], fill: true, - borderColor: documentStyle.getPropertyValue('--orange-500'), + borderColor: documentStyle.getPropertyValue('--gray-500'), tension: 0.4, - backgroundColor: 'rgba(255,167,38,0.2)' + backgroundColor: 'rgba(107, 114, 128, 0.2)' } ] }; diff --git a/doc/chart/MultiAxisDoc.vue b/doc/chart/MultiAxisDoc.vue index 71308d1e2..39e886af0 100644 --- a/doc/chart/MultiAxisDoc.vue +++ b/doc/chart/MultiAxisDoc.vue @@ -49,7 +49,7 @@ export default { { label: 'Dataset 1', fill: false, - borderColor: documentStyle.getPropertyValue('--blue-500'), + borderColor: documentStyle.getPropertyValue('--cyan-500'), yAxisID: 'y', tension: 0.4, data: [65, 59, 80, 81, 56, 55, 10] @@ -57,7 +57,7 @@ export default { { label: 'Dataset 2', fill: false, - borderColor: documentStyle.getPropertyValue('--green-500'), + borderColor: documentStyle.getPropertyValue('--gray-500'), yAxisID: 'y1', tension: 0.4, data: [28, 48, 40, 19, 86, 27, 90] @@ -148,7 +148,7 @@ const setChartData = () => { { label: 'Dataset 1', fill: false, - borderColor: documentStyle.getPropertyValue('--blue-500'), + borderColor: documentStyle.getPropertyValue('--cyan-500'), yAxisID: 'y', tension: 0.4, data: [65, 59, 80, 81, 56, 55, 10] @@ -156,7 +156,7 @@ const setChartData = () => { { label: 'Dataset 2', fill: false, - borderColor: documentStyle.getPropertyValue('--green-500'), + borderColor: documentStyle.getPropertyValue('--gray-500'), yAxisID: 'y1', tension: 0.4, data: [28, 48, 40, 19, 86, 27, 90] @@ -241,7 +241,7 @@ const setChartOptions = () => { { label: 'Dataset 1', fill: false, - borderColor: documentStyle.getPropertyValue('--blue-500'), + borderColor: documentStyle.getPropertyValue('--cyan-500'), yAxisID: 'y', tension: 0.4, data: [65, 59, 80, 81, 56, 55, 10] @@ -249,7 +249,7 @@ const setChartOptions = () => { { label: 'Dataset 2', fill: false, - borderColor: documentStyle.getPropertyValue('--green-500'), + borderColor: documentStyle.getPropertyValue('--gray-500'), yAxisID: 'y1', tension: 0.4, data: [28, 48, 40, 19, 86, 27, 90] diff --git a/doc/chart/PieChartDoc.vue b/doc/chart/PieChartDoc.vue index 4bb9d557a..c3737651f 100644 --- a/doc/chart/PieChartDoc.vue +++ b/doc/chart/PieChartDoc.vue @@ -48,8 +48,8 @@ export default { datasets: [ { data: [540, 325, 702], - backgroundColor: [documentStyle.getPropertyValue('--blue-500'), documentStyle.getPropertyValue('--yellow-500'), documentStyle.getPropertyValue('--green-500')], - hoverBackgroundColor: [documentStyle.getPropertyValue('--blue-400'), documentStyle.getPropertyValue('--yellow-400'), documentStyle.getPropertyValue('--green-400')] + backgroundColor: [documentStyle.getPropertyValue('--cyan-500'), documentStyle.getPropertyValue('--orange-500'), documentStyle.getPropertyValue('--gray-500')], + hoverBackgroundColor: [documentStyle.getPropertyValue('--cyan-400'), documentStyle.getPropertyValue('--orange-400'), documentStyle.getPropertyValue('--gray-400')] } ] }; @@ -99,8 +99,8 @@ const setChartData = () => { datasets: [ { data: [540, 325, 702], - backgroundColor: [documentStyle.getPropertyValue('--blue-500'), documentStyle.getPropertyValue('--yellow-500'), documentStyle.getPropertyValue('--green-500')], - hoverBackgroundColor: [documentStyle.getPropertyValue('--blue-400'), documentStyle.getPropertyValue('--yellow-400'), documentStyle.getPropertyValue('--green-400')] + backgroundColor: [documentStyle.getPropertyValue('--cyan-500'), documentStyle.getPropertyValue('--orange-500'), documentStyle.getPropertyValue('--gray-500')], + hoverBackgroundColor: [documentStyle.getPropertyValue('--cyan-400'), documentStyle.getPropertyValue('--orange-400'), documentStyle.getPropertyValue('--gray-400')] } ] }; @@ -145,8 +145,8 @@ const setChartOptions = () => { datasets: [ { data: [540, 325, 702], - backgroundColor: [documentStyle.getPropertyValue('--blue-500'), documentStyle.getPropertyValue('--yellow-500'), documentStyle.getPropertyValue('--green-500')], - hoverBackgroundColor: [documentStyle.getPropertyValue('--blue-400'), documentStyle.getPropertyValue('--yellow-400'), documentStyle.getPropertyValue('--green-400')] + backgroundColor: [documentStyle.getPropertyValue('--cyan-500'), documentStyle.getPropertyValue('--orange-500'), documentStyle.getPropertyValue('--gray-500')], + hoverBackgroundColor: [documentStyle.getPropertyValue('--cyan-400'), documentStyle.getPropertyValue('--orange-400'), documentStyle.getPropertyValue('--gray-400')] } ] }; diff --git a/doc/chart/PolarAreaDoc.vue b/doc/chart/PolarAreaDoc.vue index d5f87083c..aec8cb97a 100644 --- a/doc/chart/PolarAreaDoc.vue +++ b/doc/chart/PolarAreaDoc.vue @@ -48,16 +48,16 @@ export default { { data: [11, 16, 7, 3, 14], backgroundColor: [ - documentStyle.getPropertyValue('--red-500'), - documentStyle.getPropertyValue('--green-500'), - documentStyle.getPropertyValue('--yellow-500'), - documentStyle.getPropertyValue('--bluegray-500'), - documentStyle.getPropertyValue('--blue-500') + documentStyle.getPropertyValue('--pink-500'), + documentStyle.getPropertyValue('--gray-500'), + documentStyle.getPropertyValue('--orange-500'), + documentStyle.getPropertyValue('--purple-500'), + documentStyle.getPropertyValue('--cyan-500') ], label: 'My dataset' } ], - labels: ['Red', 'Green', 'Yellow', 'Grey', 'Blue'] + labels: ['Pink', 'Gray', 'Orange', 'Purple', 'Cyan'] }; }, setChartOptions() { @@ -112,16 +112,16 @@ const setChartData = () => { { data: [11, 16, 7, 3, 14], backgroundColor: [ - documentStyle.getPropertyValue('--red-500'), - documentStyle.getPropertyValue('--green-500'), - documentStyle.getPropertyValue('--yellow-500'), - documentStyle.getPropertyValue('--bluegray-500'), - documentStyle.getPropertyValue('--blue-500') + documentStyle.getPropertyValue('--pink-500'), + documentStyle.getPropertyValue('--gray-500'), + documentStyle.getPropertyValue('--orange-500'), + documentStyle.getPropertyValue('--purple-500'), + documentStyle.getPropertyValue('--cyan-500') ], label: 'My dataset' } ], - labels: ['Red', 'Green', 'Yellow', 'Grey', 'Blue'] + labels: ['Pink', 'Gray', 'Orange', 'Purple', 'Cyan'] }; }; const setChartOptions = () => { @@ -170,16 +170,16 @@ const setChartOptions = () => { { data: [11, 16, 7, 3, 14], backgroundColor: [ - documentStyle.getPropertyValue('--red-500'), - documentStyle.getPropertyValue('--green-500'), - documentStyle.getPropertyValue('--yellow-500'), - documentStyle.getPropertyValue('--bluegray-500'), - documentStyle.getPropertyValue('--blue-500') + documentStyle.getPropertyValue('--pink-500'), + documentStyle.getPropertyValue('--gray-500'), + documentStyle.getPropertyValue('--orange-500'), + documentStyle.getPropertyValue('--purple-500'), + documentStyle.getPropertyValue('--cyan-500') ], label: 'My dataset' } ], - labels: ['Red', 'Green', 'Yellow', 'Grey', 'Blue'] + labels: ['Pink', 'Gray', 'Orange', 'Purple', 'Cyan'] }; }, setChartOptions() { diff --git a/doc/chart/RadarDoc.vue b/doc/chart/RadarDoc.vue index b3ca6ff15..445568933 100644 --- a/doc/chart/RadarDoc.vue +++ b/doc/chart/RadarDoc.vue @@ -49,20 +49,20 @@ export default { datasets: [ { label: 'My First dataset', - borderColor: documentStyle.getPropertyValue('--bluegray-400'), - pointBackgroundColor: documentStyle.getPropertyValue('--bluegray-400'), - pointBorderColor: documentStyle.getPropertyValue('--bluegray-400'), + borderColor: documentStyle.getPropertyValue('--gray-400'), + pointBackgroundColor: documentStyle.getPropertyValue('--gray-400'), + pointBorderColor: documentStyle.getPropertyValue('--gray-400'), pointHoverBackgroundColor: textColor, - pointHoverBorderColor: documentStyle.getPropertyValue('--bluegray-400'), + pointHoverBorderColor: documentStyle.getPropertyValue('--gray-400'), data: [65, 59, 90, 81, 56, 55, 40] }, { label: 'My Second dataset', - borderColor: documentStyle.getPropertyValue('--pink-400'), - pointBackgroundColor: documentStyle.getPropertyValue('--pink-400'), - pointBorderColor: documentStyle.getPropertyValue('--pink-400'), + borderColor: documentStyle.getPropertyValue('--cyan-400'), + pointBackgroundColor: documentStyle.getPropertyValue('--cyan-400'), + pointBorderColor: documentStyle.getPropertyValue('--cyan-400'), pointHoverBackgroundColor: textColor, - pointHoverBorderColor: documentStyle.getPropertyValue('--pink-400'), + pointHoverBorderColor: documentStyle.getPropertyValue('--cyan-400'), data: [28, 48, 40, 19, 96, 27, 100] } ] @@ -187,20 +187,20 @@ const setChartOptions = () => { datasets: [ { label: 'My First dataset', - borderColor: documentStyle.getPropertyValue('--bluegray-400'), - pointBackgroundColor: documentStyle.getPropertyValue('--bluegray-400'), - pointBorderColor: documentStyle.getPropertyValue('--bluegray-400'), + borderColor: documentStyle.getPropertyValue('--gray-400'), + pointBackgroundColor: documentStyle.getPropertyValue('--gray-400'), + pointBorderColor: documentStyle.getPropertyValue('--gray-400'), pointHoverBackgroundColor: textColor, - pointHoverBorderColor: documentStyle.getPropertyValue('--bluegray-400'), + pointHoverBorderColor: documentStyle.getPropertyValue('--gray-400'), data: [65, 59, 90, 81, 56, 55, 40] }, { label: 'My Second dataset', - borderColor: documentStyle.getPropertyValue('--pink-400'), - pointBackgroundColor: documentStyle.getPropertyValue('--pink-400'), - pointBorderColor: documentStyle.getPropertyValue('--pink-400'), + borderColor: documentStyle.getPropertyValue('--cyan-400'), + pointBackgroundColor: documentStyle.getPropertyValue('--cyan-400'), + pointBorderColor: documentStyle.getPropertyValue('--cyan-400'), pointHoverBackgroundColor: textColor, - pointHoverBorderColor: documentStyle.getPropertyValue('--pink-400'), + pointHoverBorderColor: documentStyle.getPropertyValue('--cyan-400'), data: [28, 48, 40, 19, 96, 27, 100] } ] diff --git a/doc/chart/StackedBarDoc.vue b/doc/chart/StackedBarDoc.vue index 7079d4004..1a1a398de 100644 --- a/doc/chart/StackedBarDoc.vue +++ b/doc/chart/StackedBarDoc.vue @@ -49,19 +49,19 @@ export default { { type: 'bar', label: 'Dataset 1', - backgroundColor: documentStyle.getPropertyValue('--blue-500'), + backgroundColor: documentStyle.getPropertyValue('--cyan-500'), data: [50, 25, 12, 48, 90, 76, 42] }, { type: 'bar', label: 'Dataset 2', - backgroundColor: documentStyle.getPropertyValue('--green-500'), + backgroundColor: documentStyle.getPropertyValue('--gray-500'), data: [21, 84, 24, 75, 37, 65, 34] }, { type: 'bar', label: 'Dataset 3', - backgroundColor: documentStyle.getPropertyValue('--yellow-500'), + backgroundColor: documentStyle.getPropertyValue('--orange-500'), data: [41, 52, 24, 74, 23, 21, 32] } ] @@ -140,19 +140,19 @@ const setChartData = () => { { type: 'bar', label: 'Dataset 1', - backgroundColor: documentStyle.getPropertyValue('--blue-500'), + backgroundColor: documentStyle.getPropertyValue('--cyan-500'), data: [50, 25, 12, 48, 90, 76, 42] }, { type: 'bar', label: 'Dataset 2', - backgroundColor: documentStyle.getPropertyValue('--green-500'), + backgroundColor: documentStyle.getPropertyValue('--gray-500'), data: [21, 84, 24, 75, 37, 65, 34] }, { type: 'bar', label: 'Dataset 3', - backgroundColor: documentStyle.getPropertyValue('--yellow-500'), + backgroundColor: documentStyle.getPropertyValue('--orange-500'), data: [41, 52, 24, 74, 23, 21, 32] } ] @@ -225,19 +225,19 @@ const setChartOptions = () => { { type: 'bar', label: 'Dataset 1', - backgroundColor: documentStyle.getPropertyValue('--blue-500'), + backgroundColor: documentStyle.getPropertyValue('--cyan-500'), data: [50, 25, 12, 48, 90, 76, 42] }, { type: 'bar', label: 'Dataset 2', - backgroundColor: documentStyle.getPropertyValue('--green-500'), + backgroundColor: documentStyle.getPropertyValue('--gray-500'), data: [21, 84, 24, 75, 37, 65, 34] }, { type: 'bar', label: 'Dataset 3', - backgroundColor: documentStyle.getPropertyValue('--yellow-500'), + backgroundColor: documentStyle.getPropertyValue('--orange-500'), data: [41, 52, 24, 74, 23, 21, 32] } ] diff --git a/doc/chart/VerticalBarDoc.vue b/doc/chart/VerticalBarDoc.vue index 3c53b8a86..0e7fb5f62 100644 --- a/doc/chart/VerticalBarDoc.vue +++ b/doc/chart/VerticalBarDoc.vue @@ -48,14 +48,14 @@ export default { datasets: [ { label: 'My First dataset', - backgroundColor: documentStyle.getPropertyValue('--blue-500'), - borderColor: documentStyle.getPropertyValue('--blue-500'), + backgroundColor: documentStyle.getPropertyValue('--cyan-500'), + borderColor: documentStyle.getPropertyValue('--cyan-500'), data: [65, 59, 80, 81, 56, 55, 40] }, { label: 'My Second dataset', - backgroundColor: documentStyle.getPropertyValue('--pink-500'), - borderColor: documentStyle.getPropertyValue('--pink-500'), + backgroundColor: documentStyle.getPropertyValue('--gray-500'), + borderColor: documentStyle.getPropertyValue('--gray-500'), data: [28, 48, 40, 19, 86, 27, 90] } ] @@ -132,14 +132,14 @@ const setChartData = () => { datasets: [ { label: 'My First dataset', - backgroundColor: documentStyle.getPropertyValue('--blue-500'), - borderColor: documentStyle.getPropertyValue('--blue-500'), + backgroundColor: documentStyle.getPropertyValue('--cyan-500'), + borderColor: documentStyle.getPropertyValue('--cyan-500'), data: [65, 59, 80, 81, 56, 55, 40] }, { label: 'My Second dataset', - backgroundColor: documentStyle.getPropertyValue('--pink-500'), - borderColor: documentStyle.getPropertyValue('--pink-500'), + backgroundColor: documentStyle.getPropertyValue('--gray-500'), + borderColor: documentStyle.getPropertyValue('--gray-500'), data: [28, 48, 40, 19, 86, 27, 90] } ] @@ -210,14 +210,14 @@ const setChartOptions = () => { datasets: [ { label: 'My First dataset', - backgroundColor: documentStyle.getPropertyValue('--blue-500'), - borderColor: documentStyle.getPropertyValue('--blue-500'), + backgroundColor: documentStyle.getPropertyValue('--cyan-500'), + borderColor: documentStyle.getPropertyValue('--cyan-500'), data: [65, 59, 80, 81, 56, 55, 40] }, { label: 'My Second dataset', - backgroundColor: documentStyle.getPropertyValue('--pink-500'), - borderColor: documentStyle.getPropertyValue('--pink-500'), + backgroundColor: documentStyle.getPropertyValue('--gray-500'), + borderColor: documentStyle.getPropertyValue('--gray-500'), data: [28, 48, 40, 19, 86, 27, 90] } ] diff --git a/doc/chart/pt/PTDoc.vue b/doc/chart/pt/PTDoc.vue index ab3b9681e..95b89fd73 100644 --- a/doc/chart/pt/PTDoc.vue +++ b/doc/chart/pt/PTDoc.vue @@ -82,8 +82,8 @@ export default { datasets: [ { data: [540, 325, 702], - backgroundColor: [documentStyle.getPropertyValue('--blue-500'), documentStyle.getPropertyValue('--yellow-500'), documentStyle.getPropertyValue('--green-500')], - hoverBackgroundColor: [documentStyle.getPropertyValue('--blue-400'), documentStyle.getPropertyValue('--yellow-400'), documentStyle.getPropertyValue('--green-400')] + backgroundColor: [documentStyle.getPropertyValue('--cyan-500'), documentStyle.getPropertyValue('--orange-500'), documentStyle.getPropertyValue('--gray-500')], + hoverBackgroundColor: [documentStyle.getPropertyValue('--cyan-400'), documentStyle.getPropertyValue('--orange-400'), documentStyle.getPropertyValue('--gray-400')] } ] }; @@ -132,8 +132,8 @@ const setChartData = () => { datasets: [ { data: [540, 325, 702], - backgroundColor: [documentStyle.getPropertyValue('--blue-500'), documentStyle.getPropertyValue('--yellow-500'), documentStyle.getPropertyValue('--green-500')], - hoverBackgroundColor: [documentStyle.getPropertyValue('--blue-400'), documentStyle.getPropertyValue('--yellow-400'), documentStyle.getPropertyValue('--green-400')] + backgroundColor: [documentStyle.getPropertyValue('--cyan-500'), documentStyle.getPropertyValue('--orange-500'), documentStyle.getPropertyValue('--gray-500')], + hoverBackgroundColor: [documentStyle.getPropertyValue('--cyan-400'), documentStyle.getPropertyValue('--orange-400'), documentStyle.getPropertyValue('--gray-400')] } ] }; @@ -155,8 +155,8 @@ const setChartData = () => { datasets: [ { data: [540, 325, 702], - backgroundColor: [documentStyle.getPropertyValue('--blue-500'), documentStyle.getPropertyValue('--yellow-500'), documentStyle.getPropertyValue('--green-500')], - hoverBackgroundColor: [documentStyle.getPropertyValue('--blue-400'), documentStyle.getPropertyValue('--yellow-400'), documentStyle.getPropertyValue('--green-400')] + backgroundColor: [documentStyle.getPropertyValue('--cyan-500'), documentStyle.getPropertyValue('--orange-500'), documentStyle.getPropertyValue('--gray-500')], + hoverBackgroundColor: [documentStyle.getPropertyValue('--cyan-400'), documentStyle.getPropertyValue('--orange-400'), documentStyle.getPropertyValue('--gray-400')] } ] };