pigui/landing-api
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add an editorial calendar to the panel

Browse Source 
A month of publications, scheduled dates, content coming off the site, and
calls opening and closing, each linked to its form.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
Josep Piguillem
2026-10-01 10:17:46 +02:00
parent 773d3901c6
commit 8d0f81f9c5
8 changed files with 414 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

85
resources/views/filament/pages/editorial-calendar.blade.php Normal file
View File

@@ -0,0 +1,85 @@
<x-filament-panels::page>
<style>
.ec-toolbar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .75rem; }
.ec-toolbar h2 { font-size: 1.125rem; font-weight: 600; }
.ec-legend { display: flex; flex-wrap: wrap; gap: .5rem; }
.ec-grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); border-top: 1px solid var(--ec-line); border-left: 1px solid var(--ec-line); }
.ec-grid { --ec-line: color-mix(in oklab, currentColor 12%, transparent); }
.ec-head { padding: .375rem .5rem; font-size: .75rem; font-weight: 600; text-transform: uppercase; opacity: .7; border-right: 1px solid var(--ec-line); border-bottom: 1px solid var(--ec-line); }
.ec-day { min-height: 7rem; padding: .375rem; border-right: 1px solid var(--ec-line); border-bottom: 1px solid var(--ec-line); display: flex; flex-direction: column; gap: .25rem; }
.ec-day.is-out { opacity: .45; }
.ec-day .ec-num { font-size: .75rem; font-weight: 600; }
.ec-day.is-today .ec-num { display: inline-grid; place-items: center; width: 1.5rem; height: 1.5rem; border-radius: 999px; background: var(--primary-600, #d97706); color: #fff; }
.ec-event { display: block; font-size: .75rem; line-height: 1.3; padding: .125rem .375rem; border-radius: .375rem; border-left: 3px solid var(--ec-tone); background: color-mix(in oklab, var(--ec-tone) 12%, transparent); overflow-wrap: anywhere; }
.ec-event:hover { background: color-mix(in oklab, var(--ec-tone) 22%, transparent); }
.ec-published { --ec-tone: #16a34a; }
.ec-scheduled { --ec-tone: #2563eb; }
.ec-unpublishes { --ec-tone: #9ca3af; }
.ec-opens { --ec-tone: #d97706; }
.ec-closes { --ec-tone: #dc2626; }
.ec-weekday-inline { display: none; }
/* On a phone a seven-column grid is unreadable: one day per row,
and only the days that have something. */
@media (max-width: 768px) {
.ec-grid { grid-template-columns: 1fr; }
.ec-head { display: none; }
.ec-day { min-height: 0; }
.ec-day.is-empty, .ec-day.is-out { display: none; }
.ec-weekday-inline { display: inline; }
}
</style>
<div class="ec-toolbar">
<h2>{{ $this->label() }}</h2>
<div class="ec-legend" aria-label="{{ __('panel.calendar.legend') }}">
@foreach (['published', 'scheduled', 'unpublishes', 'opens', 'closes'] as $event)
<span class="ec-event ec-{{ $event }}">{{ __('panel.calendar.events.'.$event) }}</span>
@endforeach
</div>
<div style="display: flex; gap: .5rem;">
<x-filament::button color="gray" icon="heroicon-m-chevron-left" wire:click="previous" :label-sr-only="true">
{{ __('panel.calendar.previous') }}
</x-filament::button>
<x-filament::button color="gray" wire:click="today">
{{ __('panel.calendar.today') }}
</x-filament::button>
<x-filament::button color="gray" icon="heroicon-m-chevron-right" wire:click="next" :label-sr-only="true">
{{ __('panel.calendar.next') }}
</x-filament::button>
</div>
</div>
<x-filament::section>
<div class="ec-grid" role="grid" aria-label="{{ $this->label() }}">
@foreach ($this->weekdays() as $weekday)
<div class="ec-head" role="columnheader">{{ $weekday }}</div>
@endforeach
@foreach ($this->weeks() as $week)
@foreach ($week as $day)
<div @class([
'ec-day',
'is-out' => ! $day['inMonth'],
'is-today' => $day['isToday'],
'is-empty' => $day['events'] === [],
]) role="gridcell">
<span class="ec-num">
<span class="ec-weekday-inline">{{ $day['date']->locale(app()->getLocale())->isoFormat('dddd') }}</span>
{{ $day['date']->day }}
</span>
@foreach ($day['events'] as $event)
<a href="{{ $event['url'] }}" class="ec-event ec-{{ $event['event'] }}">
<span class="sr-only">{{ __('panel.calendar.events.'.$event['event']) }}:</span>
{{ __('panel.calendar.types.'.$event['type']) }} · {{ $event['title'] }}
</a>
@endforeach
</div>
@endforeach
@endforeach
</div>
</x-filament::section>
</x-filament-panels::page>