Browse Source

Modern Business: Fix font sizes for Cover Block to match original design

Allan Cole 6 years ago
parent
commit
bb15a816dd
3 changed files with 125 additions and 96 deletions
  1. 33 12
      modern-business/sass/blocks/_blocks.scss
  2. 46 42
      modern-business/style-rtl.css
  3. 46 42
      modern-business/style.css

+ 33 - 12
modern-business/sass/blocks/_blocks.scss

@@ -668,28 +668,49 @@
 			padding: 0;
 			text-shadow: 0 0 12px #000;
 
-			h1,
-			h2,
-			h3,
-			h4,
-			h5,
-			h6 {
-				font-weight: 300;
-			}
-
-
 			@include media(tablet) {
 				max-width: 100%;
 			}
 		}
 
-		.has-large-font-size,
+		h1,
+		h2,
+		h3,
+		h4,
+		h5,
+		h6 {
+			font-weight: 300;
+		}
+
+		h1 {
+			font-size: $font__size-xxxl;
+		}
+
+		.wp-block-cover-image-text,
+		.wp-block-cover-text,
 		h2 {
-			max-width: inherit;
+			font-size: $font__size-xxl;
 			margin: inherit;
+			max-width: inherit;
 			text-align: inherit;
 		}
 
+		h3 {
+			font-size: $font__size-xl;
+		}
+
+		h4 {
+			font-size: $font__size-lg;
+		}
+
+		h5 {
+			font-size: $font__size-md;
+		}
+
+		h6 {
+			font-size: $font__size-base;
+		}
+
 		&.alignleft,
 		&.alignright {
 			width: 100%;

+ 46 - 42
modern-business/style-rtl.css

@@ -4066,45 +4066,6 @@ body.page .main-navigation {
   text-shadow: 0 0 12px #000;
 }
 
-.entry .entry-content .wp-block-cover-image .wp-block-cover__inner-container h1,
-.entry .entry-content .wp-block-cover-image .wp-block-cover__inner-container h2,
-.entry .entry-content .wp-block-cover-image .wp-block-cover__inner-container h3,
-.entry .entry-content .wp-block-cover-image .wp-block-cover__inner-container h4,
-.entry .entry-content .wp-block-cover-image .wp-block-cover__inner-container h5,
-.entry .entry-content .wp-block-cover-image .wp-block-cover__inner-container h6,
-.entry .entry-content .wp-block-cover-image .wp-block-cover-image-text h1,
-.entry .entry-content .wp-block-cover-image .wp-block-cover-image-text h2,
-.entry .entry-content .wp-block-cover-image .wp-block-cover-image-text h3,
-.entry .entry-content .wp-block-cover-image .wp-block-cover-image-text h4,
-.entry .entry-content .wp-block-cover-image .wp-block-cover-image-text h5,
-.entry .entry-content .wp-block-cover-image .wp-block-cover-image-text h6,
-.entry .entry-content .wp-block-cover-image .wp-block-cover-text h1,
-.entry .entry-content .wp-block-cover-image .wp-block-cover-text h2,
-.entry .entry-content .wp-block-cover-image .wp-block-cover-text h3,
-.entry .entry-content .wp-block-cover-image .wp-block-cover-text h4,
-.entry .entry-content .wp-block-cover-image .wp-block-cover-text h5,
-.entry .entry-content .wp-block-cover-image .wp-block-cover-text h6,
-.entry .entry-content .wp-block-cover .wp-block-cover__inner-container h1,
-.entry .entry-content .wp-block-cover .wp-block-cover__inner-container h2,
-.entry .entry-content .wp-block-cover .wp-block-cover__inner-container h3,
-.entry .entry-content .wp-block-cover .wp-block-cover__inner-container h4,
-.entry .entry-content .wp-block-cover .wp-block-cover__inner-container h5,
-.entry .entry-content .wp-block-cover .wp-block-cover__inner-container h6,
-.entry .entry-content .wp-block-cover .wp-block-cover-image-text h1,
-.entry .entry-content .wp-block-cover .wp-block-cover-image-text h2,
-.entry .entry-content .wp-block-cover .wp-block-cover-image-text h3,
-.entry .entry-content .wp-block-cover .wp-block-cover-image-text h4,
-.entry .entry-content .wp-block-cover .wp-block-cover-image-text h5,
-.entry .entry-content .wp-block-cover .wp-block-cover-image-text h6,
-.entry .entry-content .wp-block-cover .wp-block-cover-text h1,
-.entry .entry-content .wp-block-cover .wp-block-cover-text h2,
-.entry .entry-content .wp-block-cover .wp-block-cover-text h3,
-.entry .entry-content .wp-block-cover .wp-block-cover-text h4,
-.entry .entry-content .wp-block-cover .wp-block-cover-text h5,
-.entry .entry-content .wp-block-cover .wp-block-cover-text h6 {
-  font-weight: 300;
-}
-
 @media only screen and (min-width: 768px) {
   .entry .entry-content .wp-block-cover-image .wp-block-cover__inner-container,
   .entry .entry-content .wp-block-cover-image .wp-block-cover-image-text,
@@ -4116,15 +4077,58 @@ body.page .main-navigation {
   }
 }
 
-.entry .entry-content .wp-block-cover-image .has-large-font-size,
+.entry .entry-content .wp-block-cover-image h1,
 .entry .entry-content .wp-block-cover-image h2,
-.entry .entry-content .wp-block-cover .has-large-font-size,
+.entry .entry-content .wp-block-cover-image h3,
+.entry .entry-content .wp-block-cover-image h4,
+.entry .entry-content .wp-block-cover-image h5,
+.entry .entry-content .wp-block-cover-image h6,
+.entry .entry-content .wp-block-cover h1,
+.entry .entry-content .wp-block-cover h2,
+.entry .entry-content .wp-block-cover h3,
+.entry .entry-content .wp-block-cover h4,
+.entry .entry-content .wp-block-cover h5,
+.entry .entry-content .wp-block-cover h6 {
+  font-weight: 300;
+}
+
+.entry .entry-content .wp-block-cover-image h1,
+.entry .entry-content .wp-block-cover h1 {
+  font-size: 3.375em;
+}
+
+.entry .entry-content .wp-block-cover-image .wp-block-cover-image-text,
+.entry .entry-content .wp-block-cover-image .wp-block-cover-text,
+.entry .entry-content .wp-block-cover-image h2,
+.entry .entry-content .wp-block-cover .wp-block-cover-image-text,
+.entry .entry-content .wp-block-cover .wp-block-cover-text,
 .entry .entry-content .wp-block-cover h2 {
-  max-width: inherit;
+  font-size: 2.8125em;
   margin: inherit;
+  max-width: inherit;
   text-align: inherit;
 }
 
+.entry .entry-content .wp-block-cover-image h3,
+.entry .entry-content .wp-block-cover h3 {
+  font-size: 2.25em;
+}
+
+.entry .entry-content .wp-block-cover-image h4,
+.entry .entry-content .wp-block-cover h4 {
+  font-size: 1.6875em;
+}
+
+.entry .entry-content .wp-block-cover-image h5,
+.entry .entry-content .wp-block-cover h5 {
+  font-size: 1.125em;
+}
+
+.entry .entry-content .wp-block-cover-image h6,
+.entry .entry-content .wp-block-cover h6 {
+  font-size: 22px;
+}
+
 .entry .entry-content .wp-block-cover-image.alignleft, .entry .entry-content .wp-block-cover-image.alignright,
 .entry .entry-content .wp-block-cover.alignleft,
 .entry .entry-content .wp-block-cover.alignright {

+ 46 - 42
modern-business/style.css

@@ -4078,45 +4078,6 @@ body.page .main-navigation {
   text-shadow: 0 0 12px #000;
 }
 
-.entry .entry-content .wp-block-cover-image .wp-block-cover__inner-container h1,
-.entry .entry-content .wp-block-cover-image .wp-block-cover__inner-container h2,
-.entry .entry-content .wp-block-cover-image .wp-block-cover__inner-container h3,
-.entry .entry-content .wp-block-cover-image .wp-block-cover__inner-container h4,
-.entry .entry-content .wp-block-cover-image .wp-block-cover__inner-container h5,
-.entry .entry-content .wp-block-cover-image .wp-block-cover__inner-container h6,
-.entry .entry-content .wp-block-cover-image .wp-block-cover-image-text h1,
-.entry .entry-content .wp-block-cover-image .wp-block-cover-image-text h2,
-.entry .entry-content .wp-block-cover-image .wp-block-cover-image-text h3,
-.entry .entry-content .wp-block-cover-image .wp-block-cover-image-text h4,
-.entry .entry-content .wp-block-cover-image .wp-block-cover-image-text h5,
-.entry .entry-content .wp-block-cover-image .wp-block-cover-image-text h6,
-.entry .entry-content .wp-block-cover-image .wp-block-cover-text h1,
-.entry .entry-content .wp-block-cover-image .wp-block-cover-text h2,
-.entry .entry-content .wp-block-cover-image .wp-block-cover-text h3,
-.entry .entry-content .wp-block-cover-image .wp-block-cover-text h4,
-.entry .entry-content .wp-block-cover-image .wp-block-cover-text h5,
-.entry .entry-content .wp-block-cover-image .wp-block-cover-text h6,
-.entry .entry-content .wp-block-cover .wp-block-cover__inner-container h1,
-.entry .entry-content .wp-block-cover .wp-block-cover__inner-container h2,
-.entry .entry-content .wp-block-cover .wp-block-cover__inner-container h3,
-.entry .entry-content .wp-block-cover .wp-block-cover__inner-container h4,
-.entry .entry-content .wp-block-cover .wp-block-cover__inner-container h5,
-.entry .entry-content .wp-block-cover .wp-block-cover__inner-container h6,
-.entry .entry-content .wp-block-cover .wp-block-cover-image-text h1,
-.entry .entry-content .wp-block-cover .wp-block-cover-image-text h2,
-.entry .entry-content .wp-block-cover .wp-block-cover-image-text h3,
-.entry .entry-content .wp-block-cover .wp-block-cover-image-text h4,
-.entry .entry-content .wp-block-cover .wp-block-cover-image-text h5,
-.entry .entry-content .wp-block-cover .wp-block-cover-image-text h6,
-.entry .entry-content .wp-block-cover .wp-block-cover-text h1,
-.entry .entry-content .wp-block-cover .wp-block-cover-text h2,
-.entry .entry-content .wp-block-cover .wp-block-cover-text h3,
-.entry .entry-content .wp-block-cover .wp-block-cover-text h4,
-.entry .entry-content .wp-block-cover .wp-block-cover-text h5,
-.entry .entry-content .wp-block-cover .wp-block-cover-text h6 {
-  font-weight: 300;
-}
-
 @media only screen and (min-width: 768px) {
   .entry .entry-content .wp-block-cover-image .wp-block-cover__inner-container,
   .entry .entry-content .wp-block-cover-image .wp-block-cover-image-text,
@@ -4128,15 +4089,58 @@ body.page .main-navigation {
   }
 }
 
-.entry .entry-content .wp-block-cover-image .has-large-font-size,
+.entry .entry-content .wp-block-cover-image h1,
 .entry .entry-content .wp-block-cover-image h2,
-.entry .entry-content .wp-block-cover .has-large-font-size,
+.entry .entry-content .wp-block-cover-image h3,
+.entry .entry-content .wp-block-cover-image h4,
+.entry .entry-content .wp-block-cover-image h5,
+.entry .entry-content .wp-block-cover-image h6,
+.entry .entry-content .wp-block-cover h1,
+.entry .entry-content .wp-block-cover h2,
+.entry .entry-content .wp-block-cover h3,
+.entry .entry-content .wp-block-cover h4,
+.entry .entry-content .wp-block-cover h5,
+.entry .entry-content .wp-block-cover h6 {
+  font-weight: 300;
+}
+
+.entry .entry-content .wp-block-cover-image h1,
+.entry .entry-content .wp-block-cover h1 {
+  font-size: 3.375em;
+}
+
+.entry .entry-content .wp-block-cover-image .wp-block-cover-image-text,
+.entry .entry-content .wp-block-cover-image .wp-block-cover-text,
+.entry .entry-content .wp-block-cover-image h2,
+.entry .entry-content .wp-block-cover .wp-block-cover-image-text,
+.entry .entry-content .wp-block-cover .wp-block-cover-text,
 .entry .entry-content .wp-block-cover h2 {
-  max-width: inherit;
+  font-size: 2.8125em;
   margin: inherit;
+  max-width: inherit;
   text-align: inherit;
 }
 
+.entry .entry-content .wp-block-cover-image h3,
+.entry .entry-content .wp-block-cover h3 {
+  font-size: 2.25em;
+}
+
+.entry .entry-content .wp-block-cover-image h4,
+.entry .entry-content .wp-block-cover h4 {
+  font-size: 1.6875em;
+}
+
+.entry .entry-content .wp-block-cover-image h5,
+.entry .entry-content .wp-block-cover h5 {
+  font-size: 1.125em;
+}
+
+.entry .entry-content .wp-block-cover-image h6,
+.entry .entry-content .wp-block-cover h6 {
+  font-size: 22px;
+}
+
 .entry .entry-content .wp-block-cover-image.alignleft, .entry .entry-content .wp-block-cover-image.alignright,
 .entry .entry-content .wp-block-cover.alignleft,
 .entry .entry-content .wp-block-cover.alignright {