diff --git a/src/components/live.ts b/src/components/live.ts
index 8d5c5e46..2fb09d28 100644
--- a/src/components/live.ts
+++ b/src/components/live.ts
@@ -1,5 +1,3 @@
-// TODO editor: fill in a new camera then backspace it away
-// TODO editor: render correctly when name title is really long
// TODO editor: should not be able to move up a new camera before it's not new.
// TODO reconsider card_id, and using entity (which is unique) as that id
// TODO rename card_id to id?
diff --git a/src/editor.ts b/src/editor.ts
index c75896ab..0940734d 100644
--- a/src/editor.ts
+++ b/src/editor.ts
@@ -269,40 +269,38 @@ export class FrigateCardEditor extends LitElement implements LovelaceCardEditor
@click=${this._toggleCameraHandler}
.cameraIndex=${cameraIndex}
>
-
-
-
- ${addNewCamera
- ? html`
- [${localize('editor.add_new_camera')}...]
- `
- : // Attempt to render a recognizable name for the camera,
- // starting with the most likely to be useful and working our
- // ways towards the least useful.
- html`
- ${cameraConfig?.title ||
- cameraConfig?.card_id ||
- [
- cameraConfig?.camera_entity
- ? getEntityTitle(this.hass, String(cameraConfig.camera_entity))
- : '',
- cameraConfig?.client_id,
- cameraConfig?.camera_name
- ? prettifyFrigateName(String(cameraConfig.camera_name))
- : '',
- cameraConfig?.label
- ? prettifyFrigateName(String(cameraConfig.label))
- : '',
- cameraConfig?.zone
- ? prettifyFrigateName(String(cameraConfig.zone))
- : '',
- ]
- .filter(Boolean)
- .join(' / ') ||
- localize('editor.camera') + ' #' + cameraIndex}
- `}
-
-
+
+
+ ${addNewCamera
+ ? html`
+ [${localize('editor.add_new_camera')}...]
+ `
+ : // Attempt to render a recognizable name for the camera,
+ // starting with the most likely to be useful and working our
+ // ways towards the least useful.
+ html`
+ ${cameraConfig?.title ||
+ cameraConfig?.card_id ||
+ [
+ cameraConfig?.camera_entity
+ ? getEntityTitle(this.hass, String(cameraConfig.camera_entity))
+ : '',
+ cameraConfig?.client_id,
+ cameraConfig?.camera_name
+ ? prettifyFrigateName(String(cameraConfig.camera_name))
+ : '',
+ cameraConfig?.label
+ ? prettifyFrigateName(String(cameraConfig.label))
+ : '',
+ cameraConfig?.zone
+ ? prettifyFrigateName(String(cameraConfig.zone))
+ : '',
+ ]
+ .filter(Boolean)
+ .join(' / ') ||
+ localize('editor.camera') + ' #' + cameraIndex}
+ `}
+
`;
}
diff --git a/src/scss/editor.scss b/src/scss/editor.scss
index 5ba61e1f..0e7ff52d 100644
--- a/src/scss/editor.scss
+++ b/src/scss/editor.scss
@@ -41,10 +41,14 @@ div.upgrade span {
}
.camera-header {
+ display: flex;
margin-top: 4px;
+
cursor: pointer;
}
.camera-header * {
+ flex-basis: auto;
+
// Only allow clicks on the outermost header.
pointer-events: none;
}