0ct0pu5/themes-wordpress
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Modern Business: Fix margins and font sizes for cover block h2 headings

Browse source
This commit is contained in:
Allan Cole 2019-05-17 16:23:31 -04:00
parent f2a5433363
commit e511fc11a9
4 changed files with 86 additions and 81 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

31
modern-business/sass/blocks/_blocks.scss
View file

@ -661,22 +661,25 @@
padding: $size__spacing-unit 10%; padding: $size__spacing-unit 10%;
} }
.wp-block-cover__inner-container,
.wp-block-cover-image-text, .wp-block-cover-image-text,
.wp-block-cover-text { .wp-block-cover-text {
color: #fff; color: #fff;
font-family: $font__heading;
font-size: $font__size-lg;
font-weight: 300;
line-height: 1.25;
padding: 0; padding: 0;
text-shadow: 0 0 12px #000; text-shadow: 0 0 12px #000;
@include media(tablet) { @include media(tablet) {
font-size: $font__size-xxl;
max-width: 100%; max-width: 100%;
} }
} }
.has-large-font-size,
h2 {
max-width: inherit;
margin: inherit;
text-align: inherit;
}
&.alignleft, &.alignleft,
&.alignright { &.alignright {
width: 100%; width: 100%;
@ -692,6 +695,7 @@
padding-left: calc(10% + 58px + (2 * #{$size__spacing-unit})); padding-left: calc(10% + 58px + (2 * #{$size__spacing-unit}));
padding-right: calc(10% + 58px + (2 * #{$size__spacing-unit})); padding-right: calc(10% + 58px + (2 * #{$size__spacing-unit}));
.wp-block-cover__inner-container,
.wp-block-cover-image-text, .wp-block-cover-image-text,
.wp-block-cover-text, .wp-block-cover-text,
h2 { h2 {
@ -911,23 +915,6 @@
} }
} }
//! Font Sizes
.has-small-font-size {
font-size: $font__size-sm;
}
.has-normal-font-size {
font-size: $font__size-md;
}
.has-large-font-size {
font-size: $font__size-lg;
}
.has-huge-font-size {
font-size: $font__size-xl;
}
//! Custom background colors //! Custom background colors
.has-primary-background-color, .has-primary-background-color,
.has-secondary-background-color, .has-secondary-background-color,

16
modern-business/sass/typography/_headings.scss
View file

@ -71,25 +71,32 @@ h6 {
line-height: 1.25; line-height: 1.25;
} }
.has-huge-font-size,
h1 { h1 {
font-size: $font__size-xl; font-size: $font__size-lg;
@include media(tablet) { @include media(tablet) {
font-size: $font__size-xxl; font-size: $font__size-xl;
} }
} }
.entry-title, .entry-title,
.not-found .page-title, .not-found .page-title,
.error-404 .page-title, .error-404 .page-title,
.has-larger-font-size, .has-large-font-size,
.wp-block-cover-image .wp-block-cover-image-text,
.wp-block-cover-image .wp-block-cover-text,
.wp-block-cover-image h2,
.wp-block-cover .wp-block-cover-image-text,
.wp-block-cover .wp-block-cover-text,
.wp-block-cover h2,
h2 { h2 {
font-size: $font__size-md; font-size: $font__size-md;
font-weight: 300; font-weight: 300;
text-align: center; text-align: center;
@include media(tablet) { @include media(tablet) {
font-size: $font__size-xl; font-size: $font__size-lg;
} }
} }
@ -107,7 +114,6 @@ h3 {
} }
.has-regular-font-size, .has-regular-font-size,
.has-large-font-size,
.comments-title, .comments-title,
h4 { h4 {
font-size: $font__size-base; font-size: $font__size-base;

59
modern-business/style-rtl.css
View file

@ -499,20 +499,28 @@ h6 {
line-height: 1.25; line-height: 1.25;
} }
.has-huge-font-size,
h1 { h1 {
font-size: 2.25em; font-size: 1.6875em;
} }
@media only screen and (min-width: 768px) { @media only screen and (min-width: 768px) {
.has-huge-font-size,
h1 { h1 {
font-size: 2.8125em; font-size: 2.25em;
} }
} }
.entry-title, .entry-title,
.not-found .page-title, .not-found .page-title,
.error-404 .page-title, .error-404 .page-title,
.has-larger-font-size, .has-large-font-size,
.wp-block-cover-image .wp-block-cover-image-text,
.wp-block-cover-image .wp-block-cover-text,
.wp-block-cover-image h2,
.wp-block-cover .wp-block-cover-image-text,
.wp-block-cover .wp-block-cover-text,
.wp-block-cover h2,
h2 { h2 {
font-size: 1.125em; font-size: 1.125em;
font-weight: 300; font-weight: 300;
@ -523,9 +531,15 @@ h2 {
.entry-title, .entry-title,
.not-found .page-title, .not-found .page-title,
.error-404 .page-title, .error-404 .page-title,
.has-larger-font-size, .has-large-font-size,
.wp-block-cover-image .wp-block-cover-image-text,
.wp-block-cover-image .wp-block-cover-text,
.wp-block-cover-image h2,
.wp-block-cover .wp-block-cover-image-text,
.wp-block-cover .wp-block-cover-text,
.wp-block-cover h2,
h2 { h2 {
font-size: 2.25em; font-size: 1.6875em;
} }
} }
@ -543,7 +557,6 @@ h3 {
} }
.has-regular-font-size, .has-regular-font-size,
.has-large-font-size,
.comments-title, .comments-title,
h4 { h4 {
font-size: 22px; font-size: 22px;
@ -4039,29 +4052,35 @@ body.page .main-navigation {
} }
} }
.entry .entry-content .wp-block-cover-image .wp-block-cover__inner-container,
.entry .entry-content .wp-block-cover-image .wp-block-cover-image-text, .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 .wp-block-cover-text,
.entry .entry-content .wp-block-cover .wp-block-cover__inner-container,
.entry .entry-content .wp-block-cover .wp-block-cover-image-text, .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 .wp-block-cover-text {
color: #fff; color: #fff;
font-family: "IBM Plex Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
font-size: 1.6875em;
font-weight: 300;
line-height: 1.25;
padding: 0; padding: 0;
text-shadow: 0 0 12px #000; text-shadow: 0 0 12px #000;
} }
@media only screen and (min-width: 768px) { @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, .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 .wp-block-cover-text,
.entry .entry-content .wp-block-cover .wp-block-cover__inner-container,
.entry .entry-content .wp-block-cover .wp-block-cover-image-text, .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 .wp-block-cover-text {
font-size: 2.8125em;
max-width: 100%; max-width: 100%;
} }
} }
.entry .entry-content .wp-block-cover-image h2,
.entry .entry-content .wp-block-cover h2 {
max-width: inherit;
margin: inherit;
text-align: inherit;
}
.entry .entry-content .wp-block-cover-image.alignleft, .entry .entry-content .wp-block-cover-image.alignright, .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.alignleft,
.entry .entry-content .wp-block-cover.alignright { .entry .entry-content .wp-block-cover.alignright {
@ -4082,9 +4101,11 @@ body.page .main-navigation {
padding-right: calc(10% + 58px + (2 * 1rem)); padding-right: calc(10% + 58px + (2 * 1rem));
padding-left: calc(10% + 58px + (2 * 1rem)); padding-left: calc(10% + 58px + (2 * 1rem));
} }
.entry .entry-content .wp-block-cover-image.alignfull .wp-block-cover__inner-container,
.entry .entry-content .wp-block-cover-image.alignfull .wp-block-cover-image-text, .entry .entry-content .wp-block-cover-image.alignfull .wp-block-cover-image-text,
.entry .entry-content .wp-block-cover-image.alignfull .wp-block-cover-text, .entry .entry-content .wp-block-cover-image.alignfull .wp-block-cover-text,
.entry .entry-content .wp-block-cover-image.alignfull h2, .entry .entry-content .wp-block-cover-image.alignfull h2,
.entry .entry-content .wp-block-cover.alignfull .wp-block-cover__inner-container,
.entry .entry-content .wp-block-cover.alignfull .wp-block-cover-image-text, .entry .entry-content .wp-block-cover.alignfull .wp-block-cover-image-text,
.entry .entry-content .wp-block-cover.alignfull .wp-block-cover-text, .entry .entry-content .wp-block-cover.alignfull .wp-block-cover-text,
.entry .entry-content .wp-block-cover.alignfull h2 { .entry .entry-content .wp-block-cover.alignfull h2 {
@ -4297,22 +4318,6 @@ body.page .main-navigation {
font-size: 0.71111em; font-size: 0.71111em;
} }
.entry .entry-content .has-small-font-size {
font-size: 0.88889em;
}
.entry .entry-content .has-normal-font-size {
font-size: 1.125em;
}
.entry .entry-content .has-large-font-size {
font-size: 1.6875em;
}
.entry .entry-content .has-huge-font-size {
font-size: 2.25em;
}
.entry .entry-content .has-primary-background-color, .entry .entry-content .has-primary-background-color,
.entry .entry-content .has-secondary-background-color, .entry .entry-content .has-secondary-background-color,
.entry .entry-content .has-dark-gray-background-color, .entry .entry-content .has-dark-gray-background-color,

61
modern-business/style.css
View file

@ -499,20 +499,28 @@ h6 {
line-height: 1.25; line-height: 1.25;
} }
.has-huge-font-size,
h1 { h1 {
font-size: 2.25em; font-size: 1.6875em;
} }
@media only screen and (min-width: 768px) { @media only screen and (min-width: 768px) {
.has-huge-font-size,
h1 { h1 {
font-size: 2.8125em; font-size: 2.25em;
} }
} }
.entry-title, .entry-title,
.not-found .page-title, .not-found .page-title,
.error-404 .page-title, .error-404 .page-title,
.has-larger-font-size, .has-large-font-size,
.wp-block-cover-image .wp-block-cover-image-text,
.wp-block-cover-image .wp-block-cover-text,
.wp-block-cover-image h2,
.wp-block-cover .wp-block-cover-image-text,
.wp-block-cover .wp-block-cover-text,
.wp-block-cover h2,
h2 { h2 {
font-size: 1.125em; font-size: 1.125em;
font-weight: 300; font-weight: 300;
@ -523,9 +531,15 @@ h2 {
.entry-title, .entry-title,
.not-found .page-title, .not-found .page-title,
.error-404 .page-title, .error-404 .page-title,
.has-larger-font-size, .has-large-font-size,
.wp-block-cover-image .wp-block-cover-image-text,
.wp-block-cover-image .wp-block-cover-text,
.wp-block-cover-image h2,
.wp-block-cover .wp-block-cover-image-text,
.wp-block-cover .wp-block-cover-text,
.wp-block-cover h2,
h2 { h2 {
font-size: 2.25em; font-size: 1.6875em;
} }
} }
@ -543,7 +557,6 @@ h3 {
} }
.has-regular-font-size, .has-regular-font-size,
.has-large-font-size,
.comments-title, .comments-title,
h4 { h4 {
font-size: 22px; font-size: 22px;
@ -4051,29 +4064,37 @@ body.page .main-navigation {
} }
} }
.entry .entry-content .wp-block-cover-image .wp-block-cover__inner-container,
.entry .entry-content .wp-block-cover-image .wp-block-cover-image-text, .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 .wp-block-cover-text,
.entry .entry-content .wp-block-cover .wp-block-cover__inner-container,
.entry .entry-content .wp-block-cover .wp-block-cover-image-text, .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 .wp-block-cover-text {
color: #fff; color: #fff;
font-family: "IBM Plex Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
font-size: 1.6875em;
font-weight: 300;
line-height: 1.25;
padding: 0; padding: 0;
text-shadow: 0 0 12px #000; text-shadow: 0 0 12px #000;
} }
@media only screen and (min-width: 768px) { @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, .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 .wp-block-cover-text,
.entry .entry-content .wp-block-cover .wp-block-cover__inner-container,
.entry .entry-content .wp-block-cover .wp-block-cover-image-text, .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 .wp-block-cover-text {
font-size: 2.8125em;
max-width: 100%; max-width: 100%;
} }
} }
.entry .entry-content .wp-block-cover-image .has-large-font-size,
.entry .entry-content .wp-block-cover-image h2,
.entry .entry-content .wp-block-cover .has-large-font-size,
.entry .entry-content .wp-block-cover h2 {
max-width: inherit;
margin: inherit;
text-align: inherit;
}
.entry .entry-content .wp-block-cover-image.alignleft, .entry .entry-content .wp-block-cover-image.alignright, .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.alignleft,
.entry .entry-content .wp-block-cover.alignright { .entry .entry-content .wp-block-cover.alignright {
@ -4094,9 +4115,11 @@ body.page .main-navigation {
padding-left: calc(10% + 58px + (2 * 1rem)); padding-left: calc(10% + 58px + (2 * 1rem));
padding-right: calc(10% + 58px + (2 * 1rem)); padding-right: calc(10% + 58px + (2 * 1rem));
} }
.entry .entry-content .wp-block-cover-image.alignfull .wp-block-cover__inner-container,
.entry .entry-content .wp-block-cover-image.alignfull .wp-block-cover-image-text, .entry .entry-content .wp-block-cover-image.alignfull .wp-block-cover-image-text,
.entry .entry-content .wp-block-cover-image.alignfull .wp-block-cover-text, .entry .entry-content .wp-block-cover-image.alignfull .wp-block-cover-text,
.entry .entry-content .wp-block-cover-image.alignfull h2, .entry .entry-content .wp-block-cover-image.alignfull h2,
.entry .entry-content .wp-block-cover.alignfull .wp-block-cover__inner-container,
.entry .entry-content .wp-block-cover.alignfull .wp-block-cover-image-text, .entry .entry-content .wp-block-cover.alignfull .wp-block-cover-image-text,
.entry .entry-content .wp-block-cover.alignfull .wp-block-cover-text, .entry .entry-content .wp-block-cover.alignfull .wp-block-cover-text,
.entry .entry-content .wp-block-cover.alignfull h2 { .entry .entry-content .wp-block-cover.alignfull h2 {
@ -4309,22 +4332,6 @@ body.page .main-navigation {
font-size: 0.71111em; font-size: 0.71111em;
} }
.entry .entry-content .has-small-font-size {
font-size: 0.88889em;
}
.entry .entry-content .has-normal-font-size {
font-size: 1.125em;
}
.entry .entry-content .has-large-font-size {
font-size: 1.6875em;
}
.entry .entry-content .has-huge-font-size {
font-size: 2.25em;
}
.entry .entry-content .has-primary-background-color, .entry .entry-content .has-primary-background-color,
.entry .entry-content .has-secondary-background-color, .entry .entry-content .has-secondary-background-color,
.entry .entry-content .has-dark-gray-background-color, .entry .entry-content .has-dark-gray-background-color,