From 8a27516372a6393bf7d3704fa50d73f6317a0221 Mon Sep 17 00:00:00 2001 From: Amit Raj Date: Thu, 13 Jun 2024 22:10:23 +0530 Subject: [PATCH 1/5] Add inline-block display to image and media-text image --- packages/block-library/src/image/style.scss | 5 +++++ packages/block-library/src/media-text/style.scss | 4 ++++ 2 files changed, 9 insertions(+) diff --git a/packages/block-library/src/image/style.scss b/packages/block-library/src/image/style.scss index 40ffe0cd0e61c..a1e63ca770c4d 100644 --- a/packages/block-library/src/image/style.scss +++ b/packages/block-library/src/image/style.scss @@ -1,4 +1,9 @@ .wp-block-image { + + > a { + display: inline-block; + } + img { height: auto; max-width: 100%; diff --git a/packages/block-library/src/media-text/style.scss b/packages/block-library/src/media-text/style.scss index d24ef46409323..2828ea507f53b 100644 --- a/packages/block-library/src/media-text/style.scss +++ b/packages/block-library/src/media-text/style.scss @@ -12,6 +12,10 @@ &.has-media-on-the-right { grid-template-columns: 1fr 50%; } + + &__media > a { + display: inline-block; + } } .wp-block-media-text.is-vertically-aligned-top { From 876b71338ebb1d9160b04bbcf406de3a58e0ab79 Mon Sep 17 00:00:00 2001 From: Amit Raj Date: Wed, 19 Jun 2024 15:00:07 +0530 Subject: [PATCH 2/5] Add display:block to image's tag --- packages/block-library/src/image/style.scss | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/block-library/src/image/style.scss b/packages/block-library/src/image/style.scss index a1e63ca770c4d..913cf48b905b3 100644 --- a/packages/block-library/src/image/style.scss +++ b/packages/block-library/src/image/style.scss @@ -1,7 +1,7 @@ .wp-block-image { > a { - display: inline-block; + display: block; } img { From aae8bdc0c008c77557b7efff70a5c4814188ef01 Mon Sep 17 00:00:00 2001 From: Amit Raj Date: Wed, 19 Jun 2024 21:35:10 +0530 Subject: [PATCH 3/5] Addressed feedback --- packages/block-library/src/image/style.scss | 7 ++++++- 1 file changed, 6 insertions(+), 1 deletion(-) diff --git a/packages/block-library/src/image/style.scss b/packages/block-library/src/image/style.scss index 913cf48b905b3..f88278b11f06d 100644 --- a/packages/block-library/src/image/style.scss +++ b/packages/block-library/src/image/style.scss @@ -1,7 +1,7 @@ .wp-block-image { > a { - display: block; + display: inline-block; } img { @@ -11,6 +11,11 @@ box-sizing: border-box; } + &.alignfull a, + &.alignwide a { + width: 100%; + } + // The following style maintains border radius application for deprecated // image blocks that applied border radius to the outer `figure` element. // From f3801882cab41603590ea004079e262929896758 Mon Sep 17 00:00:00 2001 From: Amit Raj Date: Wed, 19 Jun 2024 21:38:20 +0530 Subject: [PATCH 4/5] Fix linting --- packages/block-library/src/image/style.scss | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/packages/block-library/src/image/style.scss b/packages/block-library/src/image/style.scss index f88278b11f06d..fadb52e594af8 100644 --- a/packages/block-library/src/image/style.scss +++ b/packages/block-library/src/image/style.scss @@ -1,6 +1,6 @@ .wp-block-image { - > a { + a { display: inline-block; } @@ -11,11 +11,6 @@ box-sizing: border-box; } - &.alignfull a, - &.alignwide a { - width: 100%; - } - // The following style maintains border radius application for deprecated // image blocks that applied border radius to the outer `figure` element. // @@ -37,6 +32,11 @@ text-align: center; } + &.alignfull a, + &.alignwide a { + width: 100%; + } + &.alignfull img, &.alignwide img { height: auto; From 5a6edd9557772a3d22b7a89fa99c3a7138e2ce16 Mon Sep 17 00:00:00 2001 From: Amit Raj Date: Thu, 20 Jun 2024 10:50:53 +0530 Subject: [PATCH 5/5] Change syntax for .wp-block-media-text__media a CSS --- packages/block-library/src/media-text/style.scss | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/packages/block-library/src/media-text/style.scss b/packages/block-library/src/media-text/style.scss index 2828ea507f53b..de020611b36ce 100644 --- a/packages/block-library/src/media-text/style.scss +++ b/packages/block-library/src/media-text/style.scss @@ -12,10 +12,6 @@ &.has-media-on-the-right { grid-template-columns: 1fr 50%; } - - &__media > a { - display: inline-block; - } } .wp-block-media-text.is-vertically-aligned-top { @@ -72,6 +68,10 @@ /*!rtl:end:ignore*/ } +.wp-block-media-text__media a { + display: inline-block; +} + .wp-block-media-text__media img, .wp-block-media-text__media video { height: auto;