39 lines
1.8 KiB
Plaintext
39 lines
1.8 KiB
Plaintext
<div id="cal-$$Id$$"
|
|
class="calendar-root inline-block min-w-72 rounded-md border border-border bg-card p-4 shadow-sm"
|
|
data-year="$$Year$$"
|
|
data-month="$$Month$$"
|
|
data-sel-day="$$SelectedDay$$"
|
|
data-sel-month="$$SelectedMonth$$"
|
|
data-sel-year="$$SelectedYear$$"
|
|
data-view="days">
|
|
|
|
<!-- Header row -->
|
|
<div class="mb-3 flex items-center justify-between">
|
|
<button type="button" class="cal-prev cal-nav inline-flex h-8 w-8 items-center justify-center rounded-md border border-input
|
|
bg-transparent hover:bg-accent hover:text-accent-foreground transition-colors text-base"
|
|
aria-label="Previous month">‹</button>
|
|
<button type="button" class="cal-month-label text-sm font-semibold px-2 py-0.5 rounded-md
|
|
hover:bg-accent hover:text-accent-foreground transition-colors cursor-pointer"></button>
|
|
<button type="button" class="cal-next cal-nav inline-flex h-8 w-8 items-center justify-center rounded-md border border-input
|
|
bg-transparent hover:bg-accent hover:text-accent-foreground transition-colors text-base"
|
|
aria-label="Next month">›</button>
|
|
</div>
|
|
|
|
<!-- Day-of-week headers -->
|
|
<div class="cal-dow-row mb-1 grid grid-cols-7 text-center">
|
|
<span class="cal-dow">Su</span>
|
|
<span class="cal-dow">Mo</span>
|
|
<span class="cal-dow">Tu</span>
|
|
<span class="cal-dow">We</span>
|
|
<span class="cal-dow">Th</span>
|
|
<span class="cal-dow">Fr</span>
|
|
<span class="cal-dow">Sa</span>
|
|
</div>
|
|
|
|
<!-- Day grid (populated by JS below) -->
|
|
<div class="cal-grid grid grid-cols-7 gap-0.5 text-center"></div>
|
|
|
|
<!-- Hidden input -->
|
|
<input type="hidden" name="$$Name$$" class="cal-hidden-input" value="$$DefaultValue$$" />
|
|
</div>
|