Polish headings

This tunes the margins a bit. It also resizes headings 1-6 a bit, so they are differentiated and all different. This fixes #625
WordPress · May 4, 2017 · cf17980 · cf17980
1 parent 88fc11f
commit cf17980
Show file tree

Hide file tree

Showing 2 changed files with 35 additions and 0 deletions.
diff --git a/blocks/library/heading/index.js b/blocks/library/heading/index.js
@@ -1,6 +1,7 @@
 /**
  * Internal dependencies
  */
+import './style.scss';
 import { registerBlock, query } from 'api';
 import Editable from 'components/editable';
 

diff --git a/blocks/library/heading/style.scss b/blocks/library/heading/style.scss
@@ -0,0 +1,34 @@
+.editor-visual-editor__block {
+    h1,
+    h2,
+    h3,
+    h4,
+    h5,
+    h6 {
+        margin: .5em 0 0 0;   // this is a little artificially deflated by block padding
+    }
+
+    h1 {
+        font-size: 2em;
+    }
+
+    h2 {
+        font-size: 1.6em;
+    }
+
+    h3 {
+        font-size: 1.4em;
+    }
+
+    h4 {
+        font-size: 1.2em;
+    }
+
+    h5 {
+        font-size: 1.1em;
+    }
+
+    h6 {
+        font-size: 1em;
+    }
+}