CI / policy (push) Successful in 7s
CI / validate (push) Successful in 1m15s
CI / test (push) Successful in 3m18s
CI / benchmark (push) Failing after 5m53s
CI / build (push) Successful in 1m23s
CI / security (push) Successful in 7m6s
CI / policy (pull_request) Successful in 7s
CI / validate (pull_request) Successful in 1m9s
CI / build (pull_request) Successful in 43s
CI / test (pull_request) Successful in 3m19s
CI / images (push) Successful in 3m7s
CI / required (push) Successful in 2s
CI / benchmark (pull_request) Failing after 5m28s
CI / security (pull_request) Successful in 6m37s
CI / images (pull_request) Successful in 3m18s
CI / required (pull_request) Successful in 1s
68 lines
2.2 KiB
HTML
68 lines
2.2 KiB
HTML
<div class="calendar" role="group" [attr.aria-label]="getMonthName() + ' ' + year">
|
|
<h3>
|
|
{{ getMonthName() }} <span>{{ year }}</span>
|
|
</h3>
|
|
<div>
|
|
<div class="row header">
|
|
@if (calendarSettingsService.get('showWeekNumbers')()) {
|
|
<p class="day empty week-number"></p>
|
|
}
|
|
@for (letter of getWeekdayLetters(); track $index) {
|
|
<p class="day">{{ letter }}</p>
|
|
}
|
|
</div>
|
|
<div class="cols">
|
|
@for (week of weeksInAMonth; track $index) {
|
|
<div class="row week">
|
|
@if (calendarSettingsService.get('showWeekNumbers')()) {
|
|
<p
|
|
class="day week-number"
|
|
[class.start]="$index === 0"
|
|
[class.end]="$index === weeksInAMonth.length - 1"
|
|
>
|
|
{{ getWeekNumber(week) }}
|
|
</p>
|
|
}
|
|
@for (day of week; track $index) {
|
|
@if (day === null) {
|
|
<p class="day empty"></p>
|
|
} @else {
|
|
@let dayTooltip = getDayTooltip(day);
|
|
@let dateKey = getDateKey(day);
|
|
@let declaredType = getDeclaredType(dateKey);
|
|
@let previewed = declarationPreview?.dates?.has(dateKey);
|
|
<button
|
|
type="button"
|
|
[attr.data-date]="dateKey"
|
|
[class.past]="day < getNow()"
|
|
[class.start]="selectedDates.isStart(day)"
|
|
[class.end]="selectedDates.isEnd(day)"
|
|
[class.selected]="selectedDates.isSelected(day)"
|
|
[class.current]="dateKey === currentDate"
|
|
[class.explained-period]="isInExplainedPeriod(day)"
|
|
[class.context-only]="!isInHorizon(day)"
|
|
[class.declared]="!!declaredType"
|
|
[class.declaration-preview]="previewed"
|
|
[class.declaration-erase]="previewed && !declaredType"
|
|
[class]="getDayClasses(day)"
|
|
class="day number"
|
|
[disabled]="isDateDisabled(day)"
|
|
[attr.aria-pressed]="declarationEntry ? !!declaredType : null"
|
|
[matTooltip]="dayTooltip"
|
|
matTooltipTouchGestures="off"
|
|
[matTooltipDisabled]="!!declarationPreview"
|
|
[matTooltipShowDelay]="500"
|
|
[attr.aria-label]="getDayAriaLabel(day, dayTooltip)"
|
|
[attr.aria-current]="dateKey === currentDate ? 'date' : null"
|
|
(click)="dateSelected.emit(dateKey)"
|
|
>
|
|
<span>{{ day.getDate() }}</span>
|
|
</button>
|
|
}
|
|
}
|
|
</div>
|
|
}
|
|
</div>
|
|
</div>
|
|
</div>
|