From 8acf540f0ec204bcfbff9896e9ac80aa2f5589ac Mon Sep 17 00:00:00 2001
From: Markus Heiser <markus.heiser@darmarit.de>
Date: Fri, 18 Feb 2022 18:10:25 +0100
Subject: [PATCH] [mod] simple theme: set height of embedded content (iframe)

This commit sets appropriate height of the (embedded) player from:

- soundcloud
- mixcloud
- deezer

Signed-off-by: Markus Heiser <markus.heiser@darmarit.de>
---
 .../themes/simple/src/less/embedded.less      | 19 +++++++++++++++++++
 .../static/themes/simple/src/less/style.less  |  1 +
 2 files changed, 20 insertions(+)
 create mode 100644 searx/static/themes/simple/src/less/embedded.less

diff --git a/searx/static/themes/simple/src/less/embedded.less b/searx/static/themes/simple/src/less/embedded.less
new file mode 100644
index 000000000..4a43ea78d
--- /dev/null
+++ b/searx/static/themes/simple/src/less/embedded.less
@@ -0,0 +1,19 @@
+iframe[src^="https://w.soundcloud.com"] {
+  height: 120px;
+}
+
+iframe[src^="https://www.deezer.com"] {
+  // The real size is 92px, but 94px are needed to avoid an inner scrollbar of
+  // the embedded HTML.
+  height: 94px;
+}
+
+iframe[src^="https://www.mixcloud.com"] {
+  // the embedded player from mixcloud has some quirks: initial there is an
+  // issue with an image URL that is blocked since it is an a Cross-Origin
+  // request. The alternative text (<img alt='Mixcloud Logo'> then cause an
+  // scrollbar in the inner of the iframe we can't avoid.  Another quirk comes
+  // when pressing the play button, somtimes the shown player has an height of
+  // 200px, somtimes 250px.
+  height: 250px;
+}
diff --git a/searx/static/themes/simple/src/less/style.less b/searx/static/themes/simple/src/less/style.less
index 3a3777587..692d9e7c0 100644
--- a/searx/static/themes/simple/src/less/style.less
+++ b/searx/static/themes/simple/src/less/style.less
@@ -17,6 +17,7 @@
 @import "autocomplete.less";
 @import "detail.less";
 @import "animations.less";
+@import "embedded.less";
 
 // for index.html template
 @import "index.less";