Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Varia: Simplify pullquote styles #2503

Merged
merged 2 commits into from
Sep 24, 2020
Merged

Varia: Simplify pullquote styles #2503

Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
0a602a6
Varia: Simplify pullquote styles
scruffian Sep 24, 2020
709fbc5
rebuild all child themes
scruffian Sep 24, 2020
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
45 changes: 11 additions & 34 deletions alves/style-editor.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -837,32 +837,25 @@ p.has-background:not(.has-background-background-color) a {
}

.wp-block-pullquote {
padding: calc( 3 * 16px) 0;
margin-left: 0;
margin-right: 0;
text-align: center;
border-top-color: #3E7D98;
border-top-width: 4px;
border-bottom-color: #3E7D98;
border-bottom-width: 4px;
color: #394d55;
/**
* Block Options
*/
}

.wp-block-pullquote blockquote {
padding-left: 0;
}

.wp-block-pullquote p {
.wp-block-pullquote blockquote p {
font-family: "Lora", Georgia, sans-serif;
font-family: var(--font-headings, "Lora", Georgia, sans-serif);
font-size: 1.8em;
font-size: 1.8rem;
letter-spacing: normal;
line-height: 1.125;
}

.wp-block-pullquote.is-style-solid-color blockquote p {
font-size: 1.8rem;
}

.wp-block-pullquote a {
color: currentColor;
}
Expand All @@ -871,42 +864,26 @@ p.has-background:not(.has-background-background-color) a {
.wp-block-pullquote cite,
.wp-block-pullquote footer {
color: #4d6974;
font-size: 1.04167em;
font-size: 1.04167rem;
letter-spacing: normal;
}

.wp-block-pullquote:not(.is-style-solid-color) {
background: none;
.wp-block-pullquote blockquote {
padding-left: 0;
}

.wp-block-pullquote.is-style-solid-color {
background-color: #3E7D98;
color: #ffffff;
}

.wp-block-pullquote.is-style-solid-color.alignleft blockquote,
.wp-block-pullquote.is-style-solid-color.alignright blockquote {
padding-left: 16px;
padding-right: 16px;
max-width: inherit;
}

.wp-block-pullquote.is-style-solid-color blockquote {
padding-left: 0;
}

.wp-block-pullquote.is-style-solid-color .wp-block-pullquote__citation,
.wp-block-pullquote.is-style-solid-color cite,
.wp-block-pullquote.is-style-solid-color footer {
color: currentColor;
}

.wp-block-pullquote.alignwide > p,
.wp-block-pullquote.alignfull > p,
.wp-block-pullquote.alignwide blockquote,
.wp-block-pullquote.alignfull blockquote {
margin-left: auto;
margin-right: auto;
.wp-block-pullquote.is-style-solid-color:not(.has-background) {
background-color: #3E7D98;
}

.wp-block-quote {
Expand Down
68 changes: 12 additions & 56 deletions alves/style-rtl.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2082,28 +2082,25 @@ p.has-background {
}

.wp-block-pullquote {
padding: calc( 3 * 16px) 0;
margin-right: 0;
margin-left: 0;
text-align: center;
border-top-color: #3E7D98;
border-top-width: 4px;
border-bottom-color: #3E7D98;
border-bottom-width: 4px;
color: #394d55;
/**
* Block Options
*/
}

.wp-block-pullquote p {
.wp-block-pullquote blockquote p {
font-family: "Lora", Georgia, sans-serif;
font-family: var(--font-headings, "Lora", Georgia, sans-serif);
font-size: 1.8rem;
letter-spacing: normal;
line-height: 1.125;
}

.wp-block-pullquote.is-style-solid-color blockquote p {
font-size: 1.8rem;
}

.wp-block-pullquote a {
color: currentColor;
}
Expand All @@ -2114,31 +2111,16 @@ p.has-background {
color: #4d6974;
font-size: 1.04167rem;
letter-spacing: normal;
display: block;
}

.wp-block-pullquote:not(.is-style-solid-color) {
background: none;
}

.wp-block-pullquote:not(.is-style-solid-color) blockquote {
.wp-block-pullquote blockquote {
padding-right: 0;
}

.wp-block-pullquote.is-style-default.alignleft blockquote > *, .wp-block-pullquote.is-style-default.aligncenter blockquote > *, .wp-block-pullquote.is-style-default.alignright blockquote > * {
text-align: center;
}

.wp-block-pullquote.is-style-solid-color {
color: #ffffff;
}

.wp-block-pullquote.is-style-solid-color blockquote {
padding-right: 16px;
padding-left: 16px;
max-width: inherit;
}

.wp-block-pullquote.is-style-solid-color .wp-block-pullquote__citation,
.wp-block-pullquote.is-style-solid-color cite,
.wp-block-pullquote.is-style-solid-color footer {
Expand All @@ -2149,14 +2131,6 @@ p.has-background {
background-color: #3E7D98;
}

.wp-block-pullquote.alignwide > p,
.wp-block-pullquote.alignfull > p,
.wp-block-pullquote.alignwide blockquote,
.wp-block-pullquote.alignfull blockquote {
margin-right: auto;
margin-left: auto;
}

.wp-block-quote {
border-right-color: #3E7D98;
margin: 32px 0;
Expand Down Expand Up @@ -3610,10 +3584,7 @@ img#wpstats {
* Page Layout Styles & Repsonsive Styles
*/
/* Responsive width-content overrides */
.responsive-max-width, .entry-content > .wp-block-button.aligncenter, .wp-block-pullquote.is-style-solid-color:not(.alignleft):not(.alignright) blockquote, .wp-block-pullquote.alignwide > p,
.wp-block-pullquote.alignfull > p,
.wp-block-pullquote.alignwide blockquote,
.wp-block-pullquote.alignfull blockquote, hr.wp-block-separator.is-style-wide, .entry-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator):not(.wp-block-button):not(.entry-attachment),
.responsive-max-width, .entry-content > .wp-block-button.aligncenter, hr.wp-block-separator.is-style-wide, .entry-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator):not(.wp-block-button):not(.entry-attachment),
.entry-content > *:not(.wp-block-button),
.entry-content [class*="inner-container"] > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator), .entry-content .wp-audio-shortcode, .post-navigation, .pagination {
max-width: 100%;
Expand All @@ -3622,54 +3593,39 @@ img#wpstats {
}

@media only screen and (min-width: 560px) {
.responsive-max-width, .entry-content > .wp-block-button.aligncenter, .wp-block-pullquote.is-style-solid-color:not(.alignleft):not(.alignright) blockquote, .wp-block-pullquote.alignwide > p,
.wp-block-pullquote.alignfull > p,
.wp-block-pullquote.alignwide blockquote,
.wp-block-pullquote.alignfull blockquote, hr.wp-block-separator.is-style-wide, .entry-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator):not(.wp-block-button):not(.entry-attachment),
.responsive-max-width, .entry-content > .wp-block-button.aligncenter, hr.wp-block-separator.is-style-wide, .entry-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator):not(.wp-block-button):not(.entry-attachment),
.entry-content > *:not(.wp-block-button),
.entry-content [class*="inner-container"] > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator), .entry-content .wp-audio-shortcode, .post-navigation, .pagination {
max-width: calc( 560px - 32px);
}
}

@media only screen and (min-width: 640px) {
.responsive-max-width, .entry-content > .wp-block-button.aligncenter, .wp-block-pullquote.is-style-solid-color:not(.alignleft):not(.alignright) blockquote, .wp-block-pullquote.alignwide > p,
.wp-block-pullquote.alignfull > p,
.wp-block-pullquote.alignwide blockquote,
.wp-block-pullquote.alignfull blockquote, hr.wp-block-separator.is-style-wide, .entry-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator):not(.wp-block-button):not(.entry-attachment),
.responsive-max-width, .entry-content > .wp-block-button.aligncenter, hr.wp-block-separator.is-style-wide, .entry-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator):not(.wp-block-button):not(.entry-attachment),
.entry-content > *:not(.wp-block-button),
.entry-content [class*="inner-container"] > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator), .entry-content .wp-audio-shortcode, .post-navigation, .pagination {
max-width: calc( 640px - 32px);
}
}

@media only screen and (min-width: 782px) {
.responsive-max-width, .entry-content > .wp-block-button.aligncenter, .wp-block-pullquote.is-style-solid-color:not(.alignleft):not(.alignright) blockquote, .wp-block-pullquote.alignwide > p,
.wp-block-pullquote.alignfull > p,
.wp-block-pullquote.alignwide blockquote,
.wp-block-pullquote.alignfull blockquote, hr.wp-block-separator.is-style-wide, .entry-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator):not(.wp-block-button):not(.entry-attachment),
.responsive-max-width, .entry-content > .wp-block-button.aligncenter, hr.wp-block-separator.is-style-wide, .entry-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator):not(.wp-block-button):not(.entry-attachment),
.entry-content > *:not(.wp-block-button),
.entry-content [class*="inner-container"] > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator), .entry-content .wp-audio-shortcode, .post-navigation, .pagination {
max-width: calc( 782px - 32px);
}
}

@media only screen and (min-width: 1024px) {
.responsive-max-width, .entry-content > .wp-block-button.aligncenter, .wp-block-pullquote.is-style-solid-color:not(.alignleft):not(.alignright) blockquote, .wp-block-pullquote.alignwide > p,
.wp-block-pullquote.alignfull > p,
.wp-block-pullquote.alignwide blockquote,
.wp-block-pullquote.alignfull blockquote, hr.wp-block-separator.is-style-wide, .entry-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator):not(.wp-block-button):not(.entry-attachment),
.responsive-max-width, .entry-content > .wp-block-button.aligncenter, hr.wp-block-separator.is-style-wide, .entry-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator):not(.wp-block-button):not(.entry-attachment),
.entry-content > *:not(.wp-block-button),
.entry-content [class*="inner-container"] > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator), .entry-content .wp-audio-shortcode, .post-navigation, .pagination {
max-width: calc( 782px - 32px);
}
}

@media only screen and (min-width: 1280px) {
.responsive-max-width, .entry-content > .wp-block-button.aligncenter, .wp-block-pullquote.is-style-solid-color:not(.alignleft):not(.alignright) blockquote, .wp-block-pullquote.alignwide > p,
.wp-block-pullquote.alignfull > p,
.wp-block-pullquote.alignwide blockquote,
.wp-block-pullquote.alignfull blockquote, hr.wp-block-separator.is-style-wide, .entry-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator):not(.wp-block-button):not(.entry-attachment),
.responsive-max-width, .entry-content > .wp-block-button.aligncenter, hr.wp-block-separator.is-style-wide, .entry-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator):not(.wp-block-button):not(.entry-attachment),
.entry-content > *:not(.wp-block-button),
.entry-content [class*="inner-container"] > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator), .entry-content .wp-audio-shortcode, .post-navigation, .pagination {
max-width: calc( 782px - 32px);
Expand Down
68 changes: 12 additions & 56 deletions alves/style.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2082,28 +2082,25 @@ p.has-background {
}

.wp-block-pullquote {
padding: calc( 3 * 16px) 0;
margin-left: 0;
margin-right: 0;
text-align: center;
border-top-color: #3E7D98;
border-top-width: 4px;
border-bottom-color: #3E7D98;
border-bottom-width: 4px;
color: #394d55;
/**
* Block Options
*/
}

.wp-block-pullquote p {
.wp-block-pullquote blockquote p {
font-family: "Lora", Georgia, sans-serif;
font-family: var(--font-headings, "Lora", Georgia, sans-serif);
font-size: 1.8rem;
letter-spacing: normal;
line-height: 1.125;
}

.wp-block-pullquote.is-style-solid-color blockquote p {
font-size: 1.8rem;
}

.wp-block-pullquote a {
color: currentColor;
}
Expand All @@ -2114,31 +2111,16 @@ p.has-background {
color: #4d6974;
font-size: 1.04167rem;
letter-spacing: normal;
display: block;
}

.wp-block-pullquote:not(.is-style-solid-color) {
background: none;
}

.wp-block-pullquote:not(.is-style-solid-color) blockquote {
.wp-block-pullquote blockquote {
padding-left: 0;
}

.wp-block-pullquote.is-style-default.alignleft blockquote > *, .wp-block-pullquote.is-style-default.aligncenter blockquote > *, .wp-block-pullquote.is-style-default.alignright blockquote > * {
text-align: center;
}

.wp-block-pullquote.is-style-solid-color {
color: #ffffff;
}

.wp-block-pullquote.is-style-solid-color blockquote {
padding-left: 16px;
padding-right: 16px;
max-width: inherit;
}

.wp-block-pullquote.is-style-solid-color .wp-block-pullquote__citation,
.wp-block-pullquote.is-style-solid-color cite,
.wp-block-pullquote.is-style-solid-color footer {
Expand All @@ -2149,14 +2131,6 @@ p.has-background {
background-color: #3E7D98;
}

.wp-block-pullquote.alignwide > p,
.wp-block-pullquote.alignfull > p,
.wp-block-pullquote.alignwide blockquote,
.wp-block-pullquote.alignfull blockquote {
margin-left: auto;
margin-right: auto;
}

.wp-block-quote {
border-left-color: #3E7D98;
margin: 32px 0;
Expand Down Expand Up @@ -3629,10 +3603,7 @@ img#wpstats {
* Page Layout Styles & Repsonsive Styles
*/
/* Responsive width-content overrides */
.responsive-max-width, .entry-content > .wp-block-button.aligncenter, .wp-block-pullquote.is-style-solid-color:not(.alignleft):not(.alignright) blockquote, .wp-block-pullquote.alignwide > p,
.wp-block-pullquote.alignfull > p,
.wp-block-pullquote.alignwide blockquote,
.wp-block-pullquote.alignfull blockquote, hr.wp-block-separator.is-style-wide, .entry-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator):not(.wp-block-button):not(.entry-attachment),
.responsive-max-width, .entry-content > .wp-block-button.aligncenter, hr.wp-block-separator.is-style-wide, .entry-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator):not(.wp-block-button):not(.entry-attachment),
.entry-content > *:not(.wp-block-button),
.entry-content [class*="inner-container"] > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator), .entry-content .wp-audio-shortcode, .post-navigation, .pagination {
max-width: 100%;
Expand All @@ -3641,54 +3612,39 @@ img#wpstats {
}

@media only screen and (min-width: 560px) {
.responsive-max-width, .entry-content > .wp-block-button.aligncenter, .wp-block-pullquote.is-style-solid-color:not(.alignleft):not(.alignright) blockquote, .wp-block-pullquote.alignwide > p,
.wp-block-pullquote.alignfull > p,
.wp-block-pullquote.alignwide blockquote,
.wp-block-pullquote.alignfull blockquote, hr.wp-block-separator.is-style-wide, .entry-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator):not(.wp-block-button):not(.entry-attachment),
.responsive-max-width, .entry-content > .wp-block-button.aligncenter, hr.wp-block-separator.is-style-wide, .entry-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator):not(.wp-block-button):not(.entry-attachment),
.entry-content > *:not(.wp-block-button),
.entry-content [class*="inner-container"] > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator), .entry-content .wp-audio-shortcode, .post-navigation, .pagination {
max-width: calc( 560px - 32px);
}
}

@media only screen and (min-width: 640px) {
.responsive-max-width, .entry-content > .wp-block-button.aligncenter, .wp-block-pullquote.is-style-solid-color:not(.alignleft):not(.alignright) blockquote, .wp-block-pullquote.alignwide > p,
.wp-block-pullquote.alignfull > p,
.wp-block-pullquote.alignwide blockquote,
.wp-block-pullquote.alignfull blockquote, hr.wp-block-separator.is-style-wide, .entry-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator):not(.wp-block-button):not(.entry-attachment),
.responsive-max-width, .entry-content > .wp-block-button.aligncenter, hr.wp-block-separator.is-style-wide, .entry-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator):not(.wp-block-button):not(.entry-attachment),
.entry-content > *:not(.wp-block-button),
.entry-content [class*="inner-container"] > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator), .entry-content .wp-audio-shortcode, .post-navigation, .pagination {
max-width: calc( 640px - 32px);
}
}

@media only screen and (min-width: 782px) {
.responsive-max-width, .entry-content > .wp-block-button.aligncenter, .wp-block-pullquote.is-style-solid-color:not(.alignleft):not(.alignright) blockquote, .wp-block-pullquote.alignwide > p,
.wp-block-pullquote.alignfull > p,
.wp-block-pullquote.alignwide blockquote,
.wp-block-pullquote.alignfull blockquote, hr.wp-block-separator.is-style-wide, .entry-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator):not(.wp-block-button):not(.entry-attachment),
.responsive-max-width, .entry-content > .wp-block-button.aligncenter, hr.wp-block-separator.is-style-wide, .entry-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator):not(.wp-block-button):not(.entry-attachment),
.entry-content > *:not(.wp-block-button),
.entry-content [class*="inner-container"] > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator), .entry-content .wp-audio-shortcode, .post-navigation, .pagination {
max-width: calc( 782px - 32px);
}
}

@media only screen and (min-width: 1024px) {
.responsive-max-width, .entry-content > .wp-block-button.aligncenter, .wp-block-pullquote.is-style-solid-color:not(.alignleft):not(.alignright) blockquote, .wp-block-pullquote.alignwide > p,
.wp-block-pullquote.alignfull > p,
.wp-block-pullquote.alignwide blockquote,
.wp-block-pullquote.alignfull blockquote, hr.wp-block-separator.is-style-wide, .entry-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator):not(.wp-block-button):not(.entry-attachment),
.responsive-max-width, .entry-content > .wp-block-button.aligncenter, hr.wp-block-separator.is-style-wide, .entry-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator):not(.wp-block-button):not(.entry-attachment),
.entry-content > *:not(.wp-block-button),
.entry-content [class*="inner-container"] > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator), .entry-content .wp-audio-shortcode, .post-navigation, .pagination {
max-width: calc( 782px - 32px);
}
}

@media only screen and (min-width: 1280px) {
.responsive-max-width, .entry-content > .wp-block-button.aligncenter, .wp-block-pullquote.is-style-solid-color:not(.alignleft):not(.alignright) blockquote, .wp-block-pullquote.alignwide > p,
.wp-block-pullquote.alignfull > p,
.wp-block-pullquote.alignwide blockquote,
.wp-block-pullquote.alignfull blockquote, hr.wp-block-separator.is-style-wide, .entry-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator):not(.wp-block-button):not(.entry-attachment),
.responsive-max-width, .entry-content > .wp-block-button.aligncenter, hr.wp-block-separator.is-style-wide, .entry-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator):not(.wp-block-button):not(.entry-attachment),
.entry-content > *:not(.wp-block-button),
.entry-content [class*="inner-container"] > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator), .entry-content .wp-audio-shortcode, .post-navigation, .pagination {
max-width: calc( 782px - 32px);
Expand Down
Loading