Merge pull request #2575 from bbc/explicitly-set-h1-styles-display-an…

…d-font-weight Explicitly set h1 styles display and font weight
BBC-archive · Nov 7, 2019 · 7af488a · 7af488a
2 parents 73b6ac2 + 063a755
commit 7af488a
Show file tree

Hide file tree

Showing 5 changed files with 6 additions and 2 deletions.
diff --git a/packages/components/psammead-headings/CHANGELOG.md b/packages/components/psammead-headings/CHANGELOG.md
@@ -3,6 +3,7 @@
 <!-- prettier-ignore -->
 | Version | Description |
 |---------|-------------|
+| 3.1.19 | [PR#2575](https://github.com/bbc/psammead/pull/2575) Explicitly set `display` styles rather than rely on browser default for <h1> |
 | 3.1.18 | [PR#2519](https://github.com/bbc/psammead/pull/2519) Talos - Bump Dependencies - @bbc/psammead-styles |
 | 3.1.17 | [PR#2488](https://github.com/bbc/psammead/pull/2488) Talos - Bump Dependencies - @bbc/gel-foundations |
 | 3.1.16 | [PR#2477](https://github.com/bbc/psammead/pull/2477) Talos - Bump Dependencies - @bbc/psammead-styles |

diff --git a/packages/components/psammead-headings/package-lock.json b/packages/components/psammead-headings/package-lock.json
diff --git a/packages/components/psammead-headings/package.json b/packages/components/psammead-headings/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@bbc/psammead-headings",
-  "version": "3.1.18",
+  "version": "3.1.19",
   "main": "dist/index.js",
   "module": "esm/index.js",
   "sideEffects": false,

diff --git a/packages/components/psammead-headings/src/__snapshots__/index.test.jsx.snap b/packages/components/psammead-headings/src/__snapshots__/index.test.jsx.snap
@@ -8,6 +8,7 @@ exports[`Headline component should render correctly 1`] = `
   font-weight: 500;
   font-style: normal;
   color: #3F3F42;
+  display: block;
   margin: 0;
   padding: 2rem 0;
 }
@@ -47,6 +48,7 @@ exports[`Headline component should render correctly with arabic script typograph
   font-weight: 700;
   font-style: normal;
   color: #3F3F42;
+  display: block;
   margin: 0;
   padding: 2rem 0;
 }

diff --git a/packages/components/psammead-headings/src/index.jsx b/packages/components/psammead-headings/src/index.jsx
@@ -14,6 +14,7 @@ export const Headline = styled.h1`
   ${({ script }) => script && getCanon(script)};
   ${({ service }) => getSerifMedium(service)}
   color: ${C_SHADOW};
+  display: block; /* Explicitly set */
   margin: 0; /* Reset */
   padding: ${GEL_SPACING_QUAD} 0;
   ${MEDIA_QUERY_TYPOGRAPHY.LAPTOP_AND_LARGER} {