From fbe764b18e00818dcdaad9f7aae6419270eed5ac Mon Sep 17 00:00:00 2001 From: girishpanchal30 Date: Mon, 2 Sep 2024 17:23:04 +0530 Subject: [PATCH 1/3] fix: lightbox issue with alignment control --- assets/scss/components/main/_gutenberg.scss | 12 ++++++++++++ 1 file changed, 12 insertions(+) diff --git a/assets/scss/components/main/_gutenberg.scss b/assets/scss/components/main/_gutenberg.scss index d660ecb2d1..0f5ccf58a5 100644 --- a/assets/scss/components/main/_gutenberg.scss +++ b/assets/scss/components/main/_gutenberg.scss @@ -151,3 +151,15 @@ blockquote { } } +.wp-lightbox-overlay { + + figure { + + img { + height: var(--wp--lightbox-image-height); + min-height: var(--wp--lightbox-image-height); + min-width: var(--wp--lightbox-image-width); + width: var(--wp--lightbox-image-width); + } + } +} From 2a49c55ae458f7583d262607592034297b97f24b Mon Sep 17 00:00:00 2001 From: girishpanchal30 Date: Mon, 2 Sep 2024 17:27:09 +0530 Subject: [PATCH 2/3] fix: css build size --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 84eef25bee..7f4feaffae 100644 --- a/package.json +++ b/package.json @@ -42,7 +42,7 @@ "gzip": false, "running": false, "webpack": false, - "limit": "38.1 KB", + "limit": "38.3 KB", "path": "style-main-new.min.css" } ], From 9afa3f42d5d982959adb423bd0ed962a261f24eb Mon Sep 17 00:00:00 2001 From: girishpanchal30 Date: Tue, 3 Sep 2024 10:58:16 +0530 Subject: [PATCH 3/3] fix: add inline style instead of increasing css size --- assets/scss/components/main/_gutenberg.scss | 13 --------- inc/views/template_parts.php | 30 +++++++++++++++++++++ package.json | 2 +- 3 files changed, 31 insertions(+), 14 deletions(-) diff --git a/assets/scss/components/main/_gutenberg.scss b/assets/scss/components/main/_gutenberg.scss index 0f5ccf58a5..585efdb986 100644 --- a/assets/scss/components/main/_gutenberg.scss +++ b/assets/scss/components/main/_gutenberg.scss @@ -150,16 +150,3 @@ blockquote { margin-right: calc(50% - 35vw); } } - -.wp-lightbox-overlay { - - figure { - - img { - height: var(--wp--lightbox-image-height); - min-height: var(--wp--lightbox-image-height); - min-width: var(--wp--lightbox-image-width); - width: var(--wp--lightbox-image-width); - } - } -} diff --git a/inc/views/template_parts.php b/inc/views/template_parts.php index 1bffef416e..f33b879482 100644 --- a/inc/views/template_parts.php +++ b/inc/views/template_parts.php @@ -36,6 +36,7 @@ class Template_Parts extends Base_View { public function init() { add_action( 'wp_enqueue_scripts', array( $this, 'add_featured_post_style' ) ); add_action( 'wp_enqueue_scripts', array( $this, 'add_vertical_spacing_style' ) ); + add_action( 'wp_enqueue_scripts', array( $this, 'add_lightbox_style' ) ); add_action( 'neve_do_featured_post', array( $this, 'render_featured_post' ) ); add_action( 'neve_blog_post_template_part_content', array( $this, 'render_post' ) ); add_filter( 'excerpt_more', array( $this, 'link_excerpt_more' ) ); @@ -552,4 +553,33 @@ public function get_ordered_components( $associative = false ) { return json_decode( get_theme_mod( 'neve_post_content_ordering', wp_json_encode( $default_ordered_components ) ), $associative ); } + + /** + * Add inline lightbox style if the post content includes an image block with lightbox. + */ + public function add_lightbox_style() { + global $post; + if ( ! has_block( 'core/image', $post ) ) { + return; + } + $blocks = parse_blocks( $post->post_content ); + $blocks = array_filter( + $blocks, + function( $block ) { + return 'core/image' === $block['blockName'] && ! empty( $block['attrs']['lightbox']['enabled'] ); + } + ); + if ( empty( $blocks ) ) { + return; + } + $inline_style = ' + .wp-lightbox-overlay figure img { + height: var(--wp--lightbox-image-height); + min-height: var(--wp--lightbox-image-height); + min-width: var(--wp--lightbox-image-width); + width: var(--wp--lightbox-image-width); + } + '; + wp_add_inline_style( 'neve-style', Dynamic_Css::minify_css( $inline_style ) ); + } } diff --git a/package.json b/package.json index 7f4feaffae..84eef25bee 100644 --- a/package.json +++ b/package.json @@ -42,7 +42,7 @@ "gzip": false, "running": false, "webpack": false, - "limit": "38.3 KB", + "limit": "38.1 KB", "path": "style-main-new.min.css" } ],