diff --git a/src/editor.ts b/src/editor.ts
index db7a3ac8..e9e56710 100644
--- a/src/editor.ts
+++ b/src/editor.ts
@@ -1,5 +1,3 @@
-// TODO: simplify submenu CSS for nested submenus (use .values for cameras)
-
import { fireEvent, HomeAssistant, LovelaceCardEditor } from 'custom-card-helpers';
import { CSSResultGroup, html, LitElement, TemplateResult, unsafeCSS } from 'lit';
import { customElement, property, state } from 'lit/decorators.js';
@@ -1389,8 +1387,10 @@ export class FrigateCardEditor extends LitElement implements LovelaceCardEditor
${this._renderOptionSetHeader('cameras')}
${this._expandedMenus[MENU_OPTIONS] === 'cameras'
? html`
- ${cameras.map((_, index) => this._renderCamera(cameras, index, entities))}
- ${this._renderCamera(cameras, cameras.length, entities, true)}
+
+ ${cameras.map((_, index) => this._renderCamera(cameras, index, entities))}
+ ${this._renderCamera(cameras, cameras.length, entities, true)}
+
`
: ''}
${this._renderOptionSetHeader('view')}
diff --git a/src/scss/editor.scss b/src/scss/editor.scss
index 86279f8c..2ddddce6 100644
--- a/src/scss/editor.scss
+++ b/src/scss/editor.scss
@@ -72,29 +72,24 @@ div.upgrade span {
padding-right: 15px;
}
-.submenu {
- border: 1px solid var(--divider-color);
-}
.submenu.selected {
border: 1px solid var(--primary-color);
}
// Nested menus should shrink width.
-.submenu .submenu {
+.submenu {
width: calc(100% - 10px * 2);
margin-left: auto;
margin-right: auto;
margin-bottom: 10px;
}
-.submenu .submenu:first-child {
+// Add a margin above a submenu unless it's another submenu.
+.submenu:first-child,
+:not(.submenu) + .submenu {
margin-top: 10px;
}
-.submenu :not(.submenu.selected) {
- border: none;
-}
-
.submenu .controls {
display: inline-block;
margin-left: auto;