diff --git a/src/components/CalendarHeader.vue b/src/components/CalendarHeader.vue index 61d8c8d..1e52287 100644 --- a/src/components/CalendarHeader.vue +++ b/src/components/CalendarHeader.vue @@ -41,7 +41,7 @@ const weekdayNames = computed(() => { v-for="day in weekdayNames" :key="day.name" class="dow" - :class="{ weekend: day.isWeekend }" + :class="{ workday: !day.isWeekend, weekend: day.isWeekend }" > {{ day.name }} @@ -74,13 +74,18 @@ const weekdayNames = computed(() => { font-size: 1.2em; padding: 0.5rem; } - .dow { text-transform: uppercase; text-align: center; padding: 0.5rem; font-weight: 500; } +.dow.weekend { + color: var(--weekend); +} +.dow.workday { + color: var(--workday); +} .overlay-header-spacer { grid-area: auto; } diff --git a/src/stores/CalendarStore.js b/src/stores/CalendarStore.js index 8b08ac7..f9b91a2 100644 --- a/src/stores/CalendarStore.js +++ b/src/stores/CalendarStore.js @@ -6,20 +6,53 @@ import { getLocaleWeekendDays, } from '@/utils/date' +/** + * Calendar configuration can be overridden via window.calendarConfig: + * + * window.calendarConfig = { + * firstDay: 0, // 0=Sunday, 1=Monday, etc. (default: 1) + * firstDay: 'auto', // Use locale detection + * weekendDays: [true, false, false, false, false, false, true], // Custom weekend + * weekendDays: 'auto' // Use locale detection (default) + * } + */ + const MIN_YEAR = 1900 const MAX_YEAR = 2100 +// Helper function to determine first day with config override support +function getConfiguredFirstDay() { + // Check for environment variable or global config + const configOverride = window?.calendarConfig?.firstDay + if (configOverride !== undefined) { + return configOverride === 'auto' ? getLocaleFirstDay() : Number(configOverride) + } + // Default to Monday (1) instead of locale + return 1 +} + +// Helper function to determine weekend days with config override support +function getConfiguredWeekendDays() { + // Check for environment variable or global config + const configOverride = window?.calendarConfig?.weekendDays + if (configOverride !== undefined) { + return configOverride === 'auto' ? getLocaleWeekendDays() : configOverride + } + // Default to locale-based weekend days + return getLocaleWeekendDays() +} + export const useCalendarStore = defineStore('calendar', { state: () => ({ today: toLocalString(new Date()), now: new Date(), events: new Map(), // Map of date strings to arrays of events - weekend: getLocaleWeekendDays(), + weekend: getConfiguredWeekendDays(), config: { select_days: 1000, min_year: MIN_YEAR, max_year: MAX_YEAR, - first_day: getLocaleFirstDay(), + first_day: getConfiguredFirstDay(), }, }),