jeans/frontend
jeans/frontend
1
0
Fork 0
mirror of https://github.com/home-assistant/frontend.git synced 2025-07-25 18:26:35 +00:00
Code Issues Packages Projects Releases Wiki Activity

Fix button layout for addon-info (#8315)

Browse Source
This commit is contained in:
Joakim Sørensen 2021-02-03 16:08:29 +01:00 committed by GitHub
parent 17aff2f9b8
commit 5199e946a1
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 82 additions and 81 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

163
hassio/src/addon-view/info/hassio-addon-info.ts
View File

@ -536,85 +536,88 @@ class HassioAddonInfo extends LitElement {
${this._error ? html` <div class="errors">${this._error}</div> ` : ""} ${this._error ? html` <div class="errors">${this._error}</div> ` : ""}
</div> </div>
<div class="card-actions"> <div class="card-actions">
${this.addon.version <div>
? html` ${this.addon.version
${this._computeIsRunning ? this._computeIsRunning
? html` ? html`
<ha-call-api-button <ha-call-api-button
class="warning" class="warning"
.hass=${this.hass} .hass=${this.hass}
.path="hassio/addons/${this.addon.slug}/stop" .path="hassio/addons/${this.addon.slug}/stop"
> >
Stop Stop
</ha-call-api-button> </ha-call-api-button>
<ha-call-api-button <ha-call-api-button
class="warning" class="warning"
.hass=${this.hass} .hass=${this.hass}
.path="hassio/addons/${this.addon.slug}/restart" .path="hassio/addons/${this.addon.slug}/restart"
> >
Restart Restart
</ha-call-api-button> </ha-call-api-button>
` `
: html` : html`
<ha-progress-button @click=${this._startClicked}> <ha-progress-button @click=${this._startClicked}>
Start Start
</ha-progress-button> </ha-progress-button>
`} `
${this._computeShowWebUI : html`
? html` ${!this.addon.available
<a ? html`
href=${this._pathWebui!} <p class="warning">
tabindex="-1" This add-on is not available on your system.
target="_blank" </p>
class="right" `
rel="noopener" : ""}
> <ha-progress-button
<mwc-button> .disabled=${!this.addon.available}
@click=${this._installClicked}
>
Install
</ha-progress-button>
`}
</div>
<div>
${this.addon.version
? html` ${this._computeShowWebUI
? html`
<a
href=${this._pathWebui!}
tabindex="-1"
target="_blank"
rel="noopener"
>
<mwc-button>
Open web UI
</mwc-button>
</a>
`
: ""}
${this._computeShowIngressUI
? html`
<mwc-button @click=${this._openIngress}>
Open web UI Open web UI
</mwc-button> </mwc-button>
</a> `
` : ""}
: ""} <ha-progress-button
${this._computeShowIngressUI class="warning"
? html` @click=${this._uninstallClicked}
<mwc-button class="right" @click=${this._openIngress}> >
Open web UI Uninstall
</mwc-button> </ha-progress-button>
` ${this.addon.build
: ""} ? html`
<ha-progress-button <ha-call-api-button
class=" right warning" class="warning"
@click=${this._uninstallClicked} .hass=${this.hass}
> .path="hassio/addons/${this.addon.slug}/rebuild"
Uninstall >
</ha-progress-button> Rebuild
${this.addon.build </ha-call-api-button>
? html` `
<ha-call-api-button : ""}`
class="warning right" : ""}
.hass=${this.hass} </div>
.path="hassio/addons/${this.addon.slug}/rebuild"
>
Rebuild
</ha-call-api-button>
`
: ""}
`
: html`
${!this.addon.available
? html`
<p class="warning">
This add-on is not available on your system.
</p>
`
: ""}
<ha-progress-button
.disabled=${!this.addon.available}
@click=${this._installClicked}
>
Install
</ha-progress-button>
`}
</div> </div>
</ha-card> </ha-card>
@ -994,9 +997,6 @@ class HassioAddonInfo extends LitElement {
font-weight: 500; font-weight: 500;
color: var(--primary-color); color: var(--primary-color);
} }
.right {
float: right;
}
protection-enable mwc-button { protection-enable mwc-button {
--mdc-theme-primary: white; --mdc-theme-primary: white;
} }
@ -1019,7 +1019,8 @@ class HassioAddonInfo extends LitElement {
margin-bottom: 16px; margin-bottom: 16px;
} }
.card-actions { .card-actions {
display: flow-root; justify-content: space-between;
display: flex;
} }
.security h3 { .security h3 {
margin-bottom: 8px; margin-bottom: 8px;