diff --git a/apps/mana/apps/web/src/lib/app-registry/help-content.ts b/apps/mana/apps/web/src/lib/app-registry/help-content.ts index 82693ff8d..fc6e4b0c6 100644 --- a/apps/mana/apps/web/src/lib/app-registry/help-content.ts +++ b/apps/mana/apps/web/src/lib/app-registry/help-content.ts @@ -612,6 +612,28 @@ export const MODULE_HELP: Record = { 'Lege deinen Heimatort als Standard fest', ], }, + writing: { + description: + 'KI-Ghostwriter für intentional produzierten Prosa-Text. Brief Thema, Stil und Quellen — ein fertiger Entwurf entsteht, den du iterativ verfeinerst.', + features: [ + '12 Textarten: Blog, Essay, E-Mail, Social, Story, Brief, Rede, Bewerbung, Pressetext, Bio, …', + '9 eingebaute Schreibstile (Akademisch, Casual Blog, LinkedIn, Hemingway, Memoir, …) plus eigene Stile', + 'Quellen verknüpfen aus 7 Modulen: Artikel, Notiz, Library, Kontext, Ziel, Bild, URL', + 'Selection-Verfeinerung: Markiere Text → Kürzen / Erweitern / Ton ändern / Umschreiben / Übersetzen', + 'Versionierung mit "Als Checkpoint speichern" + Wiederherstellen', + 'Visibility: privat / Space / Unlisted-Link / öffentlich', + 'Export: Markdown, PDF, "Als Artikel speichern"', + 'Persona-Linkage: Agents pinnen einen Default-Stil', + 'Token-Cost pro Generation in der Versionshistorie', + ], + tips: [ + '⌘G generiert · ⌘⇧S speichert Checkpoint · ⌘Z macht letzte Verfeinerung rückgängig', + 'Klicke ✨ neben dem Titel-Feld — die KI schlägt einen Titel aus deinem Briefing vor', + 'In der BriefingForm: "Quellen" → 7 Buttons. Nutze "Kontext" um den Space-Kontext-Doc anzuhängen.', + 'Drafts sind ziehbar — auf andere Module droppen, sobald deren Drop-Targets ausgebaut sind', + 'Eigene Stile unter "🎨 Stile" anlegen — die Beschreibung wird wörtlich an die KI übergeben', + ], + }, library: { description: 'Medien-Log — Bücher, Filme, Serien und Comics tracken. Status, Fortschritt, Bewertung.', diff --git a/apps/mana/apps/web/src/lib/modules/writing/views/ListView.svelte b/apps/mana/apps/web/src/lib/modules/writing/views/ListView.svelte index d605054b6..7b7dcfc82 100644 --- a/apps/mana/apps/web/src/lib/modules/writing/views/ListView.svelte +++ b/apps/mana/apps/web/src/lib/modules/writing/views/ListView.svelte @@ -1,6 +1,10 @@ +
+ {#if !isEmpty} - 🎨 Stile - -
- - (activeKind = k)} /> - -
- (activeStatus = s)} /> - -
+ {/if} + + 🎨 + + + {#if !isEmpty} +
+ (activeKind = k)} /> +
+ (activeStatus = s)} /> + +
+
+ {/if} + {#if showCreate}
Lädt…

+ {:else if isEmpty && !showCreate} + +
+ +

Dein KI-Ghostwriter

+

+ Brief Thema, Stil und Quellen — ein fertiger Entwurf entsteht. Verfeinere ihn absatzweise + mit ⌘G zum Generieren, Markieren + Selection-Tools, oder direkt im Editor. +

+

+ ✨ 12 Textarten · 9 Stile · 7 Quellen-Typen · End-to-End-verschlüsselt +

+ +
+

Schnellstart:

+
+ {#each QUICK_START_KINDS as kind (kind)} + + {/each} +
+
+
{:else if filtered.length === 0}
- {#if drafts.length === 0} -

Noch keine Drafts

-

- Klick auf + Neuer Draft, brief dem Ghostwriter Thema, Stil und Länge — M3 - ergänzt die Generate-Funktion. Bis dahin kannst du Drafts manuell erstellen und editieren. -

- {:else} -

Keine Drafts passen zum aktuellen Filter.

- {/if} +

Keine Drafts passen zum aktuellen Filter.

{:else}
@@ -188,25 +251,31 @@ text-align: center; margin-top: 2rem; } - .controls { + .action-bar { + display: flex; + align-items: center; + gap: 0.5rem; + margin-bottom: 0.75rem; + } + .action-bar.compact { + justify-content: flex-end; + margin-bottom: 0.25rem; + } + .filter-stack { display: flex; flex-direction: column; gap: 0.75rem; margin-bottom: 1.5rem; } - .search-row { - display: flex; - align-items: center; - gap: 0.75rem; - } .styles-link { - padding: 0.45rem 0.75rem; - border-radius: 0.55rem; - border: 1px solid var(--color-border, rgba(0, 0, 0, 0.1)); + padding: 0.4rem 0.55rem; + border-radius: 0.5rem; + border: 1px solid var(--color-border, rgba(0, 0, 0, 0.08)); background: transparent; - color: inherit; + color: var(--color-text-muted, rgba(0, 0, 0, 0.55)); text-decoration: none; - font-size: 0.85rem; + font-size: 0.95rem; + line-height: 1; white-space: nowrap; flex-shrink: 0; } @@ -272,17 +341,100 @@ } .empty { max-width: 540px; - margin: 3rem auto; + margin: 2rem auto; text-align: center; } - .empty h2 { - margin: 0 0 0.5rem; - font-size: 1.2rem; - } .empty p { color: var(--color-text-muted, rgba(0, 0, 0, 0.55)); line-height: 1.5; } + + .hero { + max-width: 600px; + margin: 1.5rem auto; + padding: 1.5rem 1rem; + text-align: center; + } + .hero-icon { + font-size: 2.4rem; + line-height: 1; + margin-bottom: 0.75rem; + } + .hero h2 { + margin: 0 0 0.5rem; + font-size: 1.4rem; + font-weight: 600; + } + .hero-pitch { + color: var(--color-text-muted, rgba(0, 0, 0, 0.55)); + line-height: 1.55; + margin: 0 auto 1rem; + max-width: 480px; + font-size: 0.95rem; + } + .hero-meta { + font-size: 0.75rem; + color: var(--color-text-muted, rgba(0, 0, 0, 0.45)); + margin: 0 0 1.75rem; + } + + .quick-start { + margin-top: 1rem; + } + .quick-start-label { + font-size: 0.75rem; + text-transform: uppercase; + letter-spacing: 0.05em; + color: var(--color-text-muted, rgba(0, 0, 0, 0.55)); + margin: 0 0 0.6rem; + font-weight: 500; + } + .quick-grid { + display: grid; + grid-template-columns: repeat(3, 1fr); + gap: 0.55rem; + } + .quick-tile { + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + gap: 0.3rem; + padding: 0.85rem 0.5rem; + border-radius: 0.65rem; + border: 1px solid var(--color-border, rgba(0, 0, 0, 0.08)); + background: var(--color-surface, rgba(255, 255, 255, 0.04)); + cursor: pointer; + font: inherit; + color: inherit; + transition: + border-color 0.15s ease, + background 0.15s ease, + transform 0.1s ease; + } + .quick-tile:hover { + border-color: #0ea5e9; + background: color-mix(in srgb, #0ea5e9 6%, transparent); + color: #0ea5e9; + } + .quick-tile:active { + transform: scale(0.98); + } + .quick-emoji { + font-size: 1.35rem; + line-height: 1; + } + .quick-label { + font-size: 0.8rem; + font-weight: 500; + } + + @media (max-width: 480px) { + .quick-grid { + grid-template-columns: repeat(2, 1fr); + } + } + .grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));