diff --git a/libs/blocks/aside/aside.css b/libs/blocks/aside/aside.css index 54615ee978..92b187dfe7 100644 --- a/libs/blocks/aside/aside.css +++ b/libs/blocks/aside/aside.css @@ -752,7 +752,7 @@ } .aside .split-image .modal-img-link, - .aside.split .split-image img, + .aside.split .split-image img:not(.accessibility-control), .aside.split .split-image video { width: 50vw; position: absolute; diff --git a/libs/blocks/carousel/carousel.js b/libs/blocks/carousel/carousel.js index 4bb57f7180..f9731a4c4e 100644 --- a/libs/blocks/carousel/carousel.js +++ b/libs/blocks/carousel/carousel.js @@ -1,5 +1,5 @@ import { createTag, getConfig, MILO_EVENTS } from '../../utils/utils.js'; -import { decorateAnchorVideo } from '../../utils/decorate.js'; +import { decorateAnchorVideo, syncPausePlayIcon } from '../../utils/decorate.js'; const { miloLibs, codeRoot } = getConfig(); const base = miloLibs || codeRoot; @@ -134,8 +134,9 @@ function jumpToDirection(activeSlideIndex, jumpToIndex, slideContainer) { function checkSlideForVideo(activeSlide) { const video = activeSlide.querySelector('video'); /* c8 ignore start */ - if (video?.played.length > 0) { + if (video?.played.length > 0 && !video?.paused) { video.pause(); + syncPausePlayIcon(video); } /* c8 ignore end */ } diff --git a/libs/blocks/video/video.css b/libs/blocks/video/video.css index 6538e0596a..2db29cd495 100644 --- a/libs/blocks/video/video.css +++ b/libs/blocks/video/video.css @@ -112,8 +112,11 @@ video { position: inherit; } -:is(.video-container .pause-play-wrapper, .aside.split.split-left .split-image) img.accessibility-control { - width: auto; +:is(.video-container .pause-play-wrapper, .aside.split.split-left .split-image) img.accessibility-control, +.brick.split.row.media-right .foreground .brick-media img.accessibility-control { + width: inherit; + height: inherit; + margin: 0; } .video-container .pause-play-wrapper img.hidden {