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 }}
     </div>
@@ -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;
 }

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(),
     },
   }),