From 780a995263903e4af1810245d48999c5ead6036b Mon Sep 17 00:00:00 2001
From: nagyad <joevagyok@gmail.com>
Date: Fri, 23 Aug 2024 12:34:54 +0200
Subject: [PATCH] EWPP-4556: Apply a temporary css fix for banner video.

---
 sass/components/_banner.scss | 15 +++++++++++++++
 sass/style-ec.scss           |  1 +
 sass/style-eu.scss           |  1 +
 3 files changed, 17 insertions(+)
 create mode 100644 sass/components/_banner.scss

diff --git a/sass/components/_banner.scss b/sass/components/_banner.scss
new file mode 100644
index 000000000..d2cd17ddc
--- /dev/null
+++ b/sass/components/_banner.scss
@@ -0,0 +1,15 @@
+// Small banner - ratio 5:1
+.ecl-banner--s .ecl-banner__image,
+.ecl-banner--s .ecl-banner__video {
+  aspect-ratio: 5/1;
+
+  --css-aspect-ratio: 5/1;
+}
+
+// Large banner - ratio 3:1
+.ecl-banner--l .ecl-banner__image,
+.ecl-banner--l .ecl-banner__video {
+  aspect-ratio: 3/1;
+
+  --css-aspect-ratio: 3/1;
+}
diff --git a/sass/style-ec.scss b/sass/style-ec.scss
index 1d39e918d..5f8168ad8 100644
--- a/sass/style-ec.scss
+++ b/sass/style-ec.scss
@@ -27,3 +27,4 @@
   $font-family: map.get(theme.$theme, 'font-family', 'default'),
 );
 @use "./components/navigation_list";
+@use "./components/banner";
diff --git a/sass/style-eu.scss b/sass/style-eu.scss
index 3ca0b34bf..08fbdadee 100644
--- a/sass/style-eu.scss
+++ b/sass/style-eu.scss
@@ -30,3 +30,4 @@
   $font-family: map.get(theme.$theme, 'font-family', 'default'),
 );
 @use "./components/navigation_list";
+@use "./components/banner";