From 141a77c79bbfa3eac72857f3538417bca9a882be Mon Sep 17 00:00:00 2001 From: Anders Date: Tue, 12 Nov 2019 12:47:22 +0100 Subject: [PATCH 1/3] Reimplemented Template: Full Width with the new entry content structure --- style-rtl.css | 81 +++++++++++++++++++++++++++++++++++++++++--- style.css | 93 ++++++++++++++++++++++++++++++++++++++++++++++++--- 2 files changed, 164 insertions(+), 10 deletions(-) diff --git a/style-rtl.css b/style-rtl.css index 06062b071..1c14f4a78 100644 --- a/style-rtl.css +++ b/style-rtl.css @@ -2244,18 +2244,50 @@ body.template-cover .entry-header { /* 7c. Template: Full Width /* -------------------------------------------------------------------------- */ -body.template-full-width .entry-content { - max-width: none; + +body.template-full-width .entry-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.is-style-wide), +body.template-full-width [class*="__inner-container"] > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.is-style-wide) { + max-width: 120rem; +} + +body.template-full-width .entry-content .alignleft, +body.template-full-width .entry-content .alignright { + position: static; } -body.template-full-width .entry-content .alignleft { +body.template-full-width .entry-content .alignleft, +body.template-full-width [class*="wp-block"].alignwide [class*="__inner-container"] > .alignleft, +body.template-full-width [class*="wp-block"].alignwide [class*="__inner-container"] > p .alignleft, +body.template-full-width [class*="wp-block"].alignwide [class*="__inner-container"] > .wp-block-image .alignleft { margin-left: 0; + position: static; } -body.template-full-width .entry-content .alignright { +body.template-full-width .entry-content > .alignleft, +body.template-full-width [class*="wp-block"].alignfull [class*="__inner-container"] > .alignleft, +body.template-full-width [class*="wp-block"].alignfull [class*="__inner-container"] > p .alignleft, +body.template-full-width [class*="wp-block"].alignfull [class*="__inner-container"] > .wp-block-image .alignleft { + margin-left: 2rem; + position: static; +} + +body.template-full-width .entry-content .alignright, +body.template-full-width [class*="wp-block"].alignwide [class*="__inner-container"] > .alignright, +body.template-full-width [class*="wp-block"].alignwide [class*="__inner-container"] > p .alignright, +body.template-full-width [class*="wp-block"].alignwide [class*="__inner-container"] > .wp-block-image .alignright { margin-right: 0; + position: static; +} + +body.template-full-width .entry-content > .alignright, +body.template-full-width [class*="wp-block"].alignfull [class*="__inner-container"] > .alignright, +body.template-full-width [class*="wp-block"].alignfull [class*="__inner-container"] > p .alignright, +body.template-full-width [class*="wp-block"].alignfull [class*="__inner-container"] > .wp-block-image .alignright { + margin-right: 2rem; + position: static; } + /* -------------------------------------------------------------------------- */ /* 8. Post: Archive @@ -3102,7 +3134,7 @@ figure.wp-block-gallery.alignfull { .wp-block-pullquote.alignleft, .wp-block-pullquote.alignright { - max-width: 100%; + max-width: calc( 100% - 4rem ); } .wp-block-pullquote::before { @@ -4424,6 +4456,7 @@ a.to-the-top > * { .alignright { max-width: 26rem; } + } @media ( max-width: 599px ) { @@ -4804,6 +4837,29 @@ a.to-the-top > * { width: 2.12rem; } + /* Template: Full Width ------------------ */ + + body.template-full-width .entry-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.is-style-wide) { + width: calc( 100% - 8rem ); + } + + body.template-full-width .alignfull:not(.has-background) > .wp-block-group__inner-container > p:not(.has-background-color) { + padding-right: 4rem; + padding-left: 4rem; + } + + body.template-full-width [class*="wp-block"].alignfull [class*="__inner-container"] > .alignleft, + body.template-full-width [class*="wp-block"].alignfull [class*="__inner-container"] > p .alignleft, + body.template-full-width [class*="wp-block"].alignfull [class*="__inner-container"] > .wp-block-image .alignleft { + margin-left: 4rem; + } + + body.template-full-width [class*="wp-block"].alignfull [class*="__inner-container"] > .alignright, + body.template-full-width [class*="wp-block"].alignfull [class*="__inner-container"] > p .alignright, + body.template-full-width [class*="wp-block"].alignfull [class*="__inner-container"] > .wp-block-image .alignright { + margin-right: 4rem; + } + /* Post: Archive ------------------------- */ .archive-header { @@ -5948,6 +6004,21 @@ a.to-the-top > * { } +@media ( min-width: 1240px ) { + + + /* Blocks -------------------------------- */ + + body.template-full-width .entry-content > .alignleft { + margin-left: calc(( 100vw - 120rem ) / 2); + } + + body.template-full-width .entry-content > .alignright { + margin-right: calc(( 100vw - 120rem ) / 2); + } + +} + @media ( min-width: 1280px ) { /* Blocks -------------------------------- */ diff --git a/style.css b/style.css index 2fdbb2fa2..4cc777975 100644 --- a/style.css +++ b/style.css @@ -2252,22 +2252,58 @@ body.template-cover .entry-header { /* 7c. Template: Full Width /* -------------------------------------------------------------------------- */ -body.template-full-width .entry-content { - max-width: none; + +body.template-full-width .entry-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.is-style-wide), +body.template-full-width [class*="__inner-container"] > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.is-style-wide) { + max-width: 120rem; +} + +body.template-full-width .entry-content .alignleft, +body.template-full-width .entry-content .alignright { + position: static; } -body.template-full-width .entry-content .alignleft { +body.template-full-width .entry-content .alignleft, +body.template-full-width [class*="wp-block"].alignwide [class*="__inner-container"] > .alignleft, +body.template-full-width [class*="wp-block"].alignwide [class*="__inner-container"] > p .alignleft, +body.template-full-width [class*="wp-block"].alignwide [class*="__inner-container"] > .wp-block-image .alignleft { /*rtl:ignore*/ margin-left: 0; + position: static; } -body.template-full-width .entry-content .alignright { +body.template-full-width .entry-content > .alignleft, +body.template-full-width [class*="wp-block"].alignfull [class*="__inner-container"] > .alignleft, +body.template-full-width [class*="wp-block"].alignfull [class*="__inner-container"] > p .alignleft, +body.template-full-width [class*="wp-block"].alignfull [class*="__inner-container"] > .wp-block-image .alignleft { + + /*rtl:ignore*/ + margin-left: 2rem; + position: static; +} + +body.template-full-width .entry-content .alignright, +body.template-full-width [class*="wp-block"].alignwide [class*="__inner-container"] > .alignright, +body.template-full-width [class*="wp-block"].alignwide [class*="__inner-container"] > p .alignright, +body.template-full-width [class*="wp-block"].alignwide [class*="__inner-container"] > .wp-block-image .alignright { /*rtl:ignore*/ margin-right: 0; + position: static; } +body.template-full-width .entry-content > .alignright, +body.template-full-width [class*="wp-block"].alignfull [class*="__inner-container"] > .alignright, +body.template-full-width [class*="wp-block"].alignfull [class*="__inner-container"] > p .alignright, +body.template-full-width [class*="wp-block"].alignfull [class*="__inner-container"] > .wp-block-image .alignright { + + /*rtl:ignore*/ + margin-right: 2rem; + position: static; +} + + /* -------------------------------------------------------------------------- */ /* 8. Post: Archive @@ -3116,7 +3152,7 @@ figure.wp-block-gallery.alignfull { .wp-block-pullquote.alignleft, .wp-block-pullquote.alignright { - max-width: 100%; + max-width: calc( 100% - 4rem ); } .wp-block-pullquote::before { @@ -4446,6 +4482,7 @@ a.to-the-top > * { .alignright { max-width: 26rem; } + } @media ( max-width: 599px ) { @@ -4838,6 +4875,33 @@ a.to-the-top > * { width: 2.12rem; } + /* Template: Full Width ------------------ */ + + body.template-full-width .entry-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.is-style-wide) { + width: calc( 100% - 8rem ); + } + + body.template-full-width .alignfull:not(.has-background) > .wp-block-group__inner-container > p:not(.has-background-color) { + padding-left: 4rem; + padding-right: 4rem; + } + + body.template-full-width [class*="wp-block"].alignfull [class*="__inner-container"] > .alignleft, + body.template-full-width [class*="wp-block"].alignfull [class*="__inner-container"] > p .alignleft, + body.template-full-width [class*="wp-block"].alignfull [class*="__inner-container"] > .wp-block-image .alignleft { + + /*rtl:ignore*/ + margin-left: 4rem; + } + + body.template-full-width [class*="wp-block"].alignfull [class*="__inner-container"] > .alignright, + body.template-full-width [class*="wp-block"].alignfull [class*="__inner-container"] > p .alignright, + body.template-full-width [class*="wp-block"].alignfull [class*="__inner-container"] > .wp-block-image .alignright { + + /*rtl:ignore*/ + margin-right: 4rem; + } + /* Post: Archive ------------------------- */ .archive-header { @@ -5986,6 +6050,25 @@ a.to-the-top > * { } +@media ( min-width: 1240px ) { + + + /* Blocks -------------------------------- */ + + body.template-full-width .entry-content > .alignleft { + + /*rtl:ignore*/ + margin-left: calc(( 100vw - 120rem ) / 2); + } + + body.template-full-width .entry-content > .alignright { + + /*rtl:ignore*/ + margin-right: calc(( 100vw - 120rem ) / 2); + } + +} + @media ( min-width: 1280px ) { /* Blocks -------------------------------- */ From 347c439cf8d9af58f81d170947e2de4fd92c7bf7 Mon Sep 17 00:00:00 2001 From: Anders Date: Tue, 12 Nov 2019 13:02:00 +0100 Subject: [PATCH 2/3] Travis fixes --- style-rtl.css | 32 +++++++++++++++----------------- style.css | 32 +++++++++++++++----------------- 2 files changed, 30 insertions(+), 34 deletions(-) diff --git a/style-rtl.css b/style-rtl.css index a904e86b7..eee492d93 100644 --- a/style-rtl.css +++ b/style-rtl.css @@ -2260,32 +2260,32 @@ body.template-full-width .entry-content .alignright { } body.template-full-width .entry-content .alignleft, -body.template-full-width [class*="wp-block"].alignwide [class*="__inner-container"] > .alignleft, -body.template-full-width [class*="wp-block"].alignwide [class*="__inner-container"] > p .alignleft, +body.template-full-width [class*="wp-block"].alignwide [class*="__inner-container"] > .alignleft, +body.template-full-width [class*="wp-block"].alignwide [class*="__inner-container"] > p .alignleft, body.template-full-width [class*="wp-block"].alignwide [class*="__inner-container"] > .wp-block-image .alignleft { margin-left: 0; position: static; } body.template-full-width .entry-content > .alignleft, -body.template-full-width [class*="wp-block"].alignfull [class*="__inner-container"] > .alignleft, -body.template-full-width [class*="wp-block"].alignfull [class*="__inner-container"] > p .alignleft, +body.template-full-width [class*="wp-block"].alignfull [class*="__inner-container"] > .alignleft, +body.template-full-width [class*="wp-block"].alignfull [class*="__inner-container"] > p .alignleft, body.template-full-width [class*="wp-block"].alignfull [class*="__inner-container"] > .wp-block-image .alignleft { margin-left: 2rem; position: static; } body.template-full-width .entry-content .alignright, -body.template-full-width [class*="wp-block"].alignwide [class*="__inner-container"] > .alignright, -body.template-full-width [class*="wp-block"].alignwide [class*="__inner-container"] > p .alignright, +body.template-full-width [class*="wp-block"].alignwide [class*="__inner-container"] > .alignright, +body.template-full-width [class*="wp-block"].alignwide [class*="__inner-container"] > p .alignright, body.template-full-width [class*="wp-block"].alignwide [class*="__inner-container"] > .wp-block-image .alignright { margin-right: 0; position: static; } body.template-full-width .entry-content > .alignright, -body.template-full-width [class*="wp-block"].alignfull [class*="__inner-container"] > .alignright, -body.template-full-width [class*="wp-block"].alignfull [class*="__inner-container"] > p .alignright, +body.template-full-width [class*="wp-block"].alignfull [class*="__inner-container"] > .alignright, +body.template-full-width [class*="wp-block"].alignfull [class*="__inner-container"] > p .alignright, body.template-full-width [class*="wp-block"].alignfull [class*="__inner-container"] > .wp-block-image .alignright { margin-right: 2rem; position: static; @@ -3138,7 +3138,7 @@ figure.wp-block-gallery.alignfull { .wp-block-pullquote.alignleft, .wp-block-pullquote.alignright { - max-width: calc( 100% - 4rem ); + max-width: calc(100% - 4rem); } .wp-block-pullquote::before { @@ -4460,7 +4460,6 @@ a.to-the-top > * { .alignright { max-width: 26rem; } - } @media ( max-width: 599px ) { @@ -4844,7 +4843,7 @@ a.to-the-top > * { /* Template: Full Width ------------------ */ body.template-full-width .entry-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.is-style-wide) { - width: calc( 100% - 8rem ); + width: calc(100% - 8rem); } body.template-full-width .alignfull:not(.has-background) > .wp-block-group__inner-container > p:not(.has-background-color) { @@ -4852,14 +4851,14 @@ a.to-the-top > * { padding-left: 4rem; } - body.template-full-width [class*="wp-block"].alignfull [class*="__inner-container"] > .alignleft, - body.template-full-width [class*="wp-block"].alignfull [class*="__inner-container"] > p .alignleft, + body.template-full-width [class*="wp-block"].alignfull [class*="__inner-container"] > .alignleft, + body.template-full-width [class*="wp-block"].alignfull [class*="__inner-container"] > p .alignleft, body.template-full-width [class*="wp-block"].alignfull [class*="__inner-container"] > .wp-block-image .alignleft { margin-left: 4rem; } - body.template-full-width [class*="wp-block"].alignfull [class*="__inner-container"] > .alignright, - body.template-full-width [class*="wp-block"].alignfull [class*="__inner-container"] > p .alignright, + body.template-full-width [class*="wp-block"].alignfull [class*="__inner-container"] > .alignright, + body.template-full-width [class*="wp-block"].alignfull [class*="__inner-container"] > p .alignright, body.template-full-width [class*="wp-block"].alignfull [class*="__inner-container"] > .wp-block-image .alignright { margin-right: 4rem; } @@ -6019,8 +6018,7 @@ a.to-the-top > * { body.template-full-width .entry-content > .alignright { margin-right: calc(( 100vw - 120rem ) / 2); - } - + } } @media ( min-width: 1280px ) { diff --git a/style.css b/style.css index a9e5cedd2..02bb55e20 100644 --- a/style.css +++ b/style.css @@ -2268,8 +2268,8 @@ body.template-full-width .entry-content .alignright { } body.template-full-width .entry-content .alignleft, -body.template-full-width [class*="wp-block"].alignwide [class*="__inner-container"] > .alignleft, -body.template-full-width [class*="wp-block"].alignwide [class*="__inner-container"] > p .alignleft, +body.template-full-width [class*="wp-block"].alignwide [class*="__inner-container"] > .alignleft, +body.template-full-width [class*="wp-block"].alignwide [class*="__inner-container"] > p .alignleft, body.template-full-width [class*="wp-block"].alignwide [class*="__inner-container"] > .wp-block-image .alignleft { /*rtl:ignore*/ @@ -2278,8 +2278,8 @@ body.template-full-width [class*="wp-block"].alignwide [class*="__inner-containe } body.template-full-width .entry-content > .alignleft, -body.template-full-width [class*="wp-block"].alignfull [class*="__inner-container"] > .alignleft, -body.template-full-width [class*="wp-block"].alignfull [class*="__inner-container"] > p .alignleft, +body.template-full-width [class*="wp-block"].alignfull [class*="__inner-container"] > .alignleft, +body.template-full-width [class*="wp-block"].alignfull [class*="__inner-container"] > p .alignleft, body.template-full-width [class*="wp-block"].alignfull [class*="__inner-container"] > .wp-block-image .alignleft { /*rtl:ignore*/ @@ -2288,8 +2288,8 @@ body.template-full-width [class*="wp-block"].alignfull [class*="__inner-containe } body.template-full-width .entry-content .alignright, -body.template-full-width [class*="wp-block"].alignwide [class*="__inner-container"] > .alignright, -body.template-full-width [class*="wp-block"].alignwide [class*="__inner-container"] > p .alignright, +body.template-full-width [class*="wp-block"].alignwide [class*="__inner-container"] > .alignright, +body.template-full-width [class*="wp-block"].alignwide [class*="__inner-container"] > p .alignright, body.template-full-width [class*="wp-block"].alignwide [class*="__inner-container"] > .wp-block-image .alignright { /*rtl:ignore*/ @@ -2298,8 +2298,8 @@ body.template-full-width [class*="wp-block"].alignwide [class*="__inner-containe } body.template-full-width .entry-content > .alignright, -body.template-full-width [class*="wp-block"].alignfull [class*="__inner-container"] > .alignright, -body.template-full-width [class*="wp-block"].alignfull [class*="__inner-container"] > p .alignright, +body.template-full-width [class*="wp-block"].alignfull [class*="__inner-container"] > .alignright, +body.template-full-width [class*="wp-block"].alignfull [class*="__inner-container"] > p .alignright, body.template-full-width [class*="wp-block"].alignfull [class*="__inner-container"] > .wp-block-image .alignright { /*rtl:ignore*/ @@ -3156,7 +3156,7 @@ figure.wp-block-gallery.alignfull { .wp-block-pullquote.alignleft, .wp-block-pullquote.alignright { - max-width: calc( 100% - 4rem ); + max-width: calc(100% - 4rem); } .wp-block-pullquote::before { @@ -4486,7 +4486,6 @@ a.to-the-top > * { .alignright { max-width: 26rem; } - } @media ( max-width: 599px ) { @@ -4882,7 +4881,7 @@ a.to-the-top > * { /* Template: Full Width ------------------ */ body.template-full-width .entry-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.is-style-wide) { - width: calc( 100% - 8rem ); + width: calc(100% - 8rem); } body.template-full-width .alignfull:not(.has-background) > .wp-block-group__inner-container > p:not(.has-background-color) { @@ -4890,16 +4889,16 @@ a.to-the-top > * { padding-right: 4rem; } - body.template-full-width [class*="wp-block"].alignfull [class*="__inner-container"] > .alignleft, - body.template-full-width [class*="wp-block"].alignfull [class*="__inner-container"] > p .alignleft, + body.template-full-width [class*="wp-block"].alignfull [class*="__inner-container"] > .alignleft, + body.template-full-width [class*="wp-block"].alignfull [class*="__inner-container"] > p .alignleft, body.template-full-width [class*="wp-block"].alignfull [class*="__inner-container"] > .wp-block-image .alignleft { /*rtl:ignore*/ margin-left: 4rem; } - body.template-full-width [class*="wp-block"].alignfull [class*="__inner-container"] > .alignright, - body.template-full-width [class*="wp-block"].alignfull [class*="__inner-container"] > p .alignright, + body.template-full-width [class*="wp-block"].alignfull [class*="__inner-container"] > .alignright, + body.template-full-width [class*="wp-block"].alignfull [class*="__inner-container"] > p .alignright, body.template-full-width [class*="wp-block"].alignfull [class*="__inner-container"] > .wp-block-image .alignright { /*rtl:ignore*/ @@ -6069,8 +6068,7 @@ a.to-the-top > * { /*rtl:ignore*/ margin-right: calc(( 100vw - 120rem ) / 2); - } - + } } @media ( min-width: 1280px ) { From 5284f5b3a24d4745ec4e9f6489375d1c1edc97b7 Mon Sep 17 00:00:00 2001 From: Anders Date: Tue, 12 Nov 2019 13:23:08 +0100 Subject: [PATCH 3/3] Travis fix --- style-rtl.css | 3 ++- style.css | 3 ++- 2 files changed, 4 insertions(+), 2 deletions(-) diff --git a/style-rtl.css b/style-rtl.css index eee492d93..f33c63a25 100644 --- a/style-rtl.css +++ b/style-rtl.css @@ -6018,7 +6018,8 @@ a.to-the-top > * { body.template-full-width .entry-content > .alignright { margin-right: calc(( 100vw - 120rem ) / 2); - } + } + } @media ( min-width: 1280px ) { diff --git a/style.css b/style.css index 02bb55e20..9a4a8f13c 100644 --- a/style.css +++ b/style.css @@ -6068,7 +6068,8 @@ a.to-the-top > * { /*rtl:ignore*/ margin-right: calc(( 100vw - 120rem ) / 2); - } + } + } @media ( min-width: 1280px ) {