IntenseWebs/grafana
3
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2025-02-25 18:55:37 -06:00
Code Issues Packages Projects Releases Wiki Activity

GraphNG: use theme font family and size for axis labels (#33009)

Browse Source 
* GraphNG: use theme font family and size for axis labels

* fix test
This commit is contained in:
Leon Sorokin 2021-04-15 05:27:28 -05:00 committed by GitHub
parent 99b85d8af3
commit aeb64ecb16
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 12 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
packages/grafana-ui/src/components/uPlot/config/UPlotAxisBuilder.ts
View File

@ -50,6 +50,10 @@ export class UPlotAxisBuilder extends PlotConfigBuilder<AxisProps, Axis> {
theme,
} = this.props;
let { typography } = theme;
let font = `${typography.size.sm} ${typography.fontFamily.sansSerif}`;
const gridColor = theme.isDark ? theme.palette.gray25 : theme.palette.gray90;
let config: Axis = {
@ -57,8 +61,8 @@ export class UPlotAxisBuilder extends PlotConfigBuilder<AxisProps, Axis> {
show,
stroke: theme.colors.text,
side: getUPlotSideFromAxis(placement),
font: `12px 'Roboto'`,
labelFont: `12px 'Roboto'`,
font,
labelFont: font,
size: this.props.size ?? calculateAxisSize,
gap,
grid: {

13
packages/grafana-ui/src/components/uPlot/config/UPlotConfigBuilder.test.ts
View File

@ -1,7 +1,6 @@
// TODO: migrate tests below to the builder
import { UPlotConfigBuilder } from './UPlotConfigBuilder';
import { GrafanaTheme } from '@grafana/data';
import {
GraphGradientMode,
AxisPlacement,
@ -292,7 +291,7 @@ describe('UPlotConfigBuilder', () => {
formatValue: () => 'test value',
grid: false,
show: true,
theme: { isDark: true, palette: { gray25: '#ffffff' }, colors: { text: 'gray' } } as GrafanaTheme,
theme: darkTheme,
values: [],
});
@ -300,15 +299,15 @@ describe('UPlotConfigBuilder', () => {
Object {
"axes": Array [
Object {
"font": "12px 'Roboto'",
"font": "12px 'Inter', 'Helvetica Neue', Arial, sans-serif",
"gap": 5,
"grid": Object {
"show": false,
"stroke": "#ffffff",
"stroke": "#2c3235",
"width": 1,
},
"label": "test label",
"labelFont": "12px 'Roboto'",
"labelFont": "12px 'Inter', 'Helvetica Neue', Arial, sans-serif",
"labelSize": 18,
"scale": "scale-x",
"show": true,
@ -316,10 +315,10 @@ describe('UPlotConfigBuilder', () => {
"size": [Function],
"space": [Function],
"splits": undefined,
"stroke": "gray",
"stroke": "rgba(255, 255, 255, 0.77)",
"ticks": Object {
"show": true,
"stroke": "#ffffff",
"stroke": "#2c3235",
"width": 1,
},
"timeZone": "browser",