Initial commit: webmail client (M0/M1)

Three-pane webmail client. - Backend: FastAPI + async SQLAlchemy + arq worker (Postgres/Redis), IMAP/SMTP sync, threading, search, drafts/outbox with undo, attachments, 2FA. - Frontend: React 18 + Vite + TypeScript + TanStack Query + Tailwind; three-pane UI with rich-text composer, light/dark themes, resizable panels. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
2026-07-17 23:20:34 +02:00
commit a5ec0d21cb
174 changed files with 22239 additions and 0 deletions
@@ -0,0 +1,105 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+
+/* Semantic theme tokens as "R G B" triplets (consumed by tailwind.config.js as
+   rgb(var(--x) / <alpha>)). Light is the default; .dark on <html> flips them. */
+:root {
+  --app-bg: 243 244 246; /* app chrome behind panels */
+  --app-surface: 255 255 255; /* panels */
+  --app-elevated: 255 255 255; /* popovers, composer */
+  --app-border: 229 231 235;
+  --app-fg: 24 27 32;
+  --app-muted: 107 114 128;
+  --app-faint: 156 163 175;
+  --app-accent: 37 99 235;
+  --app-accent-fg: 255 255 255;
+  --app-hover: 243 244 246;
+  --app-active: 224 233 254; /* selected row */
+  color-scheme: light;
+}
+
+:root.dark {
+  --app-bg: 27 30 32; /* main background */
+  --app-surface: 33 36 39; /* panels (slightly elevated) */
+  --app-elevated: 39 42 46; /* popovers, composer */
+  --app-border: 38 40 42; /* subtle dark dividers */
+  --app-fg: 226 228 231;
+  --app-muted: 150 156 164;
+  --app-faint: 108 114 122;
+  --app-accent: 59 130 246;
+  --app-accent-fg: 255 255 255;
+  --app-hover: 42 46 50;
+  --app-active: 44 54 70;
+  color-scheme: dark;
+}
+
+html,
+body,
+#root {
+  height: 100%;
+  margin: 0;
+}
+
+body {
+  font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
+  background-color: rgb(var(--app-bg));
+  color: rgb(var(--app-fg));
+  -webkit-font-smoothing: antialiased;
+}
+
+/* Rich-text compose editor: quoted replies get depth-colored left borders
+   (blue → green → amber), matching a Fastmail-style nested quote. */
+.wmc-editor {
+  line-height: 1.55;
+}
+.wmc-editor:empty::before {
+  content: "";
+}
+.wmc-editor a {
+  color: rgb(var(--app-accent));
+  text-decoration: underline;
+}
+.wmc-editor ul {
+  list-style: disc;
+  padding-left: 1.4em;
+}
+.wmc-editor ol {
+  list-style: decimal;
+  padding-left: 1.4em;
+}
+.wmc-editor img {
+  max-width: 100%;
+  height: auto;
+}
+.wmc-editor blockquote {
+  margin: 0.5em 0;
+  padding: 0.35em 0.9em;
+  border-left: 2px solid #5b7fb9;
+  border-radius: 2px;
+  background: rgba(120, 140, 170, 0.06);
+}
+.wmc-editor blockquote blockquote {
+  border-left-color: #6a9955;
+  background: rgba(120, 160, 120, 0.06);
+}
+.wmc-editor blockquote blockquote blockquote {
+  border-left-color: #c08a4a;
+  background: rgba(180, 150, 100, 0.06);
+}
+
+/* Thin, unobtrusive scrollbars that match the theme. */
+* {
+  scrollbar-width: thin;
+  scrollbar-color: rgb(var(--app-border)) transparent;
+}
+*::-webkit-scrollbar {
+  width: 10px;
+  height: 10px;
+}
+*::-webkit-scrollbar-thumb {
+  background-color: rgb(var(--app-border));
+  border-radius: 6px;
+  border: 2px solid transparent;
+  background-clip: content-box;
+}