mirror of
https://github.com/home-assistant/frontend.git
synced 2025-07-31 21:17:47 +00:00
Adjust to new element name/API/css vars/events
This commit is contained in:
parent
839f11d10d
commit
4a19b4a397
@ -41,14 +41,14 @@ export class HaDialogDatePicker extends LitElement {
|
|||||||
return nothing;
|
return nothing;
|
||||||
}
|
}
|
||||||
return html`<ha-dialog open @closed=${this.closeDialog}>
|
return html`<ha-dialog open @closed=${this.closeDialog}>
|
||||||
<app-datepicker
|
<app-date-picker
|
||||||
.value=${this._value}
|
.value=${this._value}
|
||||||
.min=${this._params.min}
|
.min=${this._params.min}
|
||||||
.max=${this._params.max}
|
.max=${this._params.max}
|
||||||
.locale=${this._params.locale}
|
.locale=${this._params.locale}
|
||||||
@datepicker-value-updated=${this._valueChanged}
|
@date-updated=${this._valueChanged}
|
||||||
.firstDayOfWeek=${this._params.firstWeekday}
|
.firstDayOfWeek=${this._params.firstWeekday}
|
||||||
></app-datepicker>
|
></app-date-picker>
|
||||||
<mwc-button slot="secondaryAction" @click=${this._setToday}>
|
<mwc-button slot="secondaryAction" @click=${this._setToday}>
|
||||||
${this.hass.localize("ui.dialogs.date-picker.today")}
|
${this.hass.localize("ui.dialogs.date-picker.today")}
|
||||||
</mwc-button>
|
</mwc-button>
|
||||||
@ -79,32 +79,32 @@ export class HaDialogDatePicker extends LitElement {
|
|||||||
haStyleDialog,
|
haStyleDialog,
|
||||||
css`
|
css`
|
||||||
ha-dialog {
|
ha-dialog {
|
||||||
--dialog-content-padding: 0;
|
|
||||||
--justify-action-buttons: space-between;
|
--justify-action-buttons: space-between;
|
||||||
}
|
}
|
||||||
app-datepicker {
|
app-date-picker {
|
||||||
--app-datepicker-accent-color: var(--primary-color);
|
--app-focus: var(--primary-text-color);
|
||||||
--app-datepicker-bg-color: transparent;
|
--app-hover: var(--primary-color);
|
||||||
--app-datepicker-color: var(--primary-text-color);
|
--app-on-disabled: var(--disabled-color);
|
||||||
--app-datepicker-disabled-day-color: var(--disabled-text-color);
|
--app-on-focus: var(--primary-text-color);
|
||||||
--app-datepicker-focused-day-color: var(--text-primary-color);
|
--app-on-hover: var(--primary-text-color);
|
||||||
--app-datepicker-focused-year-bg-color: var(--primary-color);
|
--app-on-primary: var(--text-primary-color);
|
||||||
--app-datepicker-selector-color: var(--secondary-text-color);
|
--app-on-surface: var(--primary-text-color);
|
||||||
--app-datepicker-separator-color: var(--divider-color);
|
--app-on-today: var(--primary-text-color);
|
||||||
--app-datepicker-weekday-color: var(--secondary-text-color);
|
--app-on-week-number: var(--secondary-text-color);
|
||||||
|
--app-on-weekday: var(--secondary-text-color);
|
||||||
|
--app-primary: var(--primary-color);
|
||||||
|
--app-selected-focus: var(--primary-text-color);
|
||||||
|
--app-selected-hover: var(--primary-color);
|
||||||
|
--app-selected-on-focus: var(--text-primary-color);
|
||||||
|
--app-selected-on-hover: var(--text-primary-color);
|
||||||
|
--app-shape: var(--mdc-shape-medium);
|
||||||
|
--app-surface: transparent;
|
||||||
|
--app-today: var(--primary-text-color);
|
||||||
|
|
||||||
|
margin: auto;
|
||||||
}
|
}
|
||||||
app-datepicker::part(calendar-day):focus {
|
ha-dialog {
|
||||||
outline: none;
|
--mdc-dialog-min-width: 300px;
|
||||||
}
|
|
||||||
@media all and (min-width: 450px) {
|
|
||||||
ha-dialog {
|
|
||||||
--mdc-dialog-min-width: 300px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@media all and (max-width: 450px), all and (max-height: 500px) {
|
|
||||||
app-datepicker {
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
`,
|
`,
|
||||||
];
|
];
|
||||||
|
Loading…
x
Reference in New Issue
Block a user