diff --git a/src/panels/lovelace/cards/hui-media-control-card.ts b/src/panels/lovelace/cards/hui-media-control-card.ts index 6b04400ec2..c5035a9c58 100644 --- a/src/panels/lovelace/cards/hui-media-control-card.ts +++ b/src/panels/lovelace/cards/hui-media-control-card.ts @@ -98,15 +98,13 @@ export class HuiMediaControlCard extends LitElement implements LovelaceCard { class="progress" > `} -
-
- -
-
+
+ +
-
- -
+
`; @@ -224,7 +220,7 @@ export class HuiMediaControlCard extends LitElement implements LovelaceCard { } .no-image { - padding-bottom: 20%; + padding-bottom: 88px; } .no-image > .image { @@ -236,37 +232,27 @@ export class HuiMediaControlCard extends LitElement implements LovelaceCard { .no-image > .caption { background-color: initial; + box-sizing: border-box; + height: 88px; } .controls { - align-content: space-evenly; padding: 8px; - } - - .controls > div { - width: 33%; + display: flex; + justify-content: space-between; align-items: center; } - .flex { + .controls > div { display: flex; + align-items: center; } - .left { - justify-content: flex-start; - } - - .center { - justify-content: center; - } - - .right { - justify-content: flex-end; - } - - paper-icon-button { + .controls paper-icon-button { width: 44px; height: 44px; + } + paper-icon-button { opacity: var(--dark-primary-opacity); }