mo betta type margins for headings

2 files changed, 22 insertions, 5 deletions

diff --git a/docs/assets/css/bootstrap.css b/docs/assets/css/bootstrap.css
index 63fb17523..d42563746 100644
--- a/docs/assets/css/bootstrap.css
+++ b/docs/assets/css/bootstrap.css
@@ -406,7 +406,6 @@ h3,
 h4,
 h5,
 h6 {
-  margin: 10px 0;
   font-family: inherit;
   font-weight: 500;
   line-height: 20px;
@@ -427,9 +426,18 @@ h6 small {
 h1,
 h2,
 h3 {
+  margin-top: 20px;
+  margin-bottom: 10px;
   line-height: 40px;
 }
 
+h4,
+h5,
+h6 {
+  margin-top: 10px;
+  margin-bottom: 10px;
+}
+
 h1 {
   font-size: 38.5px;
 }
@@ -472,7 +480,7 @@ h4 small {
 
 .page-header {
   padding-bottom: 9px;
-  margin: 20px 0 30px;
+  margin: 40px 0 20px;
   border-bottom: 1px solid #eeeeee;
 }
 
diff --git a/less/type.less b/less/type.less
index 39358e4e3..7404a6c78 100644
--- a/less/type.less
+++ b/less/type.less
@@ -49,7 +49,6 @@ a.text-success:hover { color: darken(@state-success-text, 10%); }
 // -------------------------
 
 h1, h2, h3, h4, h5, h6 {
-  margin: (@line-height-base / 2) 0;
   font-family: @headings-font-family;
   font-weight: @headings-font-weight;
   line-height: @line-height-base;
@@ -63,7 +62,17 @@ h1, h2, h3, h4, h5, h6 {
 
 h1,
 h2,
-h3 { line-height: @line-height-base * 2; }
+h3 {
+  margin-top: @line-height-base;
+  margin-bottom: @line-height-base / 2;
+  line-height: @line-height-base * 2;
+}
+h4,
+h5,
+h6 {
+  margin-top: @line-height-base / 2;
+  margin-bottom: @line-height-base / 2;
+}
 
 h1 { font-size: @font-size-base * 2.75; } // ~38px
 h2 { font-size: @font-size-base * 2.25; } // ~32px
@@ -83,7 +92,7 @@ h4 small { font-size: @font-size-base; }
 
 .page-header {
   padding-bottom: (@line-height-base / 2) - 1;
-  margin: @line-height-base 0 (@line-height-base * 1.5);
+  margin: (@line-height-base * 2) 0 @line-height-base;
   border-bottom: 1px solid @grayLighter;
 }