refactor: convert repository to monorepo with npm workspaces

Restructured the repository into a monorepo to better organize application code
and maintenance scripts.

## Workspace Structure
- web-app: Next.js application (all app code moved from root)
- housekeeping: Database backup and maintenance scripts

## Key Changes
- Moved all application code to web-app/ using git mv
- Moved database scripts to housekeeping/ workspace
- Updated Dockerfile for monorepo build process
- Updated docker-compose files (volume paths: ./web-app/etc/hosts/)
- Updated .gitignore for workspace-level node_modules
- Updated documentation (README.md, CLAUDE.md, CHANGELOG.md)

## Migration Impact
- Root package.json now manages workspaces
- Build commands delegate to web-app workspace
- All file history preserved via git mv
- Docker build process updated for workspace structure

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>

web-app/app/ui/MonthCard.tsx

@@ -0,0 +1,58 @@
+"use client";
+
+import { FC, useEffect, useRef } from "react";
+import { formatYearMonth } from "../lib/format";
+import { YearMonth } from "../lib/db-types";
+import { formatCurrency } from "../lib/formatStrings";
+import { useTranslations } from "next-intl";
+
+export interface MonthCardProps {
+    yearMonth: YearMonth,
+    children?: React.ReactNode,
+    unpaidTotal: number,
+    payedTotal: number,
+    currency?: string | null,
+    expanded?:boolean,
+    onToggle: (yearMonth:YearMonth) => void
+}
+
+export const MonthCard:FC<MonthCardProps> = ({ yearMonth, children, unpaidTotal, payedTotal, currency, expanded, onToggle }) => {
+
+  const elRef = useRef<HTMLDivElement>(null);
+  const t = useTranslations("home-page.month-card");
+
+  // Setting the `month` will activate the accordion belonging to that month
+  // If the accordion is already active, it will collapse it
+  const handleChange = (event:any) => onToggle(yearMonth);
+
+  useEffect(() => {
+    if(expanded && elRef.current) {
+      // if the element i selected > scroll it into view
+      elRef.current.scrollIntoView({ behavior: 'smooth', block: 'start' });
+    }
+  }, [expanded]);
+
+  return(
+    <div className={`collapse collapse-plus bg-base-200 my-1 sm:min-w-[25em] ${expanded ? "border-2 border-neutral" : ""}`} ref={elRef}>
+      <input type="checkbox" name="my-accordion-3" checked={expanded} onChange={handleChange} />
+      <div className={`collapse-title text-xl font-medium ${expanded ? "text-white" : ""}`}>
+        {`${formatYearMonth(yearMonth)}`}
+        {
+          unpaidTotal>0 ?
+            <p className="text-xs font-medium">
+              {t("total-due-label")} <strong>{ formatCurrency(unpaidTotal, currency ?? "EUR") }</strong>
+            </p> : null
+        }
+        {
+          payedTotal>0 ?
+            <p className="text-xs font-medium">
+              {t("total-payed-label")} <strong>{ formatCurrency(payedTotal, currency ?? "EUR") }</strong>
+            </p> : null
+        }
+      </div>
+      <div className="collapse-content"> 
+        {children}
+      </div>
+    </div>
+  )
+};