✨ (grapher) updating padding between text elements

For better consistency with static charts created in Figma
owid · Jan 9, 2025 · a017567 · a017567
1 parent b9167bd
commit a017567
Show file tree

Hide file tree

Showing 2 changed files with 5 additions and 3 deletions.
diff --git a/packages/@ourworldindata/grapher/src/footer/Footer.tsx b/packages/@ourworldindata/grapher/src/footer/Footer.tsx
@@ -633,8 +633,6 @@ interface StaticFooterProps extends FooterProps {
 
 @observer
 export class StaticFooter extends Footer<StaticFooterProps> {
-    verticalPadding = 2
-
     // eslint-disable-next-line @typescript-eslint/no-empty-function
     componentDidMount(): void {}
     // eslint-disable-next-line @typescript-eslint/no-empty-function

diff --git a/packages/@ourworldindata/grapher/src/header/Header.tsx b/packages/@ourworldindata/grapher/src/header/Header.tsx
@@ -32,6 +32,8 @@ interface HeaderProps {
 export class Header<
     Props extends HeaderProps = HeaderProps,
 > extends React.Component<Props> {
+    protected verticalPadding = 4
+
     @computed protected get manager(): HeaderManager {
         return this.props.manager
     }
@@ -156,7 +158,7 @@ export class Header<
     }
 
     @computed get subtitleMarginTop(): number {
-        let padding = 4
+        let padding = this.verticalPadding
 
         // make sure the subtitle doesn't overlap with the logo
         if (
@@ -292,6 +294,8 @@ interface StaticHeaderProps extends HeaderProps {
 
 @observer
 export class StaticHeader extends Header<StaticHeaderProps> {
+    protected verticalPadding = 6
+
     @computed get titleLineHeight(): number {
         return this.manager.isStaticAndSmall ? 1.1 : 1.2
     }