✨ left-align all gdocs topic page headers

owid · Sep 26, 2023 · d4ce583 · d4ce583
1 parent 0beb569
commit d4ce583
Show file tree

Hide file tree

Showing 3 changed files with 13 additions and 3 deletions.
diff --git a/site/gdocs/AllCharts.scss b/site/gdocs/AllCharts.scss
@@ -1,6 +1,6 @@
 .article-block__all-charts {
     h1.h1-semibold {
-        text-align: center;
+        margin-bottom: 40px;
     }
 
     figure[data-grapher-src] {

diff --git a/site/gdocs/centered-article.scss b/site/gdocs/centered-article.scss
@@ -502,7 +502,7 @@ h3.article-block__heading.has-supertitle {
 .article-block__explorer {
     // width is necessary for containerNode.getBoundingClientRect() in Grapher.renderGrapherIntoContainer
     width: 100%;
-    margin: 24px 0 48px 0;
+    margin: 16px 0 48px 0;
 
     figure {
         margin: 0;

diff --git a/site/gdocs/topic-page.scss b/site/gdocs/topic-page.scss
@@ -173,12 +173,22 @@
     }
 }
 
+// small amount of extra padding to match figma designs which is 40px total for key-insights heading
+.article-block__heading + .wp-block-owid-key-insights {
+    margin-top: 8px;
+}
+
 .article-block__gray-section {
     > h1 {
-        text-align: center;
         // Countering the gray-section padding to make this have 32px 16px
         margin-top: -16px;
         margin-bottom: 16px;
+
+        // Special exception for the "Explore data on Blah" heading (which is a gdoc .article-block__heading)
+        // so that it's left-aligned like the rest of the topic page component headings
+        &[id^="explore"] {
+            grid-column-start: 2;
+        }
     }
 
     .article-block__text,