From 069307c37ed1b180df36b5e7314910bbb3e7c5a3 Mon Sep 17 00:00:00 2001 From: Scott Vandehey Date: Fri, 15 Jul 2022 15:17:18 -0700 Subject: [PATCH 1/2] Bugfix: Prevent Embedded Video Clipping in Safari This PR addresses a bug where iframe video players like YouTube or Vimeo used in an Embed object would offset to the left when playing in Safari, resulting in the left side of the player being cut off. Fixes #828 --- src/mixins/_ratio-box.scss | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/src/mixins/_ratio-box.scss b/src/mixins/_ratio-box.scss index 178817692..cd574340a 100644 --- a/src/mixins/_ratio-box.scss +++ b/src/mixins/_ratio-box.scss @@ -39,9 +39,13 @@ $aspect-ratio-map: meta.module-variables('aspect-ratio'); inline-size: 100%; inset-block-start: 0; inset-inline-start: 0; + position: absolute; + } + + > img, + > picture > img { object-fit: cover; object-position: center; - position: absolute; } } From 516eb02551eb66e7717a7e1c51b607818bf3e7b2 Mon Sep 17 00:00:00 2001 From: Scott Vandehey Date: Fri, 15 Jul 2022 15:28:11 -0700 Subject: [PATCH 2/2] Create fuzzy-stingrays-begin.md --- .changeset/fuzzy-stingrays-begin.md | 5 +++++ 1 file changed, 5 insertions(+) create mode 100644 .changeset/fuzzy-stingrays-begin.md diff --git a/.changeset/fuzzy-stingrays-begin.md b/.changeset/fuzzy-stingrays-begin.md new file mode 100644 index 000000000..12c13b622 --- /dev/null +++ b/.changeset/fuzzy-stingrays-begin.md @@ -0,0 +1,5 @@ +--- +"@cloudfour/patterns": patch +--- + +Bugfix: Prevent Embed videos from clipping in Safari