jeans/frontend
jeans/frontend
1
0
Fork 0
mirror of https://github.com/home-assistant/frontend.git synced 2025-07-23 09:16:38 +00:00
Code Issues Packages Projects Releases Wiki Activity

Update Media Browser Bar to show image on mobile but a bit less (#11818)

Browse Source
This commit is contained in:
Zack Barett 2022-02-24 11:56:20 -06:00 committed by GitHub
parent 8af795a7ce
commit 30f7252d84
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 16 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
src/panels/media-browser/ha-bar-media-player.ts
View File

@ -264,7 +264,9 @@ export class BarMediaPlayer extends LitElement {
return html` return html`
<div class="choose-player ${isBrowser ? "browser" : ""}"> <div class="choose-player ${isBrowser ? "browser" : ""}">
${ ${
stateObj && supportsFeature(stateObj, SUPPORT_VOLUME_SET) !this.narrow &&
stateObj &&
supportsFeature(stateObj, SUPPORT_VOLUME_SET)
? html` ? html`
<ha-button-menu corner="BOTTOM_START" y="0" x="76"> <ha-button-menu corner="BOTTOM_START" y="0" x="76">
<ha-icon-button <ha-icon-button
@ -601,6 +603,7 @@ export class BarMediaPlayer extends LitElement {
img { img {
max-height: 100px; max-height: 100px;
max-width: 100px;
} }
.app img { .app img {
@ -613,8 +616,8 @@ export class BarMediaPlayer extends LitElement {
} }
:host([narrow]) { :host([narrow]) {
min-height: 80px; min-height: 56px;
max-height: 80px; max-height: 56px;
} }
:host([narrow]) .controls-progress { :host([narrow]) .controls-progress {
@ -622,13 +625,19 @@ export class BarMediaPlayer extends LitElement {
min-width: 48px; min-width: 48px;
} }
:host([narrow]) .media-info {
padding-left: 8px;
}
:host([narrow]) .controls { :host([narrow]) .controls {
display: flex; display: flex;
padding-bottom: 0; padding-bottom: 0;
--mdc-icon-size: 30px;
} }
:host([narrow]) .choose-player { :host([narrow]) .choose-player {
padding-left: 0; padding-left: 0;
padding-right: 8px;
min-width: 48px; min-width: 48px;
flex: unset; flex: unset;
justify-content: center; justify-content: center;
@ -636,16 +645,16 @@ export class BarMediaPlayer extends LitElement {
:host([narrow]) .choose-player.browser { :host([narrow]) .choose-player.browser {
justify-content: flex-end; justify-content: flex-end;
width: 100%;
} }
:host([narrow]) img { :host([narrow]) img {
max-height: 80px; max-height: 56px;
max-width: 56px;
} }
:host([narrow]) .blank-image { :host([narrow]) .blank-image {
height: 80px; height: 56px;
width: 80px; width: 56px;
} }
:host([narrow]) mwc-linear-progress { :host([narrow]) mwc-linear-progress {