Switched "Last seen" filter back to standard datepicker without shortcuts (#2296)

refs https://github.com/TryGhost/Team/issues/1418

- drops the block usage of `<GhDatePicker>` for the "Last seen" input that added shortcut buttons
  - not a full revert of https://github.com/TryGhost/Admin/pull/2291 as allowing block usage of the component is still useful for other component customisation
- removes CSS related to the calendar-with-shortcut buttons as we don't have any other use-cases for it at the moment
This commit is contained in:
Kevin Ansfield 2022-03-08 20:13:33 +00:00 committed by GitHub
parent f998fe6ff0
commit e46337c45e
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 1 additions and 71 deletions

View File

@ -34,31 +34,12 @@
{{else if (eq @filter.type 'last_seen_at')}}
<GhDatePicker
class="gh-date-picker-with-shortcuts"
@value={{@filter.value}}
@maxDate={{now}}
@maxDateError="Must be in the past"
@onChange={{fn @setFilterValue @filter}}
data-test-input="members-filter-value"
as |datepicker|
>
<div class="gh-date-picker-sh-container">
<div class="gh-date-picker-sh-calendar">
<datepicker.Nav />
<datepicker.Days />
</div>
<div class="gh-date-picker-shortcuts">
<h4>Jump to date</h4>
<ol>
<li><button type="button" {{on "click" (fn datepicker.actions.select (moment-site-tz) datepicker)}}>Today</button></li>
<li><button type="button" {{on "click" (fn datepicker.actions.select (moment-subtract (moment-site-tz) 1 precision="days") datepicker)}}>Yesterday</button></li>
<li><button type="button" {{on "click" (fn datepicker.actions.select (moment-subtract (moment-site-tz) 7 precision="days") datepicker)}}>7 days ago</button></li>
<li><button type="button" {{on "click" (fn datepicker.actions.select (moment-subtract (moment-site-tz) 30 precision="days") datepicker)}}>30 days ago</button></li>
<li><button type="button" {{on "click" (fn datepicker.actions.select (moment-subtract (moment-site-tz) 90 precision="days") datepicker)}}>90 days ago</button></li>
</ol>
</div>
</div>
</GhDatePicker>
/>
{{else if (eq @filter.type 'created_at')}}
<GhDatePicker

View File

@ -240,54 +240,3 @@ svg.gh-date-picker-cal-icon {
top: 9px;
font-size: 1.3rem;
}
.gh-date-picker-sh-container {
display: flex;
min-width: 380px;
}
.gh-date-picker-sh-calendar {
flex-basis: 213px;
}
.gh-date-picker-with-shortcuts .ember-power-datepicker-content {
min-width: 300px;
}
.gh-date-picker-shortcuts {
flex-grow: 1;
display: flex;
flex-direction: column;
margin-left: 12px;
padding-left: 12px;
border-left: 1px solid var(--whitegrey);
}
.gh-date-picker-shortcuts h4 {
font-size: 1.35rem;
font-weight: 600;
margin: 0 5px 0;
height: 31px;
line-height: 24px;
}
.gh-date-picker-shortcuts ol {
list-style: none;
padding: 0;
margin: 0;
flex-grow: 1;
display: flex;
flex-direction: column;
justify-content: space-between;
margin-bottom: 1px;
}
.gh-date-picker-shortcuts ol li {
height: 24px;
}
.gh-date-picker-shortcuts ol li button {
padding: 3px 6px;
border-radius: 3px;
font-size: 1.4rem;
}