feat: add week start on Monday setting

Add user preference to start the calendar week on Monday instead
of Sunday (European style). Includes database migration, backend
API support, and Settings UI toggle.

Author: djedi

app/models.py

@@ -220,6 +220,7 @@ class User(Base):
     calendar_token = Column(String(64), unique=True, nullable=True)
     kanban_enabled = Column(Boolean, nullable=True, default=False)
     kanban_columns = Column(String(512), nullable=True, default='["todo", "done"]')
+    week_start_monday = Column(Boolean, nullable=True, default=False)
     notes = relationship("Note", lazy="dynamic", cascade="all, delete, delete-orphan")
     meta = relationship("Meta", lazy="dynamic", cascade="all, delete, delete-orphan")
     external_calendars = relationship(

app/routes.py

@@ -1280,6 +1280,8 @@ async def sidebar_data():
     except (json.JSONDecodeError, TypeError):
         kanban_columns = ["todo", "done"]
 
+    week_start_monday = user.week_start_monday or False
+
     return (
         jsonify(
             tags=tags,
@@ -1290,6 +1292,7 @@ async def sidebar_data():
             vim_mode=vim_mode,
             kanban_enabled=kanban_enabled,
             kanban_columns=kanban_columns,
+            week_start_monday=week_start_monday,
         ),
         200,
     )
@@ -1373,6 +1376,7 @@ async def get_settings():
             vim_mode=user.vim_mode or False,
             kanban_enabled=user.kanban_enabled or False,
             kanban_columns=kanban_columns,
+            week_start_monday=user.week_start_monday or False,
         ),
         200,
     )
@@ -1414,6 +1418,9 @@ async def update_settings():
             if valid_columns:
                 user.kanban_columns = json.dumps(valid_columns)
 
+    if "week_start_monday" in req:
+        user.week_start_monday = req["week_start_monday"]
+
     db.session.add(user)
     db.session.flush()
     db.session.commit()
@@ -1432,6 +1439,7 @@ async def update_settings():
             vim_mode=user.vim_mode or False,
             kanban_enabled=user.kanban_enabled or False,
             kanban_columns=kanban_columns,
+            week_start_monday=user.week_start_monday or False,
         ),
         200,
     )

client/src/components/Calendar.vue

@@ -8,6 +8,7 @@
       :nearby-month-days="true"
       :nearby-selectable-month-days="true"
       :focusable="false"
+      :first-day-of-week="sidebar.weekStartMonday ? 1 : 0"
       @update:model-value="changeDate"
     >
     </b-datepicker>

client/src/components/Editor.vue

@@ -35,6 +35,7 @@ import { computed, inject, onBeforeUnmount, onMounted, ref, watch } from 'vue';
 import type { IGlobal } from '../interfaces';
 
 import { newDay, newNote } from '../services/consts';
+import directionService from '../services/direction';
 import eventHub from '../services/eventHub';
 import { SharedBuefy } from '../services/sharedBuefy';
 import themeService from '../services/theme';
@@ -813,6 +814,10 @@ const getExtensions = (): Extension[] => {
         const newValue = update.state.doc.toString();
         generateTaskList(newValue);
         throttledEmit(newValue);
+        // Update auto-direction if in auto mode
+        if (directionService.preference === 'auto') {
+          debouncedDirectionUpdate(newValue);
+        }
       }
     }),
     EditorView.domEventHandlers({
@@ -859,6 +864,15 @@ const throttledEmit = _.throttle(
   { trailing: true, leading: false }
 );
 
+// Debounced direction update for auto-detection
+const debouncedDirectionUpdate = _.debounce(
+  (value: string) => {
+    directionService.updateAutoDirection(value);
+  },
+  500,
+  { trailing: true, leading: false }
+);
+
 onMounted(() => {
   if (!editorContainer.value) return;
 
@@ -873,6 +887,10 @@ onMounted(() => {
   handleValueUpdate(true);
   // Generate task list on initial mount
   generateTaskList(props.value || '');
+  // Trigger auto-direction on initial content
+  if (directionService.preference === 'auto') {
+    directionService.updateAutoDirection(props.value || '');
+  }
   eventHub.on('focusEditor', focus);
 });
 
@@ -977,7 +995,7 @@ defineExpose({
   }
 
   .editor :deep(.cm-gutters) {
-    padding-left: 4px;
+    padding-inline-start: 4px;
   }
 }
 </style>

client/src/components/Header.vue

@@ -409,15 +409,14 @@ const logout = () => {
 }
 
 .dropdown-text {
-  margin-left: 8px;
-  margin-right: 12px;
+  margin-inline-start: 8px;
+  margin-inline-end: 12px;
 }
 
 .dropdown-shortcut {
   opacity: 0.6;
   font-size: 0.85em;
-  margin-left: auto;
-  float: right;
+  margin-inline-start: auto;
 }
 
 /* Mobile-only items in dropdown - hidden by default */
@@ -456,8 +455,8 @@ const logout = () => {
   }
 
   .header-title {
-    margin-left: 0.5em;
-    margin-right: 0.5em;
+    margin-inline-start: 0.5em;
+    margin-inline-end: 0.5em;
   }
 
   .header-left,

client/src/components/MarkdownPreview.vue

@@ -373,7 +373,7 @@ const toggleCheckboxInMarkdown = (checkboxInfo: CheckboxInfo): string => {
   color: var(--syntax-keyword);
   font-weight: 600;
   min-width: 100px;
-  margin-right: 12px;
+  margin-inline-end: 12px;
   font-size: 0.9em;
 }
 
@@ -460,14 +460,14 @@ const toggleCheckboxInMarkdown = (checkboxInfo: CheckboxInfo): string => {
 
 /* Lists */
 .preview-content :deep(ul) {
-  padding-left: 2em;
+  padding-inline-start: 2em;
   margin-top: 0;
   margin-bottom: 16px;
   list-style-type: disc;
 }
 
 .preview-content :deep(ol) {
-  padding-left: 2em;
+  padding-inline-start: 2em;
   margin-top: 0;
   margin-bottom: 16px;
   list-style-type: decimal;
@@ -490,11 +490,11 @@ const toggleCheckboxInMarkdown = (checkboxInfo: CheckboxInfo): string => {
 /* Task lists */
 .preview-content :deep(.task-list-item) {
   list-style-type: none;
-  margin-left: -1.5em;
+  margin-inline-start: -1.5em;
 }
 
 .preview-content :deep(.task-list-item input[type="checkbox"]) {
-  margin-right: 0.5em;
+  margin-inline-end: 0.5em;
   vertical-align: middle;
   cursor: pointer;
   accent-color: var(--accent-primary);
@@ -531,9 +531,9 @@ const toggleCheckboxInMarkdown = (checkboxInfo: CheckboxInfo): string => {
 
 /* Blockquotes */
 .preview-content :deep(blockquote) {
-  border-left: 4px solid var(--text-link);
-  padding-left: 16px;
-  margin-left: 0;
+  border-inline-start: 4px solid var(--text-link);
+  padding-inline-start: 16px;
+  margin-inline-start: 0;
   margin-bottom: 16px;
   color: var(--text-muted);
 }
@@ -549,7 +549,7 @@ const toggleCheckboxInMarkdown = (checkboxInfo: CheckboxInfo): string => {
 .preview-content :deep(table td) {
   border: 1px solid var(--border-color);
   padding: 8px 12px;
-  text-align: left;
+  text-align: start;
 }
 
 .preview-content :deep(table th) {
@@ -614,7 +614,7 @@ const toggleCheckboxInMarkdown = (checkboxInfo: CheckboxInfo): string => {
 
   .frontmatter-key {
     min-width: 80px;
-    margin-right: 8px;
+    margin-inline-end: 8px;
   }
 
   .preview-content :deep(pre) {

client/src/components/NestedTags.vue

@@ -75,7 +75,7 @@
 </template>
 
 <script setup lang="ts">
-import { ref, computed, watch } from 'vue';
+import { computed, ref, watch } from 'vue';
 import type { ITagNode } from '../interfaces';
 import { getExpandedTags, saveExpandedTags } from '../services/localstorage';
 
@@ -169,7 +169,7 @@ function onChildExpandedChange(childExpanded: string[]) {
 }
 
 .children-inline {
-  padding-left: 20px;
+  padding-inline-start: 20px;
 }
 
 /* Nested level: inline layout */
@@ -188,7 +188,7 @@ function onChildExpandedChange(childExpanded: string[]) {
 
 .sub-children {
   display: inline-flex;
-  margin-left: 0.25em;
+  margin-inline-start: 0.25em;
 }
 
 /* Toggle icons */
@@ -201,7 +201,7 @@ function onChildExpandedChange(childExpanded: string[]) {
   cursor: pointer;
   color: var(--text-muted);
   font-size: 0.7em;
-  margin-right: 4px;
+  margin-inline-end: 4px;
   flex-shrink: 0;
 }
 
@@ -216,7 +216,7 @@ function onChildExpandedChange(childExpanded: string[]) {
   cursor: pointer;
   color: var(--text-muted);
   font-size: 0.7em;
-  margin-right: 2px;
+  margin-inline-end: 2px;
   width: 12px;
 }