Calendar: Previous, This month and Next as one group, and the period itself opens a picker #858

New issue

Closed

opened 2026-10-10 16:01:28 +00:00 by tiagoagueda · 1 comment

tiagoagueda commented

2026-10-10 16:01:28 +00:00

Owner

In every calendar view, replace Earlier, Today and Later with a button group — Previous (chevron-left), This month / This week / Today (calendar-1), Next (chevron-right) — and centre the period's name; clicking it offers a different month, week or day.

View	Previous / Next	Middle
Month	a month	This month
Week	a week	This week
Day	a day	Today
Agenda	30 days	Today

What exists today

templates/applications/calendar.html:172-177, the same for the four views: three ghost links and an h2 with the period. URLs from agenda.url_for (agenda.py:522-532): ?month=YYYY-MM, or ?view=…&on=YYYY-MM-DD; on= means the period containing this date (page_for, :707-718).
No picker. The report uses native type=month and type=date (templates/applications/report.html:64,71,75); Firefox and Safari have no type=month/week picker. Basecoat has no date picker (basecoat#124).
chevron-left and calendar-1 are not synced icons.

What would change

The group (#841's button group), labels per view from Page, accessible names that say the unit (Previous month).
The period as a button opening a popover with a GET form: one type=date input works for every view, since on= takes any day in it; a month list for the month view.

Decisions

Picker. Recommended: native type=date in a popover (no script, every browser); a richer picker waits for the date-of-birth picker (#863), to choose one library or none for both.
Settings for the labels and the week are #859.

Checked against main at 8c3d03570. From the maintainer's improvements list of 2026-10-07.

In every calendar view, replace *Earlier*, *Today* and *Later* with a button group — *Previous* (`chevron-left`), *This month* / *This week* / *Today* (`calendar-1`), *Next* (`chevron-right`) — and centre the period's name; clicking it offers a different month, week or day. | View | Previous / Next | Middle | | --- | --- | --- | | Month | a month | This month | | Week | a week | This week | | Day | a day | Today | | Agenda | 30 days | Today | ## What exists today - `templates/applications/calendar.html:172-177`, the same for the four views: three ghost links and an `h2` with the period. URLs from `agenda.url_for` (`agenda.py:522-532`): `?month=YYYY-MM`, or `?view=…&on=YYYY-MM-DD`; `on=` means *the period containing this date* (`page_for`, `:707-718`). - **No picker.** The report uses native `type=month` and `type=date` (`templates/applications/report.html:64,71,75`); Firefox and Safari have no `type=month`/`week` picker. Basecoat has no date picker (basecoat#124). - `chevron-left` and `calendar-1` are not synced icons. ## What would change - The group (#841's button group), labels per view from `Page`, accessible names that say the unit (*Previous month*). - The period as a button opening a popover with a GET form: one `type=date` input works for every view, since `on=` takes any day in it; a month list for the month view. ## Decisions - **Picker.** Recommended: native `type=date` in a popover (no script, every browser); a richer picker waits for the date-of-birth picker (#863), to choose one library or none for both. - Settings for the labels and the week are #859. Checked against `main` at `8c3d03570`. From the maintainer's improvements list of 2026-10-07.

tiagoagueda added this to the 0.6.0 milestone

2026-10-10 16:01:28 +00:00

tiagoagueda added the

accessibility

interface

enhancement

labels

2026-10-10 16:01:28 +00:00

tiagoagueda referenced this issue

2026-10-10 16:02:01 +00:00

A setting: buttons drawn with icons, labels, or both #852

tiagoagueda referenced this issue