From f94eb2b85264812ee6c2f2702bf2c3656f6671ea Mon Sep 17 00:00:00 2001
From: Rocco Aliberti <raliberti84@gmail.com>
Date: Wed, 24 Oct 2018 17:43:35 +0200
Subject: [PATCH] Imp: gutenberg cover image alignwide/alignfull compatibility
 CSS part for #1601

---
 assets/front/scss/0_4_layout/_article.scss | 59 ++++++++++++++++++++++
 core/class-fire-init.php                   |  9 ++--
 core/class-fire-resources_styles.php       |  2 +-
 3 files changed, 65 insertions(+), 5 deletions(-)

diff --git a/assets/front/scss/0_4_layout/_article.scss b/assets/front/scss/0_4_layout/_article.scss
index 05b78a7a2..31ea658f7 100644
--- a/assets/front/scss/0_4_layout/_article.scss
+++ b/assets/front/scss/0_4_layout/_article.scss
@@ -179,6 +179,65 @@ section[class^="post-"] {
 
 
 
+//  Gutenberg
+// cover images */
+//
+// Real alignfull and alignwide
+// allowed only in layouts with no sidebars and full-width
+// in single and singular, as our only post list grid articles showing the full content
+// look like cards (meaning that they're boxed with borders) and would make no sense there.
+.page, .single {
+    &.czr-no-sidebar {
+        // alignwide and alignfull in boxed layouts
+        // only reset the .container[role=main] horizontal padding
+        .entry-content .wp-block-cover-image {
+            &.alignfull,
+            &.alignwide {
+                margin-right: -15px;
+                margin-left: -15px;
+                clear: both;
+                width: auto;
+            }
+        }
+        &.czr-boxed-layout .entry-content .wp-block-cover-image {
+            @include media-breakpoint-up(sm) {
+                &.alignfull,
+                &.alignwide {
+                    margin-right: -30px;
+                    margin-left: -30px;
+                }
+            }
+        }
+    }
+
+    &.czr-full-layout.czr-no-sidebar {
+        #tc-page-wrap {
+            overflow-x: hidden;
+        }
+        // alignfull
+        .entry-content .wp-block-cover-image.alignfull {
+            width: 100vw;
+            max-width: 100vw;
+            position: relative;
+            margin-left: 0;
+            margin-right: 0;
+            &:not(.has-parallax) {
+                @if ( true == $is_rtl ) {
+                    right: 50%;
+                    @include transform( translateX(50%) );
+                }
+                @else {
+                    left: 50%;
+                    @include transform( translateX(-50%) );
+                }
+            }
+            &.has-parallax:not(.czr-alignfull-p) {
+                width: 100%;
+            }
+        }
+    }
+}
+
 
 
 
diff --git a/core/class-fire-init.php b/core/class-fire-init.php
index 8f3f602b9..b9fe86d3d 100644
--- a/core/class-fire-init.php
+++ b/core/class-fire-init.php
@@ -38,7 +38,7 @@ function __construct () {
           add_action( 'after_setup_theme'       , array( $this , 'czr_fn_base_customizr_setup' ));
 
           //add classes to body tag : fade effect on link hover, is_customizing. Since v3.2.0
-          add_filter('body_class'               , array( $this , 'czr_fn_set_body_classes') );
+          add_filter( 'body_class'              , array( $this , 'czr_fn_set_body_classes') );
           //Add the context
           add_filter ( 'body_class'             , 'czr_fn_set_post_list_context_class' );
 
@@ -185,9 +185,7 @@ function czr_fn_set_body_classes( $_classes ) {
           }
 
           //BOXED LAYOUT
-          if ( 'boxed' == esc_attr( czr_fn_opt( 'tc_site_layout') ) ) {
-            $_classes[] = 'czr-boxed-layout';
-          }
+          $_classes[] = ( 'boxed' == esc_attr( czr_fn_opt( 'tc_site_layout') ) ) ? 'czr-boxed-layout' : 'czr-full-layout';
 
           //SIDENAV POSITIONING
           if ( czr_fn_is_possible('sidenav') ) {
@@ -206,6 +204,9 @@ function czr_fn_set_body_classes( $_classes ) {
 
       function czr_fn_base_customizr_setup() {
           add_theme_support( 'html5', array( 'comment-form', 'caption' ) );
+          // gutenberg alignwide/full cover images.
+          add_theme_support( 'align-wide' );
+
           //tag cloud - same font size
           add_filter( 'widget_tag_cloud_args'               , array( $this, 'czr_fn_add_widget_tag_cloud_args' ));
           //tag cloud add button classes
diff --git a/core/class-fire-resources_styles.php b/core/class-fire-resources_styles.php
index f4b7e829b..452cc4724 100644
--- a/core/class-fire-resources_styles.php
+++ b/core/class-fire-resources_styles.php
@@ -686,7 +686,7 @@ function czr_fn_maybe_write_boxed_layout_inline_css( $_css ) {
                //Add some rules from sm up
                //add padding
                $css_container[]        = sprintf( '@media (min-width: %1$spx){ %2$s{ padding-right: %3$spx; padding-left:  %3$spx; } }',
-                           $css_container_widths[ 'sm' ],
+                           $css_mq_breakpoints[ 'sm' ],
                            $container_selector,
                            $additional_width
                );