${this._element}
${this._config.right_button !== undefined ||
this._config.left_button !== undefined
? html`
`
: ""}
`;
}
static get styles() {
return css`
:host {
display: none !important;
}
:host([edit-mode="true"]) {
display: block !important;
border: 1px solid var(--primary-color);
}
ha-card {
background-color: var(
--popup-background-color,
var(--ha-card-background, var(--card-background-color, white))
);
}
.app-toolbar {
color: var(--primary-text-color);
background-color: var(
--popup-header-background-color,
var(--popup-background-color, --sidebar-background-color)
);
display: var(--layout-horizontal_-_display);
flex-direction: var(--layout-horizontal_-_flex-direction);
align-items: var(--layout-center_-_align-items);
height: 64px;
padding: 0 16px;
font-size: var(--app-toolbar-font-size, 20px);
}
ha-icon-button > * {
display: flex;
}
.main-title {
margin-left: 16px;
line-height: 1.3em;
max-height: 2.6em;
overflow: hidden;
text-overflow: ellipsis;
}
.mdc-dialog__actions {
display: flex;
align-items: center;
justify-content: space-between;
min-height: 52px;
margin: 0px;
padding: 8px;
border-top: 1px solid transparent;
}
`;
}
}
(async () => {
while (!window.browser_mod) {
await new Promise((resolve) => setTimeout(resolve, 1000));
}
await window.browser_mod.connectionPromise;
if (!customElements.get("popup-card"))
customElements.define("popup-card", PopupCard);
})();