From d01c883ce463ce3b10f40f9eb6dc1c6b204f0ed2 Mon Sep 17 00:00:00 2001
From: David Moulton <d.moulton@elifesciences.org>
Date: Fri, 24 Apr 2020 15:01:02 +0100
Subject: [PATCH] feat(Elife): Responsive title typography

---
 src/themes/elife/custom-properties.css |  2 ++
 src/themes/elife/styles.css            | 12 ++++++++++++
 2 files changed, 14 insertions(+)

diff --git a/src/themes/elife/custom-properties.css b/src/themes/elife/custom-properties.css
index 83f8947ac..de1dbb451 100644
--- a/src/themes/elife/custom-properties.css
+++ b/src/themes/elife/custom-properties.css
@@ -4,6 +4,8 @@
 
   /* Typography */
   --text-size-rem-small: 0.6875;
+  --text-size-h1--narrow-rem: 1.8125rem; /* 29px */
+  --text-size-h1--normal-rem: 2.25rem; /* 36px */
   --letter-spacing: 0.5px;
 
   /* Spacing */
diff --git a/src/themes/elife/styles.css b/src/themes/elife/styles.css
index ae32661bc..f8c558b62 100644
--- a/src/themes/elife/styles.css
+++ b/src/themes/elife/styles.css
@@ -68,6 +68,18 @@ main {
   & > :--datePublished {
     text-align: center;
   }
+
+  & > :--title {
+    font-size: var(--text-size-h1--narrow-rem);
+    line-height: calc(36 / 29);
+  }
+}
+
+@media all and (--medium-viewport) {
+  :--Article:not(:--reference) > :--title {
+    font-size: var(--text-size-h1--normal-rem);
+    line-height: calc(48 / 36);
+  }
 }
 
 /* Visually hide affiliations at narrower viewports, maintaining vertical whitespace */