Vincent Lannurien
827c432dc0
All checks were successful
Build and deploy static pages / build-and-push (push) Successful in 14s
Three things worked against the year grid. The page inherited PaperMod's 720px column, so twelve months across three columns left day cells too narrow for any label; the calendar layout now runs to 1100px, which the nine-column deadline table below the grid wants anyway. Each cell was also short enough to fit a single deadline, collapsing the days that carry both an abstract and a paper into a '+2 more' link. The view hardcodes dayMaxEvents, so the height comes from aspectRatio: month tables are width / ratio over six rows, and 1.1 leaves about 50px a week. Finally, 'OSDI — abstract deadline' never fit a day cell and rendered as a cropped fragment. The year view keeps the venue, which is the part that identifies the dot, and leaves the rest to the hover text and the month and list views. '+N more' still appears when a day carries three deadlines, and was drawn with the library's default event border, an unmapped blue that read as a stray button; it becomes quiet text, and the popover it opens picks up the calendar's own card treatment. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
75 lines
3.7 KiB
HTML
75 lines
3.7 KiB
HTML
{{- if eq .Layout "calendar" }}
|
|
<style>
|
|
/* The year grid never fits PaperMod's 720px column: twelve months across
|
|
three columns leave day cells too narrow to read. Widen the whole calendar
|
|
page — the nine-column deadline table below the grid gains from it too. */
|
|
main.main { max-width: calc(1100px + var(--gap) * 2); }
|
|
#pa-calendar { margin: 1.5rem 0 2.5rem; }
|
|
.fc .fc-toolbar-title { font-size: 1.1rem; }
|
|
.fc-event { cursor: pointer; font-size: 0.78rem; }
|
|
/* Reset PaperMod's global table overrides inside FullCalendar */
|
|
.fc table { display: table; overflow-x: visible; margin-bottom: 0; border-radius: 0; word-break: normal; }
|
|
.fc th { min-width: 0; text-align: center; }
|
|
.fc td:first-child, .fc th:first-child { width: auto; }
|
|
/* Map the site palette onto FullCalendar's variables. The values are theme
|
|
variables, so one mapping covers both light and dark. */
|
|
#pa-calendar {
|
|
--fc-page-bg-color: var(--entry);
|
|
--fc-neutral-bg-color: var(--code-bg);
|
|
--fc-neutral-text-color: var(--secondary);
|
|
--fc-border-color: var(--border);
|
|
--fc-today-bg-color: var(--accent-soft);
|
|
--fc-list-event-hover-bg-color: var(--accent-soft);
|
|
--fc-popover-bg-color: var(--entry);
|
|
--fc-popover-border-color: var(--border);
|
|
--fc-button-text-color: var(--primary);
|
|
--fc-button-bg-color: var(--entry);
|
|
--fc-button-border-color: var(--border);
|
|
--fc-button-hover-bg-color: var(--code-bg);
|
|
--fc-button-hover-border-color: var(--accent-line);
|
|
--fc-button-active-bg-color: var(--accent-soft);
|
|
--fc-button-active-border-color: var(--accent-line);
|
|
background: var(--entry);
|
|
border: 1px solid var(--border);
|
|
border-radius: var(--radius);
|
|
padding: 1rem;
|
|
color: var(--primary);
|
|
}
|
|
.fc .fc-daygrid-day-number, .fc .fc-col-header-cell-cushion { color: var(--secondary); }
|
|
.fc .fc-day-today .fc-daygrid-day-number { color: var(--accent); font-weight: 600; }
|
|
.fc-event { border-radius: 4px; }
|
|
/* Year view: months sit two or three to a row, so scale the text down and
|
|
let event titles ellipsize instead of stretching the month tables. */
|
|
.fc .fc-multimonth-title { font-size: 0.95rem; padding: 0.7em 0; }
|
|
.fc .fc-multimonth-multicol .fc-multimonth-month { padding: 0 0.6em 1em; }
|
|
.fc-multimonth .fc-daygrid-day-number,
|
|
.fc-multimonth .fc-col-header-cell-cushion { font-size: 0.7rem; }
|
|
.fc-multimonth .fc-event { font-size: 0.68rem; padding: 0; }
|
|
.fc-multimonth .fc-event-title {
|
|
overflow: hidden;
|
|
white-space: nowrap;
|
|
text-overflow: ellipsis;
|
|
}
|
|
/* Every pixel the dot and its default 4px margins give back is one more
|
|
character of the venue acronym in a ~45px day cell. */
|
|
.fc-multimonth .fc-daygrid-event-dot { margin: 0 2px 0 0; }
|
|
.fc-multimonth .fc-daygrid-event-harness { margin-top: 1px; }
|
|
/* "+N more" overflow links. FullCalendar boxes them with the default event
|
|
border colour, which reads as a stray button; make them quiet text that
|
|
picks up the accent on hover, like the rest of the site's links. */
|
|
.fc .fc-daygrid-more-link {
|
|
color: var(--secondary);
|
|
text-decoration: none;
|
|
border: 0;
|
|
border-radius: 3px;
|
|
padding: 0 2px;
|
|
}
|
|
.fc .fc-daygrid-more-link:hover { color: var(--accent); background: var(--accent-soft); }
|
|
.fc .fc-multimonth-multicol .fc-daygrid-more-link { border: 0; padding: 0 2px; font-size: 0.68rem; }
|
|
/* The popover the link opens: same card treatment as the calendar itself. */
|
|
.fc .fc-popover { border-radius: var(--radius); box-shadow: var(--shadow); }
|
|
.fc .fc-popover-header { background: var(--code-bg); color: var(--primary); }
|
|
.fc .fc-popover-title { font-size: 0.8rem; font-weight: 600; }
|
|
</style>
|
|
{{- end }}
|