From 6aed2ba72df39a544be6e1d0412cc844100ecc02 Mon Sep 17 00:00:00 2001 From: Andy Sellick Date: Tue, 12 Nov 2024 10:57:31 +0000 Subject: [PATCH] Fix disappearing Youtube video - on this page https://www.gov.uk/government/publications/electronic-travel-authorisation-eta-help-videos/what-is-an-eta-video there is only an embedded video, which does not appear on mobile - this seems to be due to the `.offset-empty-contents-list` class, which floats the main column right if there is no contents list on the left to push it across - however below desktop this styling persists, when all the grid columns should have collapsed - somehow if there is only a Youtube video present in this floated element, it produces an element with zero width, so the video is effectively invisible - adjusting the class to only apply on desktop seems to fix the issue --- app/assets/stylesheets/views/_html-publication.scss | 10 +++++++--- 1 file changed, 7 insertions(+), 3 deletions(-) diff --git a/app/assets/stylesheets/views/_html-publication.scss b/app/assets/stylesheets/views/_html-publication.scss index aa5ca2b33..bc985c48f 100644 --- a/app/assets/stylesheets/views/_html-publication.scss +++ b/app/assets/stylesheets/views/_html-publication.scss @@ -37,11 +37,15 @@ } .offset-empty-contents-list { - float: right; + // stylelint-disable max-nesting-depth + @include govuk-media-query($from: desktop) { + float: right; - .direction-rtl & { - float: left; + .direction-rtl & { + float: left; + } } + // stylelint-enable max-nesting-depth } .meta-data {