Add year select fallback for Firefox

This commit is contained in:
Eric Eastwood 2022-02-17 21:10:36 -06:00
parent 6d5ad656b6
commit b41ee62e59
2 changed files with 15 additions and 5 deletions

View File

@ -66,16 +66,24 @@ html {
right: 0; right: 0;
opacity: 0; opacity: 0;
cursor: pointer;
} }
.fallback-input-month .CalendarView_heading_monthInput { .fallback-input-month .CalendarView_heading_monthInput {
display: none; display: none;
} }
/* The little calendar icon button in the input that opens the date picker.
* We're stretching this out over the heading */
.CalendarView_heading_monthInput::-webkit-calendar-picker-indicator { .CalendarView_heading_monthInput::-webkit-calendar-picker-indicator {
width: 100%; width: 100%;
height: 100%; height: 100%;
margin-left: 0;
background-color: #f00; background-color: #f00;
cursor: pointer;
} }
.CalendarView_heading_yearSelectFallback { .CalendarView_heading_yearSelectFallback {
@ -91,6 +99,8 @@ html {
height: 100%; height: 100%;
opacity: 0; opacity: 0;
cursor: pointer;
} }
.fallback-input-month .CalendarView_heading_yearSelectFallback { .fallback-input-month .CalendarView_heading_yearSelectFallback {

View File

@ -258,15 +258,15 @@ async function mountHydrogen() {
} }
onMonthInputChange(e) { onMonthInputChange(e) {
const selectedDate = new Date(e.target.valueAsDate); this._calendarDate = e.target.valueAsDate;
console.log('onMonthInputChange selectedDate', selectedDate, e.target.valueAsDate);
this._calendarDate = selectedDate;
this.emitChange('calendarDate'); this.emitChange('calendarDate');
} }
onYearFallbackSelectChange(e) { onYearFallbackSelectChange(e) {
// TODO const selectedDate = new Date(this._calendarDate);
console.log('onYearFallbackSelectChange', e); selectedDate.setUTCFullYear(e.target.value);
this._calendarDate = selectedDate;
this.emitChange('calendarDate');
} }
} }