diff --git a/webapp/src/components/DataPage.tsx b/webapp/src/components/DataPage.tsx index 04619c32c52baabc58032d37e5739e29b945d2bc..166c671070151001990421c78fd2c0dca7f211d8 100644 --- a/webapp/src/components/DataPage.tsx +++ b/webapp/src/components/DataPage.tsx @@ -9,9 +9,9 @@ import SectionNavigation from "./SectionNavigation"; import { Sections } from "../helpers/constants"; import PolicySidebar from "./PolicySidebar"; -import { Chart as ChartJS} from 'chart.js'; +import { Chart as ChartJS } from 'chart.js'; -ChartJS.defaults.font.size = 18; +ChartJS.defaults.font.size = 16; ChartJS.defaults.font.family = 'Open Sans'; ChartJS.defaults.font.weight = '700'; @@ -23,7 +23,7 @@ interface inputProps { category: Sections } -function DataPage({ title,description, filter, children, category }: inputProps): ReactElement { +function DataPage({ title, description, filter, children, category }: inputProps): ReactElement { return ( <> {category === Sections.Organisation && <OrganizationSidebar />} diff --git a/webapp/src/plugins/HTMLLegendPlugin.ts b/webapp/src/plugins/HTMLLegendPlugin.ts index 909ca5d5e600e9a5bc572d2ea0bbce90cb677ecf..04ea7f75b33ae55e9dd047fd984a957a153d6a05 100644 --- a/webapp/src/plugins/HTMLLegendPlugin.ts +++ b/webapp/src/plugins/HTMLLegendPlugin.ts @@ -1,3 +1,5 @@ +import { Chart as ChartJS} from 'chart.js'; + const getOrCreateLegendList = (chart, id) => { const legendContainer = document.getElementById(id); if (!legendContainer) { @@ -72,6 +74,9 @@ const htmlLegendPlugin = { textContainer.style.margin = '0'; textContainer.style.padding = '0'; textContainer.style.textDecoration = item.hidden ? 'line-through' : ''; + textContainer.style.fontSize = `${ChartJS.defaults.font.size}px`; + textContainer.style.fontFamily = `${ChartJS.defaults.font.family}`; + textContainer.style.fontWeight = `${ChartJS.defaults.font.weight}`; const text = document.createTextNode(item.text); textContainer.appendChild(text);