I wrote a theme component to add a banner to my site (above site header), it works, but when the chat panel shows up, 1) on the desktop, the chat header will be covered by the site header, 2) on the mobile, the chat input box will be pushed out of the screen (below the viewport).
Anyway to fix this issue? I assumed the plugin was not initialized correctly so the chat drawer can’t detect it, but don’t know the solution.
Thanks in advance.
<script type="text/discourse-plugin" version="0.8">
const h = require("virtual-dom").h;
let user = api.getCurrentUser();
api.createWidget("general-banner", {
tagName: "div",
html() {
if ( !user || (user && !user.custom_fields.user_field_2 )) {
return [
//content
];
}
}
});
</script>
<script type="text/x-handlebars" data-template-name="/connectors/above-site-header/general-banner">
{{mount-widget widget="general-banner"}}
</script>