chk
/
Ka-Note
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

ui opti

This commit is contained in:
beo3000 2026-02-22 21:51:01 +01:00
parent d281b1babc
commit 92a077009e
9 changed files with 226 additions and 86 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
ka-note/VERSION
View File

@ -1 +1 @@
1.1.2
1.1.5

8
ka-note/client/src/lib/components/ContextHeader.svelte
View File

@ -74,13 +74,13 @@
{#if showModeSwitch}
<div class="flex gap-1 rounded-full bg-[#333] p-1">
<button
class="rounded-full border-none px-4 py-2 font-bold transition-all {mode === 'prep' ? 'bg-accent text-white shadow-md' : 'bg-transparent text-[#aaa] cursor-pointer'}"
class="rounded-full border-none px-3 py-1.5 text-sm font-bold transition-all {mode === 'prep' ? 'bg-accent text-white shadow-md' : 'bg-transparent text-[#aaa] cursor-pointer'}"
onclick={() => onmodechange?.('prep')}
>
Vorbereitung
</button>
<button
class="rounded-full border-none px-4 py-2 font-bold transition-all {mode === 'meeting' ? 'bg-warning text-[#222] shadow-md' : 'bg-transparent text-[#aaa] cursor-pointer'}"
class="rounded-full border-none px-3 py-1.5 text-sm font-bold transition-all {mode === 'meeting' ? 'bg-warning text-[#222] shadow-md' : 'bg-transparent text-[#aaa] cursor-pointer'}"
onclick={() => onmodechange?.('meeting')}
>
Meeting
@ -90,12 +90,12 @@
{#if showScopeSwitch}
<div class="flex gap-1 rounded-full bg-[#333] p-1">
<button
class="rounded-full border-none px-4 py-2 font-bold transition-all {journalScope === 'business' ? 'text-white shadow-md' : 'bg-transparent text-[#aaa] cursor-pointer'}"
class="rounded-full border-none px-3 py-1.5 text-sm font-bold transition-all {journalScope === 'business' ? 'text-white shadow-md' : 'bg-transparent text-[#aaa] cursor-pointer'}"
style={journalScope === 'business' ? `background-color: ${$scopeSettings.businessColor}` : ''}
onclick={() => onjournalscopechange?.('business')}
>Firma</button>
<button
class="rounded-full border-none px-4 py-2 font-bold transition-all {journalScope === 'private' ? 'text-white shadow-md' : 'bg-transparent text-[#aaa] cursor-pointer'}"
class="rounded-full border-none px-3 py-1.5 text-sm font-bold transition-all {journalScope === 'private' ? 'text-white shadow-md' : 'bg-transparent text-[#aaa] cursor-pointer'}"
style={journalScope === 'private' ? `background-color: ${$scopeSettings.privateColor}` : ''}
onclick={() => onjournalscopechange?.('private')}
>Privat</button>

37
ka-note/client/src/routes/companies/+page.svelte
View File

@ -2,9 +2,28 @@
import { goto } from '$app/navigation';
import { liveQuery } from 'dexie';
import { db } from '$lib/db/schema';
import { softDeleteContext, toggleFavorite } from '$lib/db/repositories';
import { softDeleteContext, toggleFavorite, upsertContext } from '$lib/db/repositories';
import { newId } from '$lib/db/helpers';
import ConfirmDialog from '$lib/components/ConfirmDialog.svelte';
let creating = $state(false);
let newName = $state('');
async function create() {
const name = newName.trim();
if (!name) return;
const id = newId();
await upsertContext({ id, name: `Firma ${name}`, type: 'company' });
newName = '';
creating = false;
goto(`/context/${id}`);
}
function onKeydown(e: KeyboardEvent) {
if (e.key === 'Enter') { e.preventDefault(); create(); }
else if (e.key === 'Escape') { creating = false; newName = ''; }
}
const allCompanies = liveQuery(() =>
db.contexts.filter(c => !c.deletedAt && c.type === 'company').sortBy('sortOrder')
);
@ -30,7 +49,21 @@
</script>
<div class="mx-auto max-w-3xl p-6">
<h1 class="mb-6 text-2xl font-bold text-white">Alle Firmen</h1>
<div class="mb-6 flex items-center gap-3">
<h1 class="flex-1 text-2xl font-bold text-white">Alle Firmen</h1>
<button class="rounded bg-accent px-3 py-1.5 text-sm font-medium text-white hover:bg-accent/80" onclick={() => creating = true}>+ Neu</button>
</div>
{#if creating}
<input
class="mb-4 w-full rounded bg-white/10 px-3 py-2 text-sm text-white outline-none placeholder:text-muted"
placeholder="Firmenname..."
bind:value={newName}
onkeydown={onKeydown}
onblur={() => setTimeout(() => { creating = false; newName = ''; }, 150)}
autofocus
/>
{/if}
{#if companies.length > 0}
<div class="flex flex-col gap-2">

37
ka-note/client/src/routes/meetings/+page.svelte
View File

@ -2,9 +2,28 @@
import { goto } from '$app/navigation';
import { liveQuery } from 'dexie';
import { db } from '$lib/db/schema';
import { softDeleteContext, toggleFavorite } from '$lib/db/repositories';
import { softDeleteContext, toggleFavorite, upsertContext } from '$lib/db/repositories';
import { newId } from '$lib/db/helpers';
import ConfirmDialog from '$lib/components/ConfirmDialog.svelte';
let creating = $state(false);
let newName = $state('');
async function create() {
const name = newName.trim();
if (!name) return;
const id = newId();
await upsertContext({ id, name, type: 'meeting' });
newName = '';
creating = false;
goto(`/context/${id}`);
}
function onKeydown(e: KeyboardEvent) {
if (e.key === 'Enter') { e.preventDefault(); create(); }
else if (e.key === 'Escape') { creating = false; newName = ''; }
}
const allMeetings = liveQuery(() =>
db.contexts.filter(c => !c.deletedAt && c.type === 'meeting' && c.id !== 'daily-log').sortBy('sortOrder')
);
@ -26,7 +45,21 @@
</script>
<div class="mx-auto max-w-3xl p-6">
<h1 class="mb-6 text-2xl font-bold text-white">Alle Jour Fixes</h1>
<div class="mb-6 flex items-center gap-3">
<h1 class="flex-1 text-2xl font-bold text-white">Alle Jour Fixes</h1>
<button class="rounded bg-accent px-3 py-1.5 text-sm font-medium text-white hover:bg-accent/80" onclick={() => creating = true}>+ Neu</button>
</div>
{#if creating}
<input
class="mb-4 w-full rounded bg-white/10 px-3 py-2 text-sm text-white outline-none placeholder:text-muted"
placeholder="Name des Jour Fix..."
bind:value={newName}
onkeydown={onKeydown}
onblur={() => setTimeout(() => { creating = false; newName = ''; }, 150)}
autofocus
/>
{/if}
{#if meetings.length > 0}
<div class="flex flex-col gap-2">

38
ka-note/client/src/routes/persons/+page.svelte
View File

@ -1,6 +1,9 @@
<script lang="ts">
import { goto } from '$app/navigation';
import { liveQuery } from 'dexie';
import { db } from '$lib/db/schema';
import { upsertContext } from '$lib/db/repositories';
import { newId } from '$lib/db/helpers';
import PersonList from '$lib/components/PersonList.svelte';
const allPersons = liveQuery(() =>
@ -8,9 +11,42 @@
);
const persons = $derived($allPersons ?? []);
let creating = $state(false);
let newName = $state('');
async function create() {
const name = newName.trim();
if (!name) return;
const id = newId();
await upsertContext({ id, name: `Person ${name}`, type: 'person' });
newName = '';
creating = false;
goto(`/context/${id}`);
}
function onKeydown(e: KeyboardEvent) {
if (e.key === 'Enter') { e.preventDefault(); create(); }
else if (e.key === 'Escape') { creating = false; newName = ''; }
}
</script>
<div class="mx-auto max-w-3xl p-6">
<h1 class="mb-6 text-2xl font-bold text-white">Alle Personen</h1>
<div class="mb-6 flex items-center gap-3">
<h1 class="flex-1 text-2xl font-bold text-white">Alle Personen</h1>
<button class="rounded bg-accent px-3 py-1.5 text-sm font-medium text-white hover:bg-accent/80" onclick={() => creating = true}>+ Neu</button>
</div>
{#if creating}
<input
class="mb-4 w-full rounded bg-white/10 px-3 py-2 text-sm text-white outline-none placeholder:text-muted"
placeholder="Name der Person..."
bind:value={newName}
onkeydown={onKeydown}
onblur={() => setTimeout(() => { creating = false; newName = ''; }, 150)}
autofocus
/>
{/if}
<PersonList {persons} />
</div>

37
ka-note/client/src/routes/projects/+page.svelte
View File

@ -2,10 +2,29 @@
import { goto } from '$app/navigation';
import { liveQuery } from 'dexie';
import { db } from '$lib/db/schema';
import { softDeleteContext, toggleFavorite } from '$lib/db/repositories';
import { softDeleteContext, toggleFavorite, upsertContext } from '$lib/db/repositories';
import { newId } from '$lib/db/helpers';
import ConfirmDialog from '$lib/components/ConfirmDialog.svelte';
import type { AgendaContext, ProjectMeta } from '@ka-note/shared';
let creating = $state(false);
let newName = $state('');
async function create() {
const name = newName.trim();
if (!name) return;
const id = newId();
await upsertContext({ id, name: `Project ${name}`, type: 'project' });
newName = '';
creating = false;
goto(`/context/${id}`);
}
function onKeydown(e: KeyboardEvent) {
if (e.key === 'Enter') { e.preventDefault(); create(); }
else if (e.key === 'Escape') { creating = false; newName = ''; }
}
const allProjects = liveQuery(() =>
db.contexts.filter(c => !c.deletedAt && c.type === 'project').sortBy('sortOrder')
);
@ -36,7 +55,21 @@
</script>
<div class="mx-auto max-w-3xl p-6">
<h1 class="mb-6 text-2xl font-bold text-white">Alle Projekte</h1>
<div class="mb-6 flex items-center gap-3">
<h1 class="flex-1 text-2xl font-bold text-white">Alle Projekte</h1>
<button class="rounded bg-accent px-3 py-1.5 text-sm font-medium text-white hover:bg-accent/80" onclick={() => creating = true}>+ Neu</button>
</div>
{#if creating}
<input
class="mb-4 w-full rounded bg-white/10 px-3 py-2 text-sm text-white outline-none placeholder:text-muted"
placeholder="Projektname..."
bind:value={newName}
onkeydown={onKeydown}
onblur={() => setTimeout(() => { creating = false; newName = ''; }, 150)}
autofocus
/>
{/if}
{#if activeProjects.length > 0}
<h2 class="mb-3 text-sm font-bold uppercase text-[#aaa]">Aktiv</h2>

81
ka-note/client/src/routes/wiki/[id]/+page.svelte
View File

@ -98,48 +98,51 @@
{#if currentPage}
<div class="space-y-4">
<!-- Header -->
<h1 class="flex items-center gap-3 border-b-2 pb-2.5" style="border-color: var(--scope-color)">
{#if editing}
<input
class="flex-1 bg-transparent text-2xl font-bold text-white outline-none placeholder:text-muted"
bind:value={titleInput}
onblur={saveTitle}
onkeydown={(e) => e.key === 'Enter' && (e.preventDefault(), saveTitle())}
placeholder="Seitentitel..."
/>
{:else}
<span class="flex-1 text-2xl font-bold">{currentPage.title}</span>
{/if}
<div class="border-b-2 pb-2.5 space-y-2" style="border-color: var(--scope-color)">
<!-- Row 1: title + scope toggle -->
<div class="flex items-center gap-3">
{#if editing}
<input
class="flex-1 bg-transparent text-2xl font-bold text-white outline-none placeholder:text-muted"
bind:value={titleInput}
onblur={saveTitle}
onkeydown={(e) => e.key === 'Enter' && (e.preventDefault(), saveTitle())}
placeholder="Seitentitel..."
/>
{:else}
<span class="flex-1 text-2xl font-bold">{currentPage.title}</span>
{/if}
<!-- Read/Edit toggle -->
<button
class="shrink-0 rounded px-3 py-1.5 text-sm font-medium transition-colors
{editing ? 'bg-accent text-white hover:bg-accent/80' : 'bg-white/10 text-[#ccc] hover:bg-white/20 hover:text-white'}"
onclick={() => editing ? switchToRead() : (editing = true)}
title={editing ? 'Leseansicht' : 'Bearbeiten'}
>
{editing ? '✓ Fertig' : '✎ Bearbeiten'}
</button>
<!-- Privat/Firma toggle -->
<div class="flex gap-1 rounded-full bg-[#333] p-1 shrink-0">
<button
class="rounded-full border-none px-3 py-1.5 text-sm font-bold transition-all {scope === 'business' ? 'text-white shadow-md' : 'bg-transparent text-[#aaa] cursor-pointer'}"
style={scope === 'business' ? `background-color: ${$scopeSettings.businessColor}` : ''}
onclick={() => handleScopeChange('business')}
>Firma</button>
<button
class="rounded-full border-none px-3 py-1.5 text-sm font-bold transition-all {scope === 'private' ? 'text-white shadow-md' : 'bg-transparent text-[#aaa] cursor-pointer'}"
style={scope === 'private' ? `background-color: ${$scopeSettings.privateColor}` : ''}
onclick={() => handleScopeChange('private')}
>Privat</button>
<!-- Privat/Firma toggle -->
<div class="flex gap-1 rounded-full bg-[#333] p-1 shrink-0">
<button
class="rounded-full border-none px-3 py-1.5 text-sm font-bold transition-all {scope === 'business' ? 'text-white shadow-md' : 'bg-transparent text-[#aaa] cursor-pointer'}"
style={scope === 'business' ? `background-color: ${$scopeSettings.businessColor}` : ''}
onclick={() => handleScopeChange('business')}
>Firma</button>
<button
class="rounded-full border-none px-3 py-1.5 text-sm font-bold transition-all {scope === 'private' ? 'text-white shadow-md' : 'bg-transparent text-[#aaa] cursor-pointer'}"
style={scope === 'private' ? `background-color: ${$scopeSettings.privateColor}` : ''}
onclick={() => handleScopeChange('private')}
>Privat</button>
</div>
</div>
<button
class="shrink-0 text-sm text-muted hover:text-danger"
onclick={() => confirmDelete = true}
>Löschen</button>
</h1>
<!-- Row 2: actions -->
<div class="flex items-center gap-2">
<button
class="rounded px-3 py-1.5 text-sm font-medium transition-colors
{editing ? 'bg-accent text-white hover:bg-accent/80' : 'bg-white/10 text-[#ccc] hover:bg-white/20 hover:text-white'}"
onclick={() => editing ? switchToRead() : (editing = true)}
>
{editing ? '✓ Fertig' : '✎ Bearbeiten'}
</button>
<button
class="rounded px-2 py-1.5 text-xs text-muted hover:bg-danger/20 hover:text-danger ml-auto"
onclick={() => confirmDelete = true}
>Löschen</button>
</div>
</div>
<!-- Notebook badges + assigner (always visible) -->
<div class="flex flex-wrap items-center gap-2">

72
ka-note/client/src/routes/wiki/notebook/[id]/+page.svelte
View File

@ -46,54 +46,56 @@
{#if $notebook$}
<div class="space-y-4">
<h1 class="flex items-center gap-3 border-b-2 pb-2.5 text-2xl font-bold" style="border-color: var(--scope-color)">
<button class="text-base text-muted hover:text-white" onclick={() => goto('/wiki')}>&larr;</button>
<div class="border-b-2 pb-2.5 space-y-2" style="border-color: var(--scope-color)">
<!-- Row 1: back + title + scope toggle -->
<div class="flex items-center gap-3">
<button class="text-base text-muted hover:text-white shrink-0" onclick={() => goto('/wiki')}>&larr;</button>
{#if editingName}
<input
class="flex-1 bg-transparent border-b-2 border-accent outline-none text-inherit"
bind:value={nameInput}
onkeydown={(e) => { if (e.key === 'Enter') { e.preventDefault(); saveRename(); } else if (e.key === 'Escape') editingName = false; }}
onblur={saveRename}
autofocus
/>
{:else}
<span class="flex-1">{$notebook$.name}</span>
<button class="text-base text-muted hover:text-white" onclick={startRename} title="Umbenennen">✎</button>
{/if}
{#if editingName}
<input
class="flex-1 bg-transparent text-2xl font-bold border-b-2 border-accent outline-none text-inherit"
bind:value={nameInput}
onkeydown={(e) => { if (e.key === 'Enter') { e.preventDefault(); saveRename(); } else if (e.key === 'Escape') editingName = false; }}
onblur={saveRename}
autofocus
/>
{:else}
<span class="flex-1 text-2xl font-bold">{$notebook$.name}</span>
<button class="text-base text-muted hover:text-white shrink-0" onclick={startRename} title="Umbenennen">✎</button>
{/if}
<!-- Favoriten-Stern -->
<button
class="text-xl {$notebook$.isFavorite ? 'text-warning' : 'text-muted hover:text-warning'}"
onclick={() => toggleNotebookFavorite(notebookId)}
title={$notebook$.isFavorite ? 'Aus Sidebar entfernen' : 'In Sidebar anzeigen'}
>★</button>
<!-- Privat/Firma toggle -->
<div class="flex gap-1 rounded-full bg-[#333] p-1">
<button
class="rounded-full border-none px-2.5 py-1 text-xs font-bold transition-all {!$notebook$.isPrivate ? 'text-white shadow-md' : 'bg-transparent text-[#aaa] cursor-pointer'}"
style={!$notebook$.isPrivate ? `background-color: ${$scopeSettings.businessColor}` : ''}
onclick={() => upsertNotebook({ id: notebookId, isPrivate: false })}
>Firma</button>
<button
class="rounded-full border-none px-2.5 py-1 text-xs font-bold transition-all {$notebook$.isPrivate ? 'text-white shadow-md' : 'bg-transparent text-[#aaa] cursor-pointer'}"
style={$notebook$.isPrivate ? `background-color: ${$scopeSettings.privateColor}` : ''}
onclick={() => upsertNotebook({ id: notebookId, isPrivate: true })}
>Privat</button>
<!-- Privat/Firma toggle -->
<div class="flex gap-1 rounded-full bg-[#333] p-1 shrink-0">
<button
class="rounded-full border-none px-3 py-1.5 text-sm font-bold transition-all {!$notebook$.isPrivate ? 'text-white shadow-md' : 'bg-transparent text-[#aaa] cursor-pointer'}"
style={!$notebook$.isPrivate ? `background-color: ${$scopeSettings.businessColor}` : ''}
onclick={() => upsertNotebook({ id: notebookId, isPrivate: false })}
>Firma</button>
<button
class="rounded-full border-none px-3 py-1.5 text-sm font-bold transition-all {$notebook$.isPrivate ? 'text-white shadow-md' : 'bg-transparent text-[#aaa] cursor-pointer'}"
style={$notebook$.isPrivate ? `background-color: ${$scopeSettings.privateColor}` : ''}
onclick={() => upsertNotebook({ id: notebookId, isPrivate: true })}
>Privat</button>
</div>
</div>
<div class="ml-auto flex items-center gap-2">
<!-- Row 2: actions -->
<div class="flex items-center gap-2">
<button
class="rounded bg-accent px-3 py-1.5 text-sm font-medium text-white hover:bg-accent/80"
onclick={addPage}
>+ Neue Seite</button>
<button
class="rounded px-2 py-1.5 text-xs text-muted hover:bg-danger/20 hover:text-danger"
onclick={() => toggleNotebookFavorite(notebookId)}
title={$notebook$.isFavorite ? 'Aus Sidebar entfernen' : 'In Sidebar anzeigen'}
>{$notebook$.isFavorite ? '★ Sidebar' : '☆ Sidebar'}</button>
<button
class="rounded px-2 py-1.5 text-xs text-muted hover:bg-danger/20 hover:text-danger ml-auto"
onclick={() => confirmDelete = true}
>Löschen</button>
</div>
</h1>
</div>
<div class="space-y-1">
{#each ($pages$ ?? []) as p (p.id)}

BIN
ka-note/server/ka-note.db-wal
View File

Binary file not shown.