jeans/frontend
jeans/frontend
1
0
Fork 0
mirror of https://github.com/home-assistant/frontend.git synced 2025-07-31 21:17:47 +00:00
Code Issues Packages Projects Releases Wiki Activity

Adjust to new element name/API/css vars/events

Browse Source
This commit is contained in:
Bram Kragten 2023-03-22 11:19:04 +01:00
parent 839f11d10d
commit 4a19b4a397
No known key found for this signature in database
GPG Key ID: FBE2DFDB363EF55B
1 changed files with 26 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

48
src/components/ha-dialog-date-picker.ts
View File

@ -41,14 +41,14 @@ export class HaDialogDatePicker extends LitElement {
return nothing;
}
return html`<ha-dialog open @closed=${this.closeDialog}>
<app-datepicker
<app-date-picker
.value=${this._value}
.min=${this._params.min}
.max=${this._params.max}
.locale=${this._params.locale}
@datepicker-value-updated=${this._valueChanged}
@date-updated=${this._valueChanged}
.firstDayOfWeek=${this._params.firstWeekday}
></app-datepicker>
></app-date-picker>
<mwc-button slot="secondaryAction" @click=${this._setToday}>
${this.hass.localize("ui.dialogs.date-picker.today")}
</mwc-button>
@ -79,33 +79,33 @@ export class HaDialogDatePicker extends LitElement {
haStyleDialog,
css`
ha-dialog {
--dialog-content-padding: 0;
--justify-action-buttons: space-between;
}
app-datepicker {
--app-datepicker-accent-color: var(--primary-color);
--app-datepicker-bg-color: transparent;
--app-datepicker-color: var(--primary-text-color);
--app-datepicker-disabled-day-color: var(--disabled-text-color);
--app-datepicker-focused-day-color: var(--text-primary-color);
--app-datepicker-focused-year-bg-color: var(--primary-color);
--app-datepicker-selector-color: var(--secondary-text-color);
--app-datepicker-separator-color: var(--divider-color);
--app-datepicker-weekday-color: var(--secondary-text-color);
app-date-picker {
--app-focus: var(--primary-text-color);
--app-hover: var(--primary-color);
--app-on-disabled: var(--disabled-color);
--app-on-focus: var(--primary-text-color);
--app-on-hover: var(--primary-text-color);
--app-on-primary: var(--text-primary-color);
--app-on-surface: var(--primary-text-color);
--app-on-today: var(--primary-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 {
outline: none;
}
@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%;
}
}
`,
];
}