From 9889d973aa53894bce72782fdecec51ac0f927eb Mon Sep 17 00:00:00 2001 From: Wendelin Date: Thu, 22 May 2025 16:19:09 +0200 Subject: [PATCH] Migrate to new button --- .../src/components/landing-page-logs.ts | 8 ++- .../src/components/landing-page-network.ts | 1 + src/components/buttons/ha-progress-button.ts | 10 +-- .../data-table/dialog-data-table-settings.ts | 11 ++- src/components/ha-button.ts | 68 ++++++++++++++++--- src/components/ha-date-range-picker.ts | 9 +-- src/components/ha-file-upload.ts | 20 +++--- src/components/ha-multi-textfield.ts | 9 ++- src/dialogs/config-flow/step-flow-abort.ts | 6 +- .../config-flow/step-flow-create-entry.ts | 6 +- src/dialogs/config-flow/step-flow-form.ts | 6 +- src/dialogs/generic/dialog-box.ts | 3 +- .../more-info/controls/more-info-update.ts | 6 +- src/onboarding/onboarding-analytics.ts | 10 +-- src/onboarding/onboarding-core-config.ts | 8 +-- src/onboarding/onboarding-create-user.ts | 7 +- src/onboarding/onboarding-integrations.ts | 2 +- src/onboarding/onboarding-location.ts | 7 +- src/onboarding/onboarding-welcome.ts | 3 +- .../dialog-add-application-credential.ts | 6 +- .../areas/dialog-area-registry-detail.ts | 7 +- .../areas/dialog-floor-registry-detail.ts | 17 +++-- .../automation/action/ha-automation-action.ts | 21 +++--- .../dialog-automation-save.ts | 15 ++-- .../condition/ha-automation-condition.ts | 21 +++--- .../config/automation/ha-automation-picker.ts | 16 +++-- .../automation/manual-automation-editor.ts | 33 +++++---- .../trigger/ha-automation-trigger.ts | 11 +-- .../blueprint/dialog-import-blueprint.ts | 64 +++++++++-------- .../config/blueprint/ha-blueprint-overview.ts | 20 +++--- src/panels/config/cloud/login/cloud-login.ts | 1 + .../config/cloud/register/cloud-register.ts | 14 ++-- .../config/core/ha-config-section-general.ts | 11 ++- .../device-detail/ha-device-entities-card.ts | 7 +- .../settings/entity-settings-helper-tab.ts | 12 ++-- .../entities/entity-registry-settings.ts | 28 ++++---- .../config/helpers/dialog-helper-detail.ts | 11 +-- .../ha-config-integration-page.ts | 46 ++++++++----- .../config/labels/dialog-label-detail.ts | 13 ++-- src/panels/config/logs/system-log-card.ts | 1 - .../dialog-lovelace-dashboard-detail.ts | 18 ++--- .../ha-config-lovelace-dashboards.ts | 10 +-- .../config/person/dialog-person-detail.ts | 12 +++- .../config/repairs/dialog-repairs-issue.ts | 24 +++---- src/panels/config/scene/ha-scene-dashboard.ts | 15 ++-- src/panels/config/scene/ha-scene-editor.ts | 10 +-- src/panels/config/script/ha-script-picker.ts | 15 ++-- src/panels/config/tags/dialog-tag-detail.ts | 17 ++--- src/panels/config/users/dialog-add-user.ts | 37 +++++----- src/panels/config/users/dialog-user-detail.ts | 47 +++++++------ .../config/voice-assistants/assist-pref.ts | 49 +++++++------ .../config/voice-assistants/cloud-discover.ts | 26 ++++--- .../voice-assistants/dialog-expose-entity.ts | 13 +++- .../config/zone/dialog-home-zone-detail.ts | 15 ++-- src/panels/config/zone/dialog-zone-detail.ts | 22 ++++-- .../action/developer-tools-action.ts | 16 +++-- .../assist/developer-tools-assist.ts | 1 + .../event/developer-tools-event.ts | 4 +- .../event/event-subscribe-card.ts | 4 +- .../dialog-statistics-fix-units-changed.ts | 16 +++-- .../statistics/dialog-statistics-fix.ts | 33 +++++---- .../template/developer-tools-template.ts | 10 +-- .../developer-yaml-config.ts | 15 ++-- .../energy/cards/energy-setup-wizard-card.ts | 16 ++--- .../card-editor/hui-dialog-create-card.ts | 9 +-- .../card-editor/hui-dialog-edit-card.ts | 30 ++++---- .../card-editor/hui-dialog-suggest-card.ts | 22 +++--- .../dialog-dashboard-strategy-editor.ts | 17 +++-- src/panels/lovelace/hui-root.ts | 20 +++--- src/resources/theme/color.globals.ts | 2 - 70 files changed, 655 insertions(+), 465 deletions(-) diff --git a/landing-page/src/components/landing-page-logs.ts b/landing-page/src/components/landing-page-logs.ts index 0b0c3e7c81..9dd7f01fa9 100644 --- a/landing-page/src/components/landing-page-logs.ts +++ b/landing-page/src/components/landing-page-logs.ts @@ -64,7 +64,7 @@ class LandingPageLogs extends LitElement { protected render() { return html`
- + ${this.localize(this._show ? "hide_details" : "show_details")} ${this._show @@ -81,7 +81,11 @@ class LandingPageLogs extends LitElement { alert-type="error" .title=${this.localize("logs.fetch_error")} > - + ${this.localize("logs.retry")} diff --git a/landing-page/src/components/landing-page-network.ts b/landing-page/src/components/landing-page-network.ts index bea2336e48..d890ecddfc 100644 --- a/landing-page/src/components/landing-page-network.ts +++ b/landing-page/src/components/landing-page-network.ts @@ -67,6 +67,7 @@ class LandingPageNetwork extends LitElement { ${ALTERNATIVE_DNS_SERVERS.map( ({ translationKey }, key) => html` - + ${this.label} ${!overlay ? nothing diff --git a/src/components/data-table/dialog-data-table-settings.ts b/src/components/data-table/dialog-data-table-settings.ts index ac7acac001..8a4c5d347f 100644 --- a/src/components/data-table/dialog-data-table-settings.ts +++ b/src/components/data-table/dialog-data-table-settings.ts @@ -152,10 +152,17 @@ export class DialogDataTableSettings extends LitElement { )} - ${localize("ui.components.data-table.settings.restore")} - + ${localize("ui.components.data-table.settings.done")} diff --git a/src/components/ha-button.ts b/src/components/ha-button.ts index 122df2f718..ae84a7dcf9 100644 --- a/src/components/ha-button.ts +++ b/src/components/ha-button.ts @@ -25,7 +25,6 @@ import { customElement, property } from "lit/decorators"; * * @cssprop --ha-button-font-family - Font family for the button text. * @cssprop --ha-font-weight-medium - Medium font weight for button text. - * @cssprop --ha-button-line-height - Line height for button text. * @cssprop --ha-button-border-width - Border width for the button. * @cssprop --ha-button-theme-color - Main color for the button. * @cssprop --ha-button-theme-darker-color - Darker variant of the main color. @@ -33,9 +32,10 @@ import { customElement, property } from "lit/decorators"; * @cssprop --ha-button-height - Height of the button. * @cssprop --ha-button-border-radius - Border radius for the button. * @cssprop --ha-button-text-color - Text color for the button. + * @cssprop --ha-button-font-size - Font weight for the button text. * * @attr {("small"|"medium")} size - Sets the button size. - * @attr {("primary"|"danger"|"neutral")} variant - Sets the button color variant. "primary" is default. + * @attr {("primary"|"danger"|"neutral"|"warning")} variant - Sets the button color variant. "primary" is default. * @attr {("accent"|"filled"|"plain")} appearance - Sets the button appearance. */ @customElement("ha-button") @@ -57,6 +57,14 @@ export class HaButton extends Button { --sl-transition-x-fast: 0.4s; --sl-focus-ring: solid 4px var(--accent-color); --sl-focus-ring-offset: 1px; + --sl-button-font-size-small: var( + --ha-button-font-size, + var(--ha-font-size-m) + ); + --sl-button-font-size-medium: var( + --ha-button-font-size, + var(--ha-font-size-m) + ); --sl-spacing-medium: 16px; --sl-spacing-small: 12px; @@ -64,23 +72,29 @@ export class HaButton extends Button { --ha-button-theme-color: var(--primary-color); --ha-button-theme-darker-color: var(--dark-primary-color); - --ha-button-theme-lighter-color: var(--light-primary-color); + --ha-button-theme-lighter-color: #dff3fc; - line-height: var(--ha-button-line-height, var(--ha-line-height-normal)); + line-height: 1; --sl-input-border-width: var(--ha-button-border-width, 0); } :host([destructive]), /* Deprecated */ :host([variant="danger"]) { - --ha-button-theme-color: var(--error-color); - --ha-button-theme-darker-color: var(--error-color-darker); - --ha-button-theme-lighter-color: var(--error-color-lighter); + --ha-button-theme-color: #b30532; + --ha-button-theme-darker-color: #64031d; + --ha-button-theme-lighter-color: #ffdedc; } :host([variant="neutral"]) { - --ha-button-theme-color: var(--primary-text-color); - --ha-button-theme-darker-color: var(--dark-primary-color); - --ha-button-theme-lighter-color: var(--light-primary-color); + --ha-button-theme-color: #545868; + --ha-button-theme-darker-color: #373a44; + --ha-button-theme-lighter-color: #e4e5e9; + } + + :host([variant="warning"]) { + --ha-button-theme-color: #b45f04; + --ha-button-theme-darker-color: #9c5203; + --ha-button-theme-lighter-color: #fef3cd; } .button { @@ -94,12 +108,28 @@ export class HaButton extends Button { } .button, + .button--standard.button--default, + .button--standard.button--primary, + .button--standard.button--neutral, + .button--standard.button--danger, + .button--standard.button--warning, + .button--standard.button--default:active:not(.button--disabled), + .button--standard.button--primary:active:not(.button--disabled), + .button--standard.button--neutral:active:not(.button--disabled), + .button--standard.button--danger:active:not(.button--disabled), + .button--standard.button--warning:active:not(.button--disabled), .button:active:not(.button--disabled) { background-color: var(--ha-button-theme-color); color: var(--ha-button-text-color, var(--white-color)); } - .button:hover:not(.button--disabled) { + .button:hover:not(.button--disabled), + .button--standard.button--default:hover:not(.button--disabled), + .button--standard.button--primary:hover:not(.button--disabled), + .button--standard.button--neutral:hover:not(.button--disabled), + .button--standard.button--warning:hover:not(.button--disabled), + .button--standard.button--danger:hover:not(.button--disabled) { background-color: var(--ha-button-theme-darker-color); + color: var(--ha-button-text-color, var(--white-color)); } :host([appearance="filled"]) .button, @@ -121,6 +151,22 @@ export class HaButton extends Button { background-color: var(--ha-button-theme-lighter-color); color: var(--ha-button-text-color, var(--ha-button-theme-darker-color)); } + + /* spacing */ + .button--has-prefix.button--medium .button__label { + padding-inline-start: 8px; + } + .button--has-prefix.button--small .button__label { + padding-inline-start: 4px; + } + .button--has-suffix.button--medium .button__label, + .button--caret.button--medium .button__label { + padding-inline-end: 8px; + } + .button--has-suffix.button--small .button__label, + .button--caret.button--small .button__label { + padding-inline-end: 4px; + } `, ]; } diff --git a/src/components/ha-date-range-picker.ts b/src/components/ha-date-range-picker.ts index 5d94626f92..01cd4390a0 100644 --- a/src/components/ha-date-range-picker.ts +++ b/src/components/ha-date-range-picker.ts @@ -22,6 +22,7 @@ import { fireEvent } from "../common/dom/fire_event"; import { TimeZone } from "../data/translation"; import type { HomeAssistant } from "../types"; import "./date-range-picker"; +import "./ha-button"; import "./ha-icon-button"; import "./ha-icon-button-next"; import "./ha-icon-button-prev"; @@ -197,13 +198,13 @@ export class HaDateRangePicker extends LitElement {
` : nothing}
- ${this.hass.localize("ui.common.cancel")}${this.hass.localize("ui.common.cancel")} - ${this.hass.localize( "ui.components.date-range-picker.select" - )}
diff --git a/src/components/ha-file-upload.ts b/src/components/ha-file-upload.ts index 3d3749c8b4..2a6a5f6887 100644 --- a/src/components/ha-file-upload.ts +++ b/src/components/ha-file-upload.ts @@ -117,11 +117,15 @@ export class HaFileUpload extends LitElement { @dragleave=${this._handleDragEnd} @dragend=${this._handleDragEnd} >${!this.value - ? html` - + ? html` + ${this.label || localize("ui.components.file-upload.label")} - + ${this.addLabel ?? (this.label ? this.hass?.localize("ui.components.multi-textfield.add_item", { @@ -81,7 +86,7 @@ class HaMultiTextField extends LitElement { }) : this.hass?.localize("ui.common.add")) ?? "Add"} - + ${this.helper diff --git a/src/dialogs/config-flow/step-flow-abort.ts b/src/dialogs/config-flow/step-flow-abort.ts index 7277e0b0f8..dec5183d00 100644 --- a/src/dialogs/config-flow/step-flow-abort.ts +++ b/src/dialogs/config-flow/step-flow-abort.ts @@ -1,4 +1,3 @@ -import "@material/mwc-button"; import type { CSSResultGroup, PropertyValues } from "lit"; import { html, LitElement, nothing } from "lit"; import { customElement, property } from "lit/decorators"; @@ -9,6 +8,7 @@ import type { HomeAssistant } from "../../types"; import { showConfigFlowDialog } from "./show-dialog-config-flow"; import type { DataEntryFlowDialogParams } from "./show-dialog-data-entry-flow"; import { configFlowContentStyles } from "./styles"; +import "../../components/ha-button"; @customElement("step-flow-abort") class StepFlowAbort extends LitElement { @@ -38,10 +38,10 @@ class StepFlowAbort extends LitElement { ${this.params.flowConfig.renderAbortDescription(this.hass, this.step)}
- ${this.hass.localize( "ui.panel.config.integrations.config_flow.close" - )}
`; diff --git a/src/dialogs/config-flow/step-flow-create-entry.ts b/src/dialogs/config-flow/step-flow-create-entry.ts index 5a609fac8f..37849587bd 100644 --- a/src/dialogs/config-flow/step-flow-create-entry.ts +++ b/src/dialogs/config-flow/step-flow-create-entry.ts @@ -1,4 +1,3 @@ -import "@material/mwc-button"; import type { CSSResultGroup, PropertyValues, TemplateResult } from "lit"; import { css, html, LitElement, nothing } from "lit"; import { customElement, property, state } from "lit/decorators"; @@ -12,6 +11,7 @@ import { computeDomain } from "../../common/entity/compute_domain"; import { navigate } from "../../common/navigate"; import { slugify } from "../../common/string/slugify"; import "../../components/ha-area-picker"; +import "../../components/ha-button"; import { assistSatelliteSupportsSetupFlow } from "../../data/assist_satellite"; import type { DataEntryFlowStepCreateEntry } from "../../data/data_entry_flow"; import type { DeviceRegistryEntry } from "../../data/device_registry"; @@ -171,10 +171,10 @@ class StepFlowCreateEntry extends LitElement { `}
- ${localize( `ui.panel.config.integrations.config_flow.${!this.devices.length || Object.keys(this._deviceUpdate).length ? "finish" : "finish_skip"}` - )}
`; diff --git a/src/dialogs/config-flow/step-flow-form.ts b/src/dialogs/config-flow/step-flow-form.ts index aa012c2163..a77f716d74 100644 --- a/src/dialogs/config-flow/step-flow-form.ts +++ b/src/dialogs/config-flow/step-flow-form.ts @@ -1,10 +1,10 @@ -import "@material/mwc-button"; import type { CSSResultGroup, PropertyValues, TemplateResult } from "lit"; import { css, html, LitElement, nothing } from "lit"; import { customElement, property, state } from "lit/decorators"; import { dynamicElement } from "../../common/dom/dynamic-element-directive"; import { fireEvent } from "../../common/dom/fire_event"; import { isNavigationClick } from "../../common/dom/is-navigation-click"; +import "../../components/ha-button"; import "../../components/ha-alert"; import { computeInitialHaFormData } from "../../components/ha-form/compute-initial-ha-form-data"; import "../../components/ha-form/ha-form"; @@ -88,12 +88,12 @@ class StepFlowForm extends LitElement { ` : html`
- + ${this.flowConfig.renderShowFormStepSubmitButton( this.hass, this.step )} - +
`} diff --git a/src/dialogs/generic/dialog-box.ts b/src/dialogs/generic/dialog-box.ts index 0b8b463664..2cfcdaedf5 100644 --- a/src/dialogs/generic/dialog-box.ts +++ b/src/dialogs/generic/dialog-box.ts @@ -106,6 +106,7 @@ class DialogBox extends LitElement { @click=${this._dismiss} ?dialogInitialFocus=${!this._params.prompt && this._params.destructive} + appearance="plain" > ${this._params.dismissText ? this._params.dismissText @@ -116,7 +117,7 @@ class DialogBox extends LitElement { @click=${this._confirm} ?dialogInitialFocus=${!this._params.prompt && !this._params.destructive} - ?destructive=${this._params.destructive} + variant=${this._params.destructive ? "danger" : "primary"} > ${this._params.confirmText ? this._params.confirmText diff --git a/src/dialogs/more-info/controls/more-info-update.ts b/src/dialogs/more-info/controls/more-info-update.ts index 4bb768c1c7..7dec37eb35 100644 --- a/src/dialogs/more-info/controls/more-info-update.ts +++ b/src/dialogs/more-info/controls/more-info-update.ts @@ -299,7 +299,10 @@ class MoreInfoUpdate extends LitElement { ${this.stateObj.state === BINARY_STATE_OFF && this.stateObj.attributes.skipped_version ? html` - + ${this.hass.localize( "ui.dialogs.more_info_control.update.clear_skipped" )} @@ -307,6 +310,7 @@ class MoreInfoUpdate extends LitElement { ` : html` ${this._error ? html`
${this._error}
` : ""}
- + ${this.localize("ui.panel.page-onboarding.analytics.finish")} - +
`; } diff --git a/src/onboarding/onboarding-core-config.ts b/src/onboarding/onboarding-core-config.ts index d19a8d29c4..27fd4cf43e 100644 --- a/src/onboarding/onboarding-core-config.ts +++ b/src/onboarding/onboarding-core-config.ts @@ -1,4 +1,3 @@ -import "@material/mwc-button/mwc-button"; import type { PropertyValues, TemplateResult } from "lit"; import { css, html, LitElement, nothing } from "lit"; import { customElement, property, state } from "lit/decorators"; @@ -6,8 +5,9 @@ import { LOCAL_TIME_ZONE } from "../common/datetime/resolve-time-zone"; import { fireEvent } from "../common/dom/fire_event"; import type { LocalizeFunc } from "../common/translations/localize"; import "../components/ha-alert"; -import "../components/ha-spinner"; +import "../components/ha-button"; import { COUNTRIES } from "../components/ha-country-picker"; +import "../components/ha-spinner"; import type { ConfigUpdateValues } from "../data/core"; import { saveCoreConfig } from "../data/core"; import { countryCurrency } from "../data/currency"; @@ -80,11 +80,11 @@ class OnboardingCoreConfig extends LitElement {
- + ${this.onboardingLocalize( "ui.panel.page-onboarding.core-config.finish" )} - +
`; } diff --git a/src/onboarding/onboarding-create-user.ts b/src/onboarding/onboarding-create-user.ts index 5c928aec0a..19f20586f1 100644 --- a/src/onboarding/onboarding-create-user.ts +++ b/src/onboarding/onboarding-create-user.ts @@ -1,4 +1,3 @@ -import "@material/mwc-button"; import { genClientId } from "home-assistant-js-websocket"; import type { CSSResultGroup, PropertyValues, TemplateResult } from "lit"; import { html, LitElement } from "lit"; @@ -6,6 +5,7 @@ import { customElement, property, query, state } from "lit/decorators"; import { fireEvent } from "../common/dom/fire_event"; import type { LocalizeFunc } from "../common/translations/localize"; import { debounce } from "../common/util/debounce"; +import "../components/ha-button"; import "../components/ha-form/ha-form"; import type { HaForm } from "../components/ha-form/ha-form"; import type { @@ -76,8 +76,7 @@ class OnboardingCreateUser extends LitElement { @value-changed=${this._handleValueChanged} >
- ${this.localize("ui.panel.page-onboarding.user.create_account")} - +
`; } diff --git a/src/onboarding/onboarding-integrations.ts b/src/onboarding/onboarding-integrations.ts index df05f06b6b..f459b664d4 100644 --- a/src/onboarding/onboarding-integrations.ts +++ b/src/onboarding/onboarding-integrations.ts @@ -134,7 +134,7 @@ class OnboardingIntegrations extends SubscribeMixin(LitElement) { )}

- + ${this.onboardingLocalize( "ui.panel.page-onboarding.integration.finish" )} diff --git a/src/onboarding/onboarding-location.ts b/src/onboarding/onboarding-location.ts index 8ac0c60669..7116b3bf62 100644 --- a/src/onboarding/onboarding-location.ts +++ b/src/onboarding/onboarding-location.ts @@ -1,5 +1,3 @@ -import "@material/mwc-button/mwc-button"; - import { mdiCrosshairsGps, mdiMagnify, @@ -14,6 +12,7 @@ import { fireEvent } from "../common/dom/fire_event"; import type { LocalizeFunc } from "../common/translations/localize"; import "../components/ha-alert"; import "../components/ha-list"; +import "../components/ha-button"; import "../components/ha-list-item"; import "../components/ha-radio"; import "../components/ha-spinner"; @@ -194,11 +193,11 @@ class OnboardingLocation extends LitElement {

${addressAttribution}

- + ${this.onboardingLocalize( "ui.panel.page-onboarding.core-config.finish" )} - +
`; } diff --git a/src/onboarding/onboarding-welcome.ts b/src/onboarding/onboarding-welcome.ts index 0ec5700f98..5bfab27cde 100644 --- a/src/onboarding/onboarding-welcome.ts +++ b/src/onboarding/onboarding-welcome.ts @@ -22,7 +22,7 @@ class OnboardingWelcome extends LitElement {

${this.localize("ui.panel.page-onboarding.welcome.header")}

${this.localize("ui.panel.page-onboarding.intro")}

- + ${this.localize("ui.panel.page-onboarding.welcome.start")} @@ -94,6 +94,7 @@ class OnboardingWelcome extends LitElement { } .start { margin: 32px 0; + width: 100%; } ha-divider { --ha-divider-width: calc(100% + 64px); diff --git a/src/panels/config/application_credentials/dialog-add-application-credential.ts b/src/panels/config/application_credentials/dialog-add-application-credential.ts index 83f55fcb15..2bdfce39a2 100644 --- a/src/panels/config/application_credentials/dialog-add-application-credential.ts +++ b/src/panels/config/application_credentials/dialog-add-application-credential.ts @@ -227,7 +227,11 @@ export class DialogAddApplicationCredential extends LitElement {
` : html` - + ${this.hass.localize("ui.common.cancel")} ${this.hass.localize("ui.common.delete")} ` : nothing}
- + ${this.hass.localize("ui.common.cancel")} ${entry ? this.hass.localize("ui.common.save") diff --git a/src/panels/config/areas/dialog-floor-registry-detail.ts b/src/panels/config/areas/dialog-floor-registry-detail.ts index 025117992e..3642df35fb 100644 --- a/src/panels/config/areas/dialog-floor-registry-detail.ts +++ b/src/panels/config/areas/dialog-floor-registry-detail.ts @@ -1,5 +1,3 @@ -import "@material/mwc-button"; - import { mdiTextureBox } from "@mdi/js"; import type { CSSResultGroup } from "lit"; import { css, html, LitElement, nothing } from "lit"; @@ -10,6 +8,7 @@ import { fireEvent } from "../../../common/dom/fire_event"; import "../../../components/chips/ha-chip-set"; import "../../../components/chips/ha-input-chip"; import "../../../components/ha-alert"; +import "../../../components/ha-button"; import "../../../components/ha-aliases-editor"; import { createCloseHeading } from "../../../components/ha-dialog"; import "../../../components/ha-icon-picker"; @@ -227,18 +226,22 @@ class DialogFloorDetail extends LitElement { >
- + ${this.hass.localize("ui.common.cancel")} - - + ${entry ? this.hass.localize("ui.common.save") : this.hass.localize("ui.common.create")} - + `; } diff --git a/src/panels/config/automation/action/ha-automation-action.ts b/src/panels/config/automation/action/ha-automation-action.ts index e41f9e500f..713c80a7b5 100644 --- a/src/panels/config/automation/action/ha-automation-action.ts +++ b/src/panels/config/automation/action/ha-automation-action.ts @@ -108,23 +108,26 @@ export default class HaAutomationAction extends LitElement { )}
+ + ${this.hass.localize( "ui.panel.config.automation.editor.actions.add" )} - @click=${this._addActionDialog} - > - + + ${this.hass.localize( "ui.panel.config.automation.editor.actions.add_building_block" )} - @click=${this._addActionBuildingBlockDialog} - > -
diff --git a/src/panels/config/automation/automation-save-dialog/dialog-automation-save.ts b/src/panels/config/automation/automation-save-dialog/dialog-automation-save.ts index 4df25b260c..33dcc0b764 100644 --- a/src/panels/config/automation/automation-save-dialog/dialog-automation-save.ts +++ b/src/panels/config/automation/automation-save-dialog/dialog-automation-save.ts @@ -1,4 +1,3 @@ -import "@material/mwc-button"; import type { CSSResultGroup } from "lit"; import { css, html, LitElement, nothing } from "lit"; import { customElement, property, state } from "lit/decorators"; @@ -101,7 +100,8 @@ class DialogAutomationSave extends LitElement implements HassDialog { ${this.hass.localize("ui.common.dont_save")} @@ -264,16 +264,16 @@ class DialogAutomationSave extends LitElement implements HassDialog { ${this._renderInputs()} ${this._renderDiscard()}
- + ${this.hass.localize("ui.common.cancel")} - - + + ${this.hass.localize( this._params.config.alias && !this._params.onDiscard ? "ui.panel.config.automation.editor.rename" : "ui.panel.config.automation.editor.save" )} - +
`; @@ -378,9 +378,6 @@ class DialogAutomationSave extends LitElement implements HassDialog { display: block; margin-bottom: 16px; } - .destructive { - --mdc-theme-primary: var(--error-color); - } `, ]; } diff --git a/src/panels/config/automation/condition/ha-automation-condition.ts b/src/panels/config/automation/condition/ha-automation-condition.ts index f1557a7956..cd77294af9 100644 --- a/src/panels/config/automation/condition/ha-automation-condition.ts +++ b/src/panels/config/automation/condition/ha-automation-condition.ts @@ -157,23 +157,26 @@ export default class HaAutomationCondition extends LitElement { )}
+ + ${this.hass.localize( "ui.panel.config.automation.editor.conditions.add" )} - @click=${this._addConditionDialog} - > - + + ${this.hass.localize( "ui.panel.config.automation.editor.conditions.add_building_block" )} - @click=${this._addConditionBuildingBlockDialog} - > -
diff --git a/src/panels/config/automation/ha-automation-picker.ts b/src/panels/config/automation/ha-automation-picker.ts index 633c882040..30b07fedd3 100644 --- a/src/panels/config/automation/ha-automation-picker.ts +++ b/src/panels/config/automation/ha-automation-picker.ts @@ -9,6 +9,7 @@ import { mdiHelpCircle, mdiInformationOutline, mdiMenuDown, + mdiOpenInNew, mdiPlay, mdiPlus, mdiRobotHappy, @@ -804,18 +805,20 @@ class HaAutomationPicker extends SubscribeMixin(LitElement) { { user: this.hass.user?.name || "Alice" } )}

- - - ${this.hass.localize("ui.panel.config.common.learn_more")} - - + ${this.hass.localize("ui.panel.config.common.learn_more")} + + + ` : nothing } @@ -1454,6 +1457,9 @@ ${rejected --mdc-icon-size: 80px; max-width: 500px; } + .empty ha-button { + --mdc-icon-size: 24px; + } .empty h1 { font-size: var(--ha-font-size-3xl); } diff --git a/src/panels/config/automation/manual-automation-editor.ts b/src/panels/config/automation/manual-automation-editor.ts index 3d69ee8752..d7f5b24eef 100644 --- a/src/panels/config/automation/manual-automation-editor.ts +++ b/src/panels/config/automation/manual-automation-editor.ts @@ -1,10 +1,9 @@ -import "@material/mwc-button/mwc-button"; import { mdiHelpCircle } from "@mdi/js"; import type { HassEntity } from "home-assistant-js-websocket"; +import { load } from "js-yaml"; import type { CSSResultGroup, PropertyValues } from "lit"; import { css, html, LitElement, nothing } from "lit"; import { customElement, property, state } from "lit/decorators"; -import { load } from "js-yaml"; import { any, array, @@ -16,7 +15,14 @@ import { union, } from "superstruct"; import { ensureArray } from "../../../common/array/ensure-array"; +import { canOverrideAlphanumericInput } from "../../../common/dom/can-override-input"; import { fireEvent } from "../../../common/dom/fire_event"; +import { constructUrlCurrentPath } from "../../../common/url/construct-url"; +import { + extractSearchParam, + removeSearchParam, +} from "../../../common/url/search-params"; +import "../../../components/ha-button"; import "../../../components/ha-card"; import "../../../components/ha-icon-button"; import "../../../components/ha-markdown"; @@ -35,20 +41,14 @@ import { getActionType, type Action } from "../../../data/script"; import { haStyle } from "../../../resources/styles"; import type { HomeAssistant } from "../../../types"; import { documentationUrl } from "../../../util/documentation-url"; +import { showToast } from "../../../util/toast"; import "./action/ha-automation-action"; +import type HaAutomationAction from "./action/ha-automation-action"; import "./condition/ha-automation-condition"; +import type HaAutomationCondition from "./condition/ha-automation-condition"; +import { showPasteReplaceDialog } from "./paste-replace-dialog/show-dialog-paste-replace"; import "./trigger/ha-automation-trigger"; import type HaAutomationTrigger from "./trigger/ha-automation-trigger"; -import type HaAutomationAction from "./action/ha-automation-action"; -import type HaAutomationCondition from "./condition/ha-automation-condition"; -import { - extractSearchParam, - removeSearchParam, -} from "../../../common/url/search-params"; -import { constructUrlCurrentPath } from "../../../common/url/construct-url"; -import { canOverrideAlphanumericInput } from "../../../common/dom/can-override-input"; -import { showToast } from "../../../util/toast"; -import { showPasteReplaceDialog } from "./paste-replace-dialog/show-dialog-paste-replace"; const baseConfigStruct = object({ alias: optional(string()), @@ -130,11 +130,16 @@ export class HaManualAutomationEditor extends LitElement { ${this.hass.localize( "ui.panel.config.automation.editor.disabled" )} - + ${this.hass.localize( "ui.panel.config.automation.editor.enable" )} - + ` : nothing} diff --git a/src/panels/config/automation/trigger/ha-automation-trigger.ts b/src/panels/config/automation/trigger/ha-automation-trigger.ts index cc6219d0cc..1f9c6c389a 100644 --- a/src/panels/config/automation/trigger/ha-automation-trigger.ts +++ b/src/panels/config/automation/trigger/ha-automation-trigger.ts @@ -109,14 +109,15 @@ export default class HaAutomationTrigger extends LitElement { )}
- + ${this.hass.localize( + "ui.panel.config.automation.editor.triggers.add" + )} +
diff --git a/src/panels/config/blueprint/dialog-import-blueprint.ts b/src/panels/config/blueprint/dialog-import-blueprint.ts index bbf300c7be..76c96719a1 100644 --- a/src/panels/config/blueprint/dialog-import-blueprint.ts +++ b/src/panels/config/blueprint/dialog-import-blueprint.ts @@ -1,16 +1,16 @@ -import "@material/mwc-button"; -import { mdiOpenInNew, mdiClose } from "@mdi/js"; +import { mdiClose, mdiOpenInNew } from "@mdi/js"; import { css, html, LitElement, nothing } from "lit"; import { customElement, property, query, state } from "lit/decorators"; import { fireEvent } from "../../../common/dom/fire_event"; -import "../../../components/ha-spinner"; -import "../../../components/ha-expansion-panel"; -import "../../../components/ha-markdown"; import "../../../components/ha-alert"; -import "../../../components/ha-textfield"; +import "../../../components/ha-button"; +import "../../../components/ha-code-editor"; import "../../../components/ha-dialog"; import "../../../components/ha-dialog-header"; -import "../../../components/ha-code-editor"; +import "../../../components/ha-expansion-panel"; +import "../../../components/ha-markdown"; +import "../../../components/ha-spinner"; +import "../../../components/ha-textfield"; import type { HaTextField } from "../../../components/ha-textfield"; import type { BlueprintImportResult } from "../../../data/blueprint"; import { importBlueprint, saveBlueprint } from "../../../data/blueprint"; @@ -137,7 +137,9 @@ class DialogImportBlueprint extends LitElement { "ui.panel.config.blueprint.add.import_introduction" )}

- - + + `} - ${this.hass.localize("ui.common.cancel")} - + ${!this._result ? html` - - ${this._importing - ? html`` - : ""} ${this.hass.localize( "ui.panel.config.blueprint.add.import_btn" )} - + ` : html` - - ${this._saving - ? html`` - : ""} ${this._result.exists ? this.hass.localize( "ui.panel.config.blueprint.add.save_btn_override" @@ -205,7 +203,7 @@ class DialogImportBlueprint extends LitElement { : this.hass.localize( "ui.panel.config.blueprint.add.save_btn" )} - + `} `; diff --git a/src/panels/config/blueprint/ha-blueprint-overview.ts b/src/panels/config/blueprint/ha-blueprint-overview.ts index 6ac304a956..d9b14079b3 100644 --- a/src/panels/config/blueprint/ha-blueprint-overview.ts +++ b/src/panels/config/blueprint/ha-blueprint-overview.ts @@ -4,6 +4,7 @@ import { mdiDownload, mdiEye, mdiHelpCircle, + mdiOpenInNew, mdiPlus, mdiShareVariant, } from "@mdi/js"; @@ -11,10 +12,12 @@ import type { CSSResultGroup, PropertyValues, TemplateResult } from "lit"; import { LitElement, html } from "lit"; import { customElement, property, state } from "lit/decorators"; import memoizeOne from "memoize-one"; +import { storage } from "../../../common/decorators/storage"; import type { HASSDomEvent } from "../../../common/dom/fire_event"; import { fireEvent } from "../../../common/dom/fire_event"; import { computeStateName } from "../../../common/entity/compute_state_name"; import { navigate } from "../../../common/navigate"; +import type { LocalizeFunc } from "../../../common/translations/localize"; import { extractSearchParam } from "../../../common/url/search-params"; import type { DataTableColumnContainer, @@ -47,12 +50,10 @@ import { import "../../../layouts/hass-tabs-subpage-data-table"; import { haStyle } from "../../../resources/styles"; import type { HomeAssistant, Route } from "../../../types"; -import type { LocalizeFunc } from "../../../common/translations/localize"; import { documentationUrl } from "../../../util/documentation-url"; import { showToast } from "../../../util/toast"; import { configSections } from "../ha-panel-config"; import { showAddBlueprintDialog } from "./show-dialog-import-blueprint"; -import { storage } from "../../../common/decorators/storage"; type BlueprintMetaDataPath = BlueprintMetaData & { path: string; @@ -298,17 +299,18 @@ class HaBlueprintOverview extends LitElement { style="width: 100%; text-align: center;" role="cell" > - - ${this.hass.localize( - "ui.panel.config.blueprint.overview.discover_more" - )} - + ${this.hass.localize( + "ui.panel.config.blueprint.overview.discover_more" + )} + + `} .initialGroupColumn=${this._activeGrouping} .initialCollapsedGroups=${this._activeCollapsed} diff --git a/src/panels/config/cloud/login/cloud-login.ts b/src/panels/config/cloud/login/cloud-login.ts index 8c42063569..e482e35adb 100644 --- a/src/panels/config/cloud/login/cloud-login.ts +++ b/src/panels/config/cloud/login/cloud-login.ts @@ -105,6 +105,7 @@ export class CloudLogin extends LitElement {
diff --git a/src/panels/config/cloud/register/cloud-register.ts b/src/panels/config/cloud/register/cloud-register.ts index ac999a37b0..7648b11496 100644 --- a/src/panels/config/cloud/register/cloud-register.ts +++ b/src/panels/config/cloud/register/cloud-register.ts @@ -164,13 +164,6 @@ export class CloudRegister extends LitElement { >
- ${this.hass.localize( - "ui.panel.config.cloud.register.start_trial" - )}
diff --git a/src/panels/config/core/ha-config-section-general.ts b/src/panels/config/core/ha-config-section-general.ts index a3647c8ec1..d9d34ab760 100644 --- a/src/panels/config/core/ha-config-section-general.ts +++ b/src/panels/config/core/ha-config-section-general.ts @@ -8,6 +8,7 @@ import "../../../components/buttons/ha-progress-button"; import type { HaProgressButton } from "../../../components/buttons/ha-progress-button"; import "../../../components/ha-alert"; import "../../../components/ha-card"; +import "../../../components/ha-button"; import "../../../components/ha-checkbox"; import type { HaCheckbox } from "../../../components/ha-checkbox"; import "../../../components/ha-country-picker"; @@ -252,8 +253,12 @@ class HaConfigSectionGeneral extends LitElement { "ui.panel.config.core.section.core.core_config.edit_location_description" )} - ${this.hass.localize("ui.common.edit")}${this.hass.localize("ui.common.edit")}
@@ -261,7 +266,7 @@ class HaConfigSectionGeneral extends LitElement { @click=${this._updateEntry} .disabled=${disabled} > - ${this.hass!.localize("ui.panel.config.zone.detail.update")} + ${this.hass!.localize("ui.common.save")}
diff --git a/src/panels/config/devices/device-detail/ha-device-entities-card.ts b/src/panels/config/devices/device-detail/ha-device-entities-card.ts index e16196b396..42b056852c 100644 --- a/src/panels/config/devices/device-detail/ha-device-entities-card.ts +++ b/src/panels/config/devices/device-detail/ha-device-entities-card.ts @@ -5,10 +5,11 @@ import { classMap } from "lit/directives/class-map"; import { until } from "lit/directives/until"; import { computeEntityName } from "../../../../common/entity/compute_entity_name"; import { stripPrefixFromEntityName } from "../../../../common/entity/strip_prefix_from_entity_name"; +import "../../../../components/ha-button"; import "../../../../components/ha-card"; import "../../../../components/ha-icon"; -import "../../../../components/ha-list-item"; import "../../../../components/ha-list"; +import "../../../../components/ha-list-item"; import type { ExtEntityRegistryEntry } from "../../../../data/entity_registry"; import { getExtendedEntityRegistryEntry } from "../../../../data/entity_registry"; import { entryIcon } from "../../../../data/icons"; @@ -125,11 +126,11 @@ export class HaDeviceEntitiesCard extends LitElement { ` : nothing}
- + ${this.hass.localize( "ui.panel.config.devices.entities.add_entities_lovelace" )} - +
`; diff --git a/src/panels/config/entities/editor-tabs/settings/entity-settings-helper-tab.ts b/src/panels/config/entities/editor-tabs/settings/entity-settings-helper-tab.ts index fff779c4e9..8e71a1db84 100644 --- a/src/panels/config/entities/editor-tabs/settings/entity-settings-helper-tab.ts +++ b/src/panels/config/entities/editor-tabs/settings/entity-settings-helper-tab.ts @@ -22,6 +22,7 @@ import "../../../helpers/forms/ha-schedule-form"; import "../../../helpers/forms/ha-timer-form"; import "../../../voice-assistants/entity-voice-settings"; import "../../entity-registry-settings-editor"; +import "../../../../../components/ha-button"; import type { EntityRegistrySettingsEditor } from "../../entity-registry-settings-editor"; @customElement("entity-settings-helper-tab") @@ -97,20 +98,21 @@ export class EntitySettingsHelperTab extends LitElement { >
- ${this.hass.localize("ui.dialogs.entity_registry.editor.delete")} - - + ${this.hass.localize("ui.dialogs.entity_registry.editor.update")} - +
`; } diff --git a/src/panels/config/entities/entity-registry-settings.ts b/src/panels/config/entities/entity-registry-settings.ts index 89871ba7ac..871e5fdca4 100644 --- a/src/panels/config/entities/entity-registry-settings.ts +++ b/src/panels/config/entities/entity-registry-settings.ts @@ -1,11 +1,10 @@ -import "@material/mwc-button/mwc-button"; - import type { HassEntity } from "home-assistant-js-websocket"; import type { CSSResultGroup, PropertyValues } from "lit"; import { css, html, LitElement } from "lit"; import { customElement, property, query, state } from "lit/decorators"; import { fireEvent } from "../../../common/dom/fire_event"; import "../../../components/ha-alert"; +import "../../../components/ha-button"; import type { ConfigEntry } from "../../../data/config_entries"; import { deleteConfigEntry, @@ -88,27 +87,31 @@ export class EntityRegistrySettings extends SubscribeMixin(LitElement) { ${device?.disabled_by ? html`${this.hass!.localize( "ui.dialogs.entity_registry.editor.device_disabled" - )} ${this.hass!.localize( "ui.dialogs.entity_registry.editor.open_device_settings" )} - ` + ` : this.entry.disabled_by ? html`${this.hass!.localize( "ui.dialogs.entity_registry.editor.entity_disabled" )}${["user", "integration"].includes( this.entry.disabled_by! ) - ? html` ${this.hass!.localize( "ui.dialogs.entity_registry.editor.enable_entity" - )}` : ""}` : this.hass!.localize( @@ -130,20 +133,21 @@ export class EntityRegistrySettings extends SubscribeMixin(LitElement) { >
- ${this.hass.localize("ui.dialogs.entity_registry.editor.delete")} - - + ${this.hass.localize("ui.dialogs.entity_registry.editor.update")} - +
`; } @@ -258,7 +262,7 @@ export class EntityRegistrySettings extends SubscribeMixin(LitElement) { position: sticky; bottom: 0px; } - ha-alert mwc-button { + ha-alert ha-button { width: max-content; } `, diff --git a/src/panels/config/helpers/dialog-helper-detail.ts b/src/panels/config/helpers/dialog-helper-detail.ts index f60ca0b624..8e8e77f552 100644 --- a/src/panels/config/helpers/dialog-helper-detail.ts +++ b/src/panels/config/helpers/dialog-helper-detail.ts @@ -1,4 +1,3 @@ -import "@material/mwc-button/mwc-button"; import { mdiAlertOutline } from "@mdi/js"; import type { CSSResultGroup, TemplateResult } from "lit"; import { css, html, LitElement, nothing } from "lit"; @@ -12,6 +11,7 @@ import { stopPropagation } from "../../../common/dom/stop_propagation"; import { stringCompare } from "../../../common/string/compare"; import { createCloseHeading } from "../../../components/ha-dialog"; import "../../../components/ha-list"; +import "../../../components/ha-button"; import "../../../components/ha-list-item"; import "../../../components/ha-spinner"; import "../../../components/ha-svg-icon"; @@ -161,22 +161,23 @@ export class DialogHelperDetail extends LitElement { new: true, })} - ${this.hass!.localize("ui.panel.config.helpers.dialog.create")} - + ${this._params?.domain ? nothing - : html` ${this.hass!.localize("ui.common.back")} - `} + `} `; } else if (this._loading || this._helperFlows === undefined) { content = html``; diff --git a/src/panels/config/integrations/ha-config-integration-page.ts b/src/panels/config/integrations/ha-config-integration-page.ts index 9c9e9ba764..b1d53ac02f 100644 --- a/src/panels/config/integrations/ha-config-integration-page.ts +++ b/src/panels/config/integrations/ha-config-integration-page.ts @@ -564,11 +564,12 @@ class HaConfigIntegrationPage extends SubscribeMixin(LitElement) { ${flow.localized_title} + > + ${this.hass.localize("ui.common.add")} + ` )} @@ -599,15 +600,16 @@ class HaConfigIntegrationPage extends SubscribeMixin(LitElement) { > + ${this.hass.localize( `ui.panel.config.integrations.${ attention ? "reconfigure" : "configure" }` )} - > + `; })} ${attentionEntries.map( @@ -838,25 +840,33 @@ class HaConfigIntegrationPage extends SubscribeMixin(LitElement) { : nothing} ${item.disabled_by === "user" - ? html` + ? html` ${this.hass.localize("ui.common.enable")} ` : configPanel && (item.domain !== "matter" || isDevVersion(this.hass.config.version)) && !stateText - ? html` - ${this.hass.localize( - "ui.panel.config.integrations.config_entry.configure" - )} - ` + > + ${this.hass.localize( + "ui.panel.config.integrations.config_entry.configure" + )} + ` : item.supports_options ? html` - + ${this.hass.localize( "ui.panel.config.integrations.config_entry.configure" )} @@ -1074,7 +1084,11 @@ class HaConfigIntegrationPage extends SubscribeMixin(LitElement) { ${configEntry.supported_subentry_types[subEntry.subentry_type] ?.supports_reconfigure ? html` - + ${this.hass.localize( "ui.panel.config.integrations.config_entry.configure" )} diff --git a/src/panels/config/labels/dialog-label-detail.ts b/src/panels/config/labels/dialog-label-detail.ts index d511fb937f..916d99f45d 100644 --- a/src/panels/config/labels/dialog-label-detail.ts +++ b/src/panels/config/labels/dialog-label-detail.ts @@ -1,9 +1,9 @@ -import "@material/mwc-button"; import type { CSSResultGroup } from "lit"; import { LitElement, css, html, nothing } from "lit"; import { customElement, property, state } from "lit/decorators"; import { fireEvent } from "../../../common/dom/fire_event"; import "../../../components/ha-alert"; +import "../../../components/ha-button"; import "../../../components/ha-color-picker"; import { createCloseHeading } from "../../../components/ha-dialog"; import "../../../components/ha-icon-picker"; @@ -133,17 +133,18 @@ class DialogLabelDetail ${this._params.entry && this._params.removeEntry ? html` - ${this.hass!.localize("ui.panel.config.labels.detail.delete")} - + ` : nothing} - + `; } diff --git a/src/panels/config/logs/system-log-card.ts b/src/panels/config/logs/system-log-card.ts index bef4875a12..10b74f3ea6 100644 --- a/src/panels/config/logs/system-log-card.ts +++ b/src/panels/config/logs/system-log-card.ts @@ -5,7 +5,6 @@ import memoizeOne from "memoize-one"; import { fireEvent } from "../../../common/dom/fire_event"; import type { LocalizeFunc } from "../../../common/translations/localize"; import "../../../components/buttons/ha-call-service-button"; -import "../../../components/buttons/ha-progress-button"; import "../../../components/ha-button-menu"; import "../../../components/ha-card"; import "../../../components/ha-icon-button"; diff --git a/src/panels/config/lovelace/dashboards/dialog-lovelace-dashboard-detail.ts b/src/panels/config/lovelace/dashboards/dialog-lovelace-dashboard-detail.ts index 633c430892..f633253d00 100644 --- a/src/panels/config/lovelace/dashboards/dialog-lovelace-dashboard-detail.ts +++ b/src/panels/config/lovelace/dashboards/dialog-lovelace-dashboard-detail.ts @@ -1,4 +1,3 @@ -import "@material/mwc-button/mwc-button"; import type { CSSResultGroup } from "lit"; import { css, html, LitElement, nothing } from "lit"; import { customElement, property, state } from "lit/decorators"; @@ -7,6 +6,7 @@ import { fireEvent } from "../../../../common/dom/fire_event"; import { slugify } from "../../../../common/string/slugify"; import { createCloseHeading } from "../../../../components/ha-dialog"; import "../../../../components/ha-form/ha-form"; +import "../../../../components/ha-button"; import type { SchemaUnion } from "../../../../components/ha-form/types"; import type { LovelaceDashboard, @@ -104,20 +104,22 @@ export class DialogLovelaceDashboardDetail extends LitElement { ? html` ${this._params.dashboard?.id ? html` - ${this.hass.localize( "ui.panel.config.lovelace.dashboards.detail.delete" )} - + ` : ""} - + ` : ""} - + `; } diff --git a/src/panels/config/lovelace/dashboards/ha-config-lovelace-dashboards.ts b/src/panels/config/lovelace/dashboards/ha-config-lovelace-dashboards.ts index 1dce7fa90f..4fa4da04c2 100644 --- a/src/panels/config/lovelace/dashboards/ha-config-lovelace-dashboards.ts +++ b/src/panels/config/lovelace/dashboards/ha-config-lovelace-dashboards.ts @@ -22,6 +22,7 @@ import type { } from "../../../../components/data-table/ha-data-table"; import "../../../../components/ha-fab"; import "../../../../components/ha-icon"; +import "../../../../components/ha-button"; import "../../../../components/ha-icon-button"; import "../../../../components/ha-md-button-menu"; import "../../../../components/ha-md-list-item"; @@ -237,12 +238,13 @@ export class HaConfigLovelaceDashboards extends LitElement { > ` : html` - ${this.hass.localize( "ui.panel.config.lovelace.dashboards.picker.open" - )} `, }; diff --git a/src/panels/config/person/dialog-person-detail.ts b/src/panels/config/person/dialog-person-detail.ts index b75c1106f4..a3d6a9afcd 100644 --- a/src/panels/config/person/dialog-person-detail.ts +++ b/src/panels/config/person/dialog-person-detail.ts @@ -236,7 +236,8 @@ class DialogPersonDetail extends LitElement implements HassDialog { ? html` ` : nothing} + + ${this.hass!.localize("ui.common.cancel")} + ${this._params.entry - ? this.hass!.localize("ui.panel.config.person.detail.update") + ? this.hass!.localize("ui.common.save") : this.hass!.localize("ui.panel.config.person.detail.create")} diff --git a/src/panels/config/repairs/dialog-repairs-issue.ts b/src/panels/config/repairs/dialog-repairs-issue.ts index 179d3ac62a..5de0edb0f2 100644 --- a/src/panels/config/repairs/dialog-repairs-issue.ts +++ b/src/panels/config/repairs/dialog-repairs-issue.ts @@ -1,4 +1,4 @@ -import { mdiClose } from "@mdi/js"; +import { mdiClose, mdiOpenInNew } from "@mdi/js"; import type { CSSResultGroup } from "lit"; import { css, html, LitElement, nothing } from "lit"; import { customElement, property, state, query } from "lit/decorators"; @@ -8,6 +8,7 @@ import "../../../components/ha-alert"; import "../../../components/ha-md-dialog"; import type { HaMdDialog } from "../../../components/ha-md-dialog"; import "../../../components/ha-button"; +import "../../../components/ha-svg-icon"; import "../../../components/ha-dialog-header"; import "./dialog-repairs-issue-subtitle"; import "../../../components/ha-markdown"; @@ -122,14 +123,15 @@ class DialogRepairsIssue extends LitElement { : ""}
- + ${this._issue!.ignored ? this.hass!.localize("ui.panel.config.repairs.dialog.unignore") : this.hass!.localize("ui.panel.config.repairs.dialog.ignore")} ${this._issue.learn_more_url ? html` - - - ${this.hass!.localize( - "ui.panel.config.repairs.dialog.learn" - )} - - + ${this.hass!.localize("ui.panel.config.repairs.dialog.learn")} + + ` : ""}
diff --git a/src/panels/config/scene/ha-scene-dashboard.ts b/src/panels/config/scene/ha-scene-dashboard.ts index de91a9f66d..235ed869c0 100644 --- a/src/panels/config/scene/ha-scene-dashboard.ts +++ b/src/panels/config/scene/ha-scene-dashboard.ts @@ -9,6 +9,7 @@ import { mdiHelpCircle, mdiInformationOutline, mdiMenuDown, + mdiOpenInNew, mdiPalette, mdiPencilOff, mdiPlay, @@ -780,15 +781,16 @@ class HaSceneDashboard extends SubscribeMixin(LitElement) {

${this.hass.localize("ui.panel.config.scene.picker.empty_text")}

- - - ${this.hass.localize("ui.panel.config.common.learn_more")} - - + ${this.hass.localize("ui.panel.config.common.learn_more")} + + ` : nothing} @@ -1201,6 +1203,9 @@ ${rejected --mdc-icon-size: 80px; max-width: 500px; } + .empty ha-button { + --mdc-icon-size: 24px; + } .empty h1 { font-size: var(--ha-font-size-3xl); } diff --git a/src/panels/config/scene/ha-scene-editor.ts b/src/panels/config/scene/ha-scene-editor.ts index d118cbf9c9..add13b843e 100644 --- a/src/panels/config/scene/ha-scene-editor.ts +++ b/src/panels/config/scene/ha-scene-editor.ts @@ -361,7 +361,11 @@ export class HaSceneEditor extends PreventUnsavedMixin( : mdiEye} > - + ${this.hass.localize( `ui.panel.config.scene.editor.${this._mode === "live" ? "switch_to_review_mode" : "live_edit"}` )} @@ -1258,10 +1262,6 @@ export class HaSceneEditor extends PreventUnsavedMixin( display: block; margin-bottom: 24px; } - ha-button { - white-space: nowrap; - --mdc-theme-primary: var(--primary-color); - } ha-fab.dirty { bottom: 0; } diff --git a/src/panels/config/script/ha-script-picker.ts b/src/panels/config/script/ha-script-picker.ts index 1c54655e4d..7a0f2a1921 100644 --- a/src/panels/config/script/ha-script-picker.ts +++ b/src/panels/config/script/ha-script-picker.ts @@ -9,6 +9,7 @@ import { mdiHelpCircle, mdiInformationOutline, mdiMenuDown, + mdiOpenInNew, mdiPlay, mdiPlus, mdiScriptText, @@ -779,15 +780,16 @@ class HaScriptPicker extends SubscribeMixin(LitElement) { "ui.panel.config.script.picker.empty_text" )}

- - - ${this.hass.localize("ui.panel.config.common.learn_more")} - - + ${this.hass.localize("ui.panel.config.common.learn_more")} + + ` : nothing} ${this._params.entry ? html` - ${this.hass!.localize("ui.panel.config.tag.detail.delete")} - + ` : nothing} - + ${this._params.openWrite && !this._params.entry - ? html`` + ` : ""} `; diff --git a/src/panels/config/users/dialog-add-user.ts b/src/panels/config/users/dialog-add-user.ts index 0e670498a8..831f96631e 100644 --- a/src/panels/config/users/dialog-add-user.ts +++ b/src/panels/config/users/dialog-add-user.ts @@ -190,24 +190,25 @@ export class DialogAddUser extends LitElement { ` : nothing} - ${this._loading - ? html` - - ` - : html` - - ${this.hass.localize("ui.panel.config.users.add_user.create")} - - `} + + + ${this.hass!.localize("ui.common.cancel")} + + + ${this.hass.localize("ui.panel.config.users.add_user.create")} + `; } diff --git a/src/panels/config/users/dialog-user-detail.ts b/src/panels/config/users/dialog-user-detail.ts index 3d5b079028..67374d2c73 100644 --- a/src/panels/config/users/dialog-user-detail.ts +++ b/src/panels/config/users/dialog-user-detail.ts @@ -219,28 +219,31 @@ class DialogUserDetail extends LitElement { : nothing} -
- - ${this.hass!.localize("ui.panel.config.users.editor.delete_user")} - -
- -
- - ${this.hass!.localize("ui.panel.config.users.editor.update_user")} - -
+ + ${this.hass!.localize("ui.panel.config.users.editor.delete_user")} + + + ${this.hass!.localize("ui.common.cancel")} + + + ${this.hass!.localize("ui.common.save")} + `; } diff --git a/src/panels/config/voice-assistants/assist-pref.ts b/src/panels/config/voice-assistants/assist-pref.ts index f6b14283be..039a2aee40 100644 --- a/src/panels/config/voice-assistants/assist-pref.ts +++ b/src/panels/config/voice-assistants/assist-pref.ts @@ -206,11 +206,16 @@ export class AssistPref extends LitElement { ` )} - + ${this.hass.localize( "ui.panel.config.voice_assistants.assistants.pipeline.add_assistant" )} - + @@ -230,30 +235,30 @@ export class AssistPref extends LitElement { >
- - - ${this.hass.localize( - "ui.panel.config.voice_assistants.assistants.pipeline.exposed_entities", - { - number: this.exposedEntities - ? this._exposedEntitiesCount(this.exposedEntities) - : 0, - } - )} - - + ${this.hass.localize( + "ui.panel.config.voice_assistants.assistants.pipeline.exposed_entities", + { + number: this.exposedEntities + ? this._exposedEntitiesCount(this.exposedEntities) + : 0, + } + )} + ${this._pipelineEntitiesCount > 0 ? html` - - - ${this.hass.localize( - "ui.panel.config.voice_assistants.assistants.pipeline.assist_devices", - { number: this._pipelineEntitiesCount } - )} - - + + ${this.hass.localize( + "ui.panel.config.voice_assistants.assistants.pipeline.assist_devices", + { number: this._pipelineEntitiesCount } + )} + ` : ""}
diff --git a/src/panels/config/voice-assistants/cloud-discover.ts b/src/panels/config/voice-assistants/cloud-discover.ts index 5ed735f805..f846dcd386 100644 --- a/src/panels/config/voice-assistants/cloud-discover.ts +++ b/src/panels/config/voice-assistants/cloud-discover.ts @@ -81,31 +81,35 @@ export class CloudDiscover extends LitElement {
- + ${this.hass.localize( "ui.panel.config.voice_assistants.assistants.cloud.and_more" )} - - + +
${isComponentLoaded(this.hass, "cloud") ? html`
- + ${this.hass.localize( "ui.panel.config.voice_assistants.assistants.cloud.sign_in" )} - - - ${this.hass.localize( - "ui.panel.config.voice_assistants.assistants.cloud.try_one_month" - )} - - + + ${this.hass.localize( + "ui.panel.config.voice_assistants.assistants.cloud.try_one_month" + )} +
` : nothing} diff --git a/src/panels/config/voice-assistants/dialog-expose-entity.ts b/src/panels/config/voice-assistants/dialog-expose-entity.ts index 05819a20ee..4e2c52d6b2 100644 --- a/src/panels/config/voice-assistants/dialog-expose-entity.ts +++ b/src/panels/config/voice-assistants/dialog-expose-entity.ts @@ -1,5 +1,4 @@ import "@lit-labs/virtualizer"; -import "@material/mwc-button"; import { mdiClose } from "@mdi/js"; import type { HassEntity } from "home-assistant-js-websocket"; import type { CSSResultGroup } from "lit"; @@ -12,6 +11,7 @@ import { computeStateName } from "../../../common/entity/compute_state_name"; import "../../../components/ha-check-list-item"; import "../../../components/search-input"; import "../../../components/ha-dialog"; +import "../../../components/ha-button"; import "../../../components/ha-dialog-header"; import "../../../components/ha-state-icon"; import "../../../components/ha-list"; @@ -95,7 +95,14 @@ class DialogExposeEntity extends LitElement { > - + ${this.hass!.localize("ui.common.cancel")} + + + `; } diff --git a/src/panels/config/zone/dialog-home-zone-detail.ts b/src/panels/config/zone/dialog-home-zone-detail.ts index d82eee00b6..9c962f3423 100644 --- a/src/panels/config/zone/dialog-home-zone-detail.ts +++ b/src/panels/config/zone/dialog-home-zone-detail.ts @@ -1,4 +1,3 @@ -import "@material/mwc-button"; import type { CSSResultGroup } from "lit"; import { css, html, LitElement, nothing } from "lit"; import { property, state } from "lit/decorators"; @@ -6,6 +5,7 @@ import memoizeOne from "memoize-one"; import { fireEvent } from "../../../common/dom/fire_event"; import { createCloseHeading } from "../../../components/ha-dialog"; import "../../../components/ha-form/ha-form"; +import "../../../components/ha-button"; import type { HomeZoneMutableParams } from "../../../data/zone"; import { haStyleDialog } from "../../../resources/styles"; import type { HomeAssistant } from "../../../types"; @@ -76,13 +76,20 @@ class DialogHomeZoneDetail extends LitElement { @value-changed=${this._valueChanged} > - + ${this.hass!.localize("ui.common.cancel")} + + - ${this.hass!.localize("ui.panel.config.zone.detail.update")} - + ${this.hass!.localize("ui.common.save")} + `; } diff --git a/src/panels/config/zone/dialog-zone-detail.ts b/src/panels/config/zone/dialog-zone-detail.ts index 00e3698e1d..1e6cff1073 100644 --- a/src/panels/config/zone/dialog-zone-detail.ts +++ b/src/panels/config/zone/dialog-zone-detail.ts @@ -1,4 +1,3 @@ -import "@material/mwc-button"; import type { CSSResultGroup } from "lit"; import { css, html, LitElement, nothing } from "lit"; import { property, state } from "lit/decorators"; @@ -7,6 +6,7 @@ import { fireEvent } from "../../../common/dom/fire_event"; import { addDistanceToCoord } from "../../../common/location/add_distance_to_coord"; import { createCloseHeading } from "../../../components/ha-dialog"; import "../../../components/ha-form/ha-form"; +import "../../../components/ha-button"; import type { SchemaUnion } from "../../../components/ha-form/types"; import type { ZoneMutableParams } from "../../../data/zone"; import { getZoneEditorInitData } from "../../../data/zone"; @@ -102,25 +102,33 @@ class DialogZoneDetail extends LitElement { ${this._params.entry ? html` - ${this.hass!.localize("ui.panel.config.zone.detail.delete")} - + ` : nothing} - + ${this.hass!.localize("ui.common.cancel")} + + ${this._params.entry - ? this.hass!.localize("ui.panel.config.zone.detail.update") + ? this.hass!.localize("ui.common.save") : this.hass!.localize("ui.panel.config.zone.detail.create")} - + `; } diff --git a/src/panels/developer-tools/action/developer-tools-action.ts b/src/panels/developer-tools/action/developer-tools-action.ts index 610b53be71..b9a6f4c48a 100644 --- a/src/panels/developer-tools/action/developer-tools-action.ts +++ b/src/panels/developer-tools/action/developer-tools-action.ts @@ -168,7 +168,8 @@ class HaPanelDevAction extends LitElement {
- @@ -179,7 +180,7 @@ class HaPanelDevAction extends LitElement { : this.hass.localize( "ui.panel.developer-tools.tabs.actions.yaml_mode" )} - + ${!this._uiAvailable ? html`${this.hass.localize( @@ -211,7 +212,10 @@ class HaPanelDevAction extends LitElement { has-extra-actions .value=${this._response} > - ${this.hass.localize( "ui.panel.developer-tools.tabs.actions.copy_clipboard_template" )} ${this._yamlMode - ? html`${this.hass.localize( "ui.panel.developer-tools.tabs.actions.fill_example_data" - )}` : ""} diff --git a/src/panels/developer-tools/assist/developer-tools-assist.ts b/src/panels/developer-tools/assist/developer-tools-assist.ts index 7cf30d9905..3a9249de92 100644 --- a/src/panels/developer-tools/assist/developer-tools-assist.ts +++ b/src/panels/developer-tools/assist/developer-tools-assist.ts @@ -150,6 +150,7 @@ class HaPanelDevAssist extends SubscribeMixin(LitElement) {
diff --git a/src/panels/developer-tools/event/developer-tools-event.ts b/src/panels/developer-tools/event/developer-tools-event.ts index a75ab05a85..920dbde4ac 100644 --- a/src/panels/developer-tools/event/developer-tools-event.ts +++ b/src/panels/developer-tools/event/developer-tools-event.ts @@ -79,7 +79,7 @@ class HaPanelDevEvent extends LitElement {
${this.hass.localize( "ui.panel.developer-tools.tabs.events.fire_event" @@ -171,7 +171,7 @@ class HaPanelDevEvent extends LitElement { max-width: 400px; } - mwc-button { + ha-button { margin-top: 8px; } diff --git a/src/panels/developer-tools/event/event-subscribe-card.ts b/src/panels/developer-tools/event/event-subscribe-card.ts index 32b2cb98d0..05fe111868 100644 --- a/src/panels/developer-tools/event/event-subscribe-card.ts +++ b/src/panels/developer-tools/event/event-subscribe-card.ts @@ -62,7 +62,7 @@ class EventSubscribeCard extends LitElement {
@@ -75,7 +75,7 @@ class EventSubscribeCard extends LitElement { )} diff --git a/src/panels/developer-tools/statistics/dialog-statistics-fix-units-changed.ts b/src/panels/developer-tools/statistics/dialog-statistics-fix-units-changed.ts index c5ab6b3d9f..e4ca0220d4 100644 --- a/src/panels/developer-tools/statistics/dialog-statistics-fix-units-changed.ts +++ b/src/panels/developer-tools/statistics/dialog-statistics-fix-units-changed.ts @@ -1,9 +1,9 @@ -import "@material/mwc-button/mwc-button"; import type { CSSResultGroup } from "lit"; import { html, LitElement, nothing } from "lit"; import { customElement, property, state } from "lit/decorators"; import { fireEvent } from "../../../common/dom/fire_event"; import "../../../components/ha-dialog"; +import "../../../components/ha-button"; import "../../../components/ha-formfield"; import "../../../components/ha-radio"; import { @@ -107,14 +107,18 @@ export class DialogStatisticsFixUnitsChanged extends LitElement { > - + + ${this.hass.localize("ui.common.close")} + + ${this.hass.localize( "ui.panel.developer-tools.tabs.statistics.fix_issue.fix" )} - - - ${this.hass.localize("ui.common.close")} - + `; } diff --git a/src/panels/developer-tools/statistics/dialog-statistics-fix.ts b/src/panels/developer-tools/statistics/dialog-statistics-fix.ts index 5a1a4e5e94..27e2c960f6 100644 --- a/src/panels/developer-tools/statistics/dialog-statistics-fix.ts +++ b/src/panels/developer-tools/statistics/dialog-statistics-fix.ts @@ -1,16 +1,16 @@ -import "@material/mwc-button/mwc-button"; import type { CSSResultGroup } from "lit"; import { html, LitElement, nothing } from "lit"; import { customElement, property, state } from "lit/decorators"; -import "../../../components/ha-spinner"; import { fireEvent } from "../../../common/dom/fire_event"; +import "../../../components/ha-button"; import "../../../components/ha-dialog"; +import "../../../components/ha-spinner"; import { clearStatistics, getStatisticLabel } from "../../../data/recorder"; import { haStyle, haStyleDialog } from "../../../resources/styles"; import type { HomeAssistant } from "../../../types"; import { documentationUrl } from "../../../util/documentation-url"; -import type { DialogStatisticsFixParams } from "./show-dialog-statistics-fix"; import { showAlertDialog } from "../../lovelace/custom-card-helpers"; +import type { DialogStatisticsFixParams } from "./show-dialog-statistics-fix"; @customElement("dialog-statistics-fix") export class DialogStatisticsFix extends LitElement { @@ -148,26 +148,25 @@ export class DialogStatisticsFix extends LitElement {

${issue.type !== "entity_not_recorded" - ? html` + ${this.hass.localize("ui.common.close")} + + - ${this._clearing - ? html`` - : nothing} ${this.hass.localize("ui.common.delete")} - - - ${this.hass.localize("ui.common.close")} - ` - : html` + ` + : html` ${this.hass.localize("ui.common.ok")} - `} + `} `; } diff --git a/src/panels/developer-tools/template/developer-tools-template.ts b/src/panels/developer-tools/template/developer-tools-template.ts index e43b12cdd7..5c876a186a 100644 --- a/src/panels/developer-tools/template/developer-tools-template.ts +++ b/src/panels/developer-tools/template/developer-tools-template.ts @@ -1,4 +1,3 @@ -import "@material/mwc-button/mwc-button"; import type { UnsubscribeFunc } from "home-assistant-js-websocket"; import type { CSSResultGroup } from "lit"; import { css, html, LitElement, nothing } from "lit"; @@ -7,6 +6,7 @@ import { classMap } from "lit/directives/class-map"; import { debounce } from "../../../common/util/debounce"; import "../../../components/ha-alert"; import "../../../components/ha-spinner"; +import "../../../components/ha-button"; import "../../../components/ha-code-editor"; import "../../../components/ha-card"; import type { RenderTemplateResult } from "../../../data/ws-templates"; @@ -149,14 +149,14 @@ class HaPanelDevTemplate extends LitElement { >
- + ${this.hass.localize( "ui.panel.developer-tools.tabs.templates.reset" )} - - + + ${this.hass.localize("ui.common.clear")} - +
diff --git a/src/panels/developer-tools/yaml_configuration/developer-yaml-config.ts b/src/panels/developer-tools/yaml_configuration/developer-yaml-config.ts index b74587916b..5b33d1fdb7 100644 --- a/src/panels/developer-tools/yaml_configuration/developer-yaml-config.ts +++ b/src/panels/developer-tools/yaml_configuration/developer-yaml-config.ts @@ -1,16 +1,16 @@ -import "@material/mwc-button"; import type { CSSResultGroup, TemplateResult } from "lit"; import { css, html, LitElement, nothing } from "lit"; import { customElement, property, state } from "lit/decorators"; import { componentsWithService } from "../../../common/config/components_with_service"; +import { stringCompare } from "../../../common/string/compare"; import "../../../components/buttons/ha-call-service-button"; import "../../../components/ha-alert"; +import "../../../components/ha-button"; import "../../../components/ha-card"; import "../../../components/ha-spinner"; import type { CheckConfigResult } from "../../../data/core"; import { checkCoreConfig } from "../../../data/core"; import { domainToName } from "../../../data/integration"; -import { stringCompare } from "../../../common/string/compare"; import { showRestartDialog } from "../../../dialogs/restart/show-dialog-restart"; import { haStyle } from "../../../resources/styles"; import type { HomeAssistant, Route, TranslationDict } from "../../../types"; @@ -144,20 +144,21 @@ export class DeveloperYamlConfig extends LitElement { `}
- + ${this.hass.localize( "ui.panel.developer-tools.tabs.yaml.section.validation.check_config" )} - - + ${this.hass.localize( "ui.panel.developer-tools.tabs.yaml.section.server_management.restart" )} - +
`}
${this._step > 0 - ? html`${this.hass.localize("ui.panel.energy.setup.back")}${this.hass.localize("ui.panel.energy.setup.back")}` : html`
`} ${this._step < 4 - ? html`${this.hass.localize("ui.panel.energy.setup.next")}${this.hass.localize("ui.panel.energy.setup.next")}` - : html` + : html` ${this.hass.localize("ui.panel.energy.setup.done")} - `} + `}
`; } @@ -170,7 +170,7 @@ export class EnergySetupWizard extends LitElement implements LovelaceCard { max-width: 700px; margin: 0 auto; } - mwc-button { + ha-button { margin-top: 8px; } .buttons { diff --git a/src/panels/lovelace/editor/card-editor/hui-dialog-create-card.ts b/src/panels/lovelace/editor/card-editor/hui-dialog-create-card.ts index 46927da9c8..f99c35de48 100644 --- a/src/panels/lovelace/editor/card-editor/hui-dialog-create-card.ts +++ b/src/panels/lovelace/editor/card-editor/hui-dialog-create-card.ts @@ -6,6 +6,7 @@ import { cache } from "lit/directives/cache"; import { classMap } from "lit/directives/class-map"; import { ifDefined } from "lit/directives/if-defined"; import { fireEvent } from "../../../../common/dom/fire_event"; +import "../../../../components/ha-button"; import "../../../../components/ha-dialog"; import "../../../../components/ha-dialog-header"; import "../../../../components/sl-tab-group"; @@ -159,14 +160,14 @@ export class HuiCreateDialogCard )}
- + ${this.hass!.localize("ui.common.cancel")} - + ${this._selectedEntities.length ? html` - + ${this.hass!.localize("ui.common.continue")} - + ` : ""}
diff --git a/src/panels/lovelace/editor/card-editor/hui-dialog-edit-card.ts b/src/panels/lovelace/editor/card-editor/hui-dialog-edit-card.ts index ed1a507966..f9195b5cac 100644 --- a/src/panels/lovelace/editor/card-editor/hui-dialog-edit-card.ts +++ b/src/panels/lovelace/editor/card-editor/hui-dialog-edit-card.ts @@ -8,6 +8,7 @@ import type { HASSDomEvent } from "../../../../common/dom/fire_event"; import { fireEvent } from "../../../../common/dom/fire_event"; import { computeRTLDirection } from "../../../../common/util/compute_rtl"; import "../../../../components/ha-spinner"; +import "../../../../components/ha-button"; import "../../../../components/ha-dialog"; import "../../../../components/ha-dialog-header"; import "../../../../components/ha-icon-button"; @@ -238,39 +239,38 @@ export class HuiDialogEditCard
${this._cardConfig !== undefined ? html` - ${this.hass!.localize( !this._cardEditorEl || this._GUImode ? "ui.panel.lovelace.editor.edit_card.show_code_editor" : "ui.panel.lovelace.editor.edit_card.show_visual_editor" )} - + ` : ""}
- + ${this.hass!.localize("ui.common.cancel")} - + ${this._cardConfig !== undefined && this._dirty ? html` - - ${this._saving - ? html` - - ` - : this.hass!.localize("ui.common.save")} - + ${this.hass!.localize("ui.common.save")} + ` : ``}
diff --git a/src/panels/lovelace/editor/card-editor/hui-dialog-suggest-card.ts b/src/panels/lovelace/editor/card-editor/hui-dialog-suggest-card.ts index 664eaf6f29..aa3c50e90c 100644 --- a/src/panels/lovelace/editor/card-editor/hui-dialog-suggest-card.ts +++ b/src/panels/lovelace/editor/card-editor/hui-dialog-suggest-card.ts @@ -3,10 +3,11 @@ import type { CSSResultGroup } from "lit"; import { css, html, LitElement, nothing } from "lit"; import { customElement, property, query, state } from "lit/decorators"; import { fireEvent } from "../../../../common/dom/fire_event"; +import "../../../../components/ha-button"; import "../../../../components/ha-yaml-editor"; -import type { HaYamlEditor } from "../../../../components/ha-yaml-editor"; import "../../../../components/ha-spinner"; +import type { HaYamlEditor } from "../../../../components/ha-yaml-editor"; import type { LovelaceCardConfig } from "../../../../data/lovelace/config/card"; import type { LovelaceSectionConfig } from "../../../../data/lovelace/config/section"; import type { LovelaceConfig } from "../../../../data/lovelace/config/types"; @@ -14,11 +15,11 @@ import { isStrategyView } from "../../../../data/lovelace/config/view"; import { haStyleDialog } from "../../../../resources/styles"; import type { HomeAssistant } from "../../../../types"; import { showSaveSuccessToast } from "../../../../util/toast-saved-success"; +import "../../cards/hui-card"; import "../../sections/hui-section"; import { addCards, addSection } from "../config-util"; import type { LovelaceContainerPath } from "../lovelace-path"; import { parseLovelaceContainerPath } from "../lovelace-path"; -import "../../cards/hui-card"; import { showCreateCardDialog } from "./show-create-card-dialog"; import type { SuggestCardDialogParams } from "./show-suggest-card-dialog"; @@ -124,27 +125,32 @@ export class HuiDialogSuggestCard extends LitElement { ` : nothing}
- ${this._params.yaml ? this.hass!.localize("ui.common.close") : this.hass!.localize("ui.common.cancel")} - + ${!this._params.yaml ? html` ${!(this._sectionConfig && this._viewSupportsSection) ? html` - + ${this.hass!.localize( "ui.panel.lovelace.editor.suggest_card.create_own" )} - + ` : nothing} - + ` : nothing} diff --git a/src/panels/lovelace/editor/dashboard-strategy-editor/dialogs/dialog-dashboard-strategy-editor.ts b/src/panels/lovelace/editor/dashboard-strategy-editor/dialogs/dialog-dashboard-strategy-editor.ts index b9d5a40aed..00b8165fe3 100644 --- a/src/panels/lovelace/editor/dashboard-strategy-editor/dialogs/dialog-dashboard-strategy-editor.ts +++ b/src/panels/lovelace/editor/dashboard-strategy-editor/dialogs/dialog-dashboard-strategy-editor.ts @@ -191,10 +191,19 @@ class DialogDashboardStrategyEditor extends LitElement { > - + ${this.hass!.localize("ui.common.delete")} - + ${this.hass!.localize("ui.common.cancel")} @@ -228,10 +237,6 @@ class DialogDashboardStrategyEditor extends LitElement { --dialog-content-padding: 8px; } } - - .danger { - --mdc-theme-primary: var(--error-color); - } `, ]; } diff --git a/src/panels/lovelace/hui-root.ts b/src/panels/lovelace/hui-root.ts index 44ca521c0a..d62bc5b717 100644 --- a/src/panels/lovelace/hui-root.ts +++ b/src/panels/lovelace/hui-root.ts @@ -1,5 +1,3 @@ -import "@material/mwc-button"; - import type { RequestSelectedDetail } from "@material/mwc-list/mwc-list-item"; import { mdiCodeBraces, @@ -34,6 +32,7 @@ import { } from "../../common/url/search-params"; import { debounce } from "../../common/util/debounce"; import { afterNextRender } from "../../common/util/render-status"; +import "../../components/ha-button"; import "../../components/ha-button-menu"; import "../../components/ha-icon"; import "../../components/ha-icon-button"; @@ -75,9 +74,9 @@ import { getLovelaceStrategy } from "./strategies/get-strategy"; import { isLegacyStrategyConfig } from "./strategies/legacy-strategy"; import type { Lovelace } from "./types"; import "./views/hui-view"; -import "./views/hui-view-container"; import type { HUIView } from "./views/hui-view"; import "./views/hui-view-background"; +import "./views/hui-view-container"; @customElement("hui-root") class HUIRoot extends LitElement { @@ -123,14 +122,14 @@ class HUIRoot extends LitElement { const result: TemplateResult[] = []; if (this._editMode) { result.push( - html` + > + ${this.hass!.localize("ui.panel.lovelace.menu.exit_edit_mode")} +