diff --git a/packages/@ourworldindata/grapher/src/core/Grapher.tsx b/packages/@ourworldindata/grapher/src/core/Grapher.tsx index 94407af5a9..f78ed69925 100644 --- a/packages/@ourworldindata/grapher/src/core/Grapher.tsx +++ b/packages/@ourworldindata/grapher/src/core/Grapher.tsx @@ -3124,7 +3124,7 @@ export class Grapher if (this.isStaticAndSmall) { return this.computeBaseFontSizeFromHeight(this.staticBounds) } - if (this.isStatic) return 18 + if (this.isStatic) return 16 return this._baseFontSize } diff --git a/packages/@ourworldindata/grapher/src/footer/Footer.tsx b/packages/@ourworldindata/grapher/src/footer/Footer.tsx index 6d4ac0aa4e..505ffee578 100644 --- a/packages/@ourworldindata/grapher/src/footer/Footer.tsx +++ b/packages/@ourworldindata/grapher/src/footer/Footer.tsx @@ -685,36 +685,10 @@ export class StaticFooter extends Footer { } @computed protected get fontSize(): number { - if (this.useBaseFontSize) { - let fontSize = (12 / BASE_FONT_SIZE) * this.baseFontSize - - // for small charts, reduce the font size if the footer text is long - if (this.manager.isStaticAndSmall) { - const sources = new MarkdownTextWrap({ - text: this.sourcesText, - maxWidth: this.sourcesMaxWidth, - lineHeight: this.lineHeight, - fontSize, - }) - const note = new MarkdownTextWrap({ - text: this.markdownNoteText, - maxWidth: this.noteMaxWidth, - lineHeight: this.lineHeight, - fontSize, - }) - - const lineCount = - sources.svgLines.length + - (this.showNote ? note.svgLines.length : 0) - if (lineCount > 2) { - fontSize = (10 / BASE_FONT_SIZE) * this.baseFontSize - } - } - - return fontSize - } - - return 13 + if (this.manager.isStaticAndSmall) return 14 + return this.useBaseFontSize + ? (13 / BASE_FONT_SIZE) * this.baseFontSize + : 13 } @computed protected get sourcesFontSize(): number { diff --git a/packages/@ourworldindata/grapher/src/header/Header.tsx b/packages/@ourworldindata/grapher/src/header/Header.tsx index 50ef335d50..910c63e951 100644 --- a/packages/@ourworldindata/grapher/src/header/Header.tsx +++ b/packages/@ourworldindata/grapher/src/header/Header.tsx @@ -107,13 +107,15 @@ export class Header< fontSize, }) - const initialFontSize = this.useBaseFontSize - ? (22 / BASE_FONT_SIZE) * this.baseFontSize - : this.manager.isNarrow - ? 18 - : this.manager.isMedium - ? 20 - : 24 + const initialFontSize = this.manager.isStaticAndSmall + ? 25 + : this.useBaseFontSize + ? (25 / BASE_FONT_SIZE) * this.baseFontSize + : this.manager.isNarrow + ? 18 + : this.manager.isMedium + ? 20 + : 24 let title = makeTitle(initialFontSize) @@ -174,8 +176,9 @@ export class Header< } @computed get subtitleFontSize(): number { + if (this.manager.isStaticAndSmall) return 16 if (this.useBaseFontSize) { - return (13 / BASE_FONT_SIZE) * this.baseFontSize + return (15 / BASE_FONT_SIZE) * this.baseFontSize } return this.manager.isSmall ? 12 : this.manager.isMedium ? 13 : 14 }