From 93ce3196183a26faaa293742e88ce5226a8b2f78 Mon Sep 17 00:00:00 2001 From: Guillaume Cornut Date: Thu, 10 Jul 2025 12:59:02 +0200 Subject: [PATCH 1/2] fix(popover): fix popper warning on margin style from visually-hidden --- CHANGELOG.md | 4 ++++ packages/lumx-core/src/scss/core/base/_helpers.scss | 5 +++++ 2 files changed, 9 insertions(+) diff --git a/CHANGELOG.md b/CHANGELOG.md index 201ea7029..16f2d3d56 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -7,6 +7,10 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 ## [Unreleased] +### Fixed + +- `Popover` & `Tooltip`: fix popper warning on margin style applied by class `.visually-hidden`. + ## [3.15.0][] - 2025-07-02 ### Fixed diff --git a/packages/lumx-core/src/scss/core/base/_helpers.scss b/packages/lumx-core/src/scss/core/base/_helpers.scss index 0cad73d1b..4658cbaec 100644 --- a/packages/lumx-core/src/scss/core/base/_helpers.scss +++ b/packages/lumx-core/src/scss/core/base/_helpers.scss @@ -33,3 +33,8 @@ clip: rect(0 0 0 0) !important; border: 0 !important; } + +/** Need to remove the margin style on popper elements or else we get warnings in the console */ +.lumx-popover.visually-hidden, .lumx-tooltip.visually-hidden { + margin: revert !important; +} From 483fa34aced2c425adbc0d420f28b560e1d72ad7 Mon Sep 17 00:00:00 2001 From: Guillaume Cornut Date: Thu, 10 Jul 2025 15:26:48 +0200 Subject: [PATCH 2/2] fix(thumbnail): fix console warning on img overflow style --- CHANGELOG.md | 1 + packages/lumx-core/src/scss/components/thumbnail/_index.scss | 2 +- 2 files changed, 2 insertions(+), 1 deletion(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 16f2d3d56..6a786fd7b 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -10,6 +10,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 ### Fixed - `Popover` & `Tooltip`: fix popper warning on margin style applied by class `.visually-hidden`. +- `Thumbnail`: fix console warning on img overflow style. ## [3.15.0][] - 2025-07-02 diff --git a/packages/lumx-core/src/scss/components/thumbnail/_index.scss b/packages/lumx-core/src/scss/components/thumbnail/_index.scss index 283ace924..59e535635 100644 --- a/packages/lumx-core/src/scss/components/thumbnail/_index.scss +++ b/packages/lumx-core/src/scss/components/thumbnail/_index.scss @@ -116,7 +116,7 @@ // When using object-fit:cover + ratio 1/1, Chrome switches to pixelated downsizing algo // https://stackoverflow.com/a/77059936 // The following prevent this so the image is correctly downsized using blurring effect - overflow-clip-margin: unset; + translate: 0 0 0.01px; @supports not (aspect-ratio: 1 / 1) { position: absolute;