From a80365b1eecb895792ccb772eba489cff071a843 Mon Sep 17 00:00:00 2001
From: Christoph Reiter <reiter.christoph@gmail.com>
Date: Wed, 24 Nov 2021 11:49:59 +0100
Subject: [PATCH] translated: fix hiding slots with safari 12.2
Safari 12 ignores CSS applied to slots in web components.
Work around that by wrapping them in a div.
Confirmed with browserstack
---
packages/common/src/translated.js | 8 ++++++--
1 file changed, 6 insertions(+), 2 deletions(-)
diff --git a/packages/common/src/translated.js b/packages/common/src/translated.js
index 5739ba98..592f4925 100644
--- a/packages/common/src/translated.js
+++ b/packages/common/src/translated.js
@@ -24,8 +24,12 @@ export class Translated extends DBPLitElement {
render() {
return html`
- <slot class="${classMap({hidden: this.lang !== 'de'})}" name="de"></slot>
- <slot class="${classMap({hidden: this.lang !== 'en'})}" name="en"></slot>
+ <div class="${classMap({hidden: this.lang !== 'de'})}">
+ <slot name="de"></slot>
+ </div>
+ <div class="${classMap({hidden: this.lang !== 'en'})}">
+ <slot name="en"></slot>
+ </div>
`;
}
}
--
GitLab