diff --git a/src/card.ts b/src/card.ts index b241bb81..32a5b6ed 100644 --- a/src/card.ts +++ b/src/card.ts @@ -1096,11 +1096,6 @@ export class FrigateCard extends LitElement { absolute: padding != null, }; - const pictureElementsClasses = { - 'picture-elements': true, - gallery: !!this._view?.isGalleryView(), - }; - const actions = this._getMergedActions(); return html`
-
- ${this._getConfig().elements - ? // Always show elements to allow for custom menu items (etc.) to - // be present even if a particular view has an error. - html` { - this._addDynamicMenuButton(e.detail); - }} - @frigate-card:menu-remove=${(e) => { - this._removeDynamicMenuButton(e.detail); - }} - @frigate-card:condition-state-request=${(ev) => { - conditionStateRequestHandler(ev, this._conditionState); - }} - > - ` - : ``} - ${this._cameras === undefined - ? until( - (async () => { - await this._loadCameras(); - // Don't reset messages as errors may have been generated - // during the camera load. - this._changeView({ resetMessage: false }); - return this._render(); - })(), - renderProgressIndicator(), - ) - : // Always want to call render even if there's a message, to - // ensure live preload is always present (even if not displayed). - this._render()} - ${ - // Keep message rendering to last to show messages that may have - // been generated during the render. - this._message ? renderMessage(this._message) : '' - } -
+ ${this._cameras === undefined + ? until( + (async () => { + await this._loadCameras(); + // Don't reset messages as errors may have been generated + // during the camera load. + this._changeView({ resetMessage: false }); + return this._render(); + })(), + renderProgressIndicator(), + ) + : // Always want to call render even if there's a message, to + // ensure live preload is always present (even if not displayed). + this._render()} + ${this._getConfig().elements + ? // Always show elements to allow for custom menu items (etc.) to + // be present even if a particular view has an error. Elements + // need to render after the main views so it can render 'on top'. + html` { + this._addDynamicMenuButton(e.detail); + }} + @frigate-card:menu-remove=${(e) => { + this._removeDynamicMenuButton(e.detail); + }} + @frigate-card:condition-state-request=${(ev) => { + conditionStateRequestHandler(ev, this._conditionState); + }} + > + ` + : ``} + ${ + // Keep message rendering to last to show messages that may have + // been generated during the render. + this._message ? renderMessage(this._message) : '' + }
${this._getConfig().menu.mode != 'above' ? this._renderMenu() : ''} diff --git a/src/scss/card.scss b/src/scss/card.scss index a0ace685..a22ee54b 100644 --- a/src/scss/card.scss +++ b/src/scss/card.scss @@ -44,18 +44,6 @@ .outer:hover + .hover-menu, .hover-menu:hover { opacity: 0.9; } -/* A relative div to place absolute picture elements onto */ -.picture-elements { - position: relative; - width: 100%; - height: 100%; -} - -/* Enforce picture elements to only be the size of the card/fullscreen (and not -larger) when in gallery mode so that the picture elements do not scroll. */ -.picture-elements.gallery { - height: 100%; -} ha-card { display: flex;