Release 0.5.9

src/routes/fundus/+page.server.ts

@@ -8,7 +8,8 @@ import {
 	getTaxonomy,
 	listPieces,
 	listPieceTemplates,
-	setPieceArchived
+	setPieceArchived,
+	setPieceFavorite
 } from '#lib/server/content.js';
 import { getPieceUsageContexts } from '#lib/server/shows.js';
 
@@ -93,5 +94,15 @@ export const actions = {
 		} catch (cause) {
 			return fail(409, { intent: 'archive', error: actionError(cause) });
 		}
+	},
+	favorite: async ({ locals, request }) => {
+		requireUser(locals.user);
+		const data = await request.formData();
+		try {
+			setPieceFavorite(String(data.get('pieceId') || ''), data.get('favorite') === '1');
+			return { intent: 'favorite', success: 'Favorit aktualisiert.' };
+		} catch (cause) {
+			return fail(404, { intent: 'favorite', error: actionError(cause) });
+		}
 	}
 } satisfies Actions;

src/routes/fundus/+page.svelte

@@ -1,4 +1,5 @@
 <script lang="ts">
+	import { enhance } from '$app/forms';
 	import { goto, replaceState } from '$app/navigation';
 	import { resolve } from '$app/paths';
 	import { page } from '$app/state';
@@ -13,7 +14,7 @@
 	let visiblePieces = $derived(
 		data.pieces.filter(
 			(piece) =>
-				(showUsedPieces || piece.sentHistory.length === 0) &&
+				(showUsedPieces || piece.sentHistory.length === 0 || piece.isFavorite) &&
 				(showPlannedPieces || !piece.isPlannedInActiveShow)
 		)
 	);
@@ -193,6 +194,19 @@
 					class="piece-card"
 					style={`--category: ${piece.categories[0]?.color ?? '#8b8f98'}`}
 				>
+					<form method="POST" action="?/favorite" class="piece-favorite-form" use:enhance>
+						<input type="hidden" name="pieceId" value={piece.id} />
+						<input type="hidden" name="favorite" value={piece.isFavorite ? '0' : '1'} />
+						<button
+							class="piece-favorite"
+							class:active={piece.isFavorite}
+							type="submit"
+							aria-label={piece.isFavorite
+								? `${piece.title} aus Favoriten entfernen`
+								: `${piece.title} als Favorit markieren`}
+							aria-pressed={piece.isFavorite}>★</button
+						>
+					</form>
 					{#if piece.mediaId}<img
 							class="piece-thumbnail"
 							src={`/media/${piece.mediaId}`}

src/routes/fundus/[id]/+page.server.ts

@@ -11,12 +11,14 @@ import {
 	savePiece,
 	savePieceAsTemplate,
 	setPieceArchived,
+	setPieceFavorite,
 	uploadPieceImage,
 	type EditablePieceStatus,
 	type PieceInput,
 	type PieceSourceInput
 } from '#lib/server/content.js';
 import { renderMarkdown } from '#lib/server/markdown.js';
+import { listTools } from '#lib/server/tools.js';
 
 function renderedFields(
 	piece: Pick<
@@ -57,6 +59,9 @@ function pieceInput(data: FormData): PieceInput {
 			timecodeSeconds: timecode ? Number(timecode) : null
 		});
 	}
+	const toolIds = data.getAll('toolId').map(String);
+	const toolWorkUrls = data.getAll('toolWorkUrl').map(String);
+	const toolNotes = data.getAll('toolNote').map(String);
 	return {
 		title: text(data, 'title'),
 		outputTitle: text(data, 'outputTitle'),
@@ -85,7 +90,12 @@ function pieceInput(data: FormData): PieceInput {
 		presentationMetadataFetchedAtUtc: text(data, 'presentationMetadataFetchedAtUtc') || null,
 		topicIds: data.getAll('topicIds').map(String),
 		categoryIds: data.getAll('categoryIds').map(String),
-		sources
+		sources,
+		tools: toolIds.map((toolId, index) => ({
+			toolId,
+			workUrl: toolWorkUrls[index] ?? '',
+			note: toolNotes[index] ?? ''
+		}))
 	};
 }
 
@@ -126,6 +136,7 @@ export const load: PageServerLoad = ({ locals, params }) => {
 	return {
 		piece,
 		taxonomy: getTaxonomy(),
+		tools: listTools(true),
 		templates: listPieceTemplates().filter((template) => template.id !== 'blank'),
 		rendered: renderedFields(piece)
 	};
@@ -243,5 +254,15 @@ export const actions = {
 			return fail(409, { intent: 'archive', error: saveError(cause).error });
 		}
 		redirect(303, '/archiv');
+	},
+	favorite: async ({ locals, params, request }) => {
+		requireUser(locals.user);
+		const data = await request.formData();
+		try {
+			setPieceFavorite(params.id, data.get('favorite') === '1');
+			return { intent: 'favorite', success: true };
+		} catch (cause) {
+			return fail(404, { intent: 'favorite', error: saveError(cause).error });
+		}
 	}
 } satisfies Actions;

src/routes/fundus/[id]/+page.svelte

@@ -14,6 +14,8 @@
 	let durationMinutes = $state(untrack(() => Number((data.piece.durationSeconds / 60).toFixed(2))));
 	let revision = $state(untrack(() => data.piece.revision));
 	let sources = $state(untrack(() => data.piece.sources.map((source) => ({ ...source }))));
+	let pieceTools = $state(untrack(() => data.piece.tools.map((tool) => ({ ...tool }))));
+	let toolToAdd = $state('');
 	let rendered = $state(untrack(() => ({ ...data.rendered })));
 	let activeSection = $state<'script' | 'research' | 'presentation'>('script');
 	let saveState = $state<'idle' | 'dirty' | 'saving' | 'saved' | 'error' | 'conflict'>('idle');
@@ -44,6 +46,9 @@
 	);
 	let previewContent = $derived<PresentationContent>({
 		mode: draft.presentationMode,
+		topics: data.taxonomy.topics
+			.filter((topic) => draft.topicIds.includes(topic.id))
+			.map((topic) => topic.name),
 		title: draft.outputTitle || draft.title,
 		html: rendered.presentation,
 		source: featuredSource
@@ -147,6 +152,27 @@
 		scheduleSave();
 	}
 
+	function addTool() {
+		const tool = data.tools.find((item) => item.id === toolToAdd);
+		if (!tool || pieceTools.some((item) => item.toolId === tool.id)) return;
+		pieceTools.push({
+			id: crypto.randomUUID(),
+			toolId: tool.id,
+			name: tool.name,
+			startUrl: tool.startUrl,
+			isActive: tool.isActive,
+			workUrl: '',
+			note: ''
+		});
+		toolToAdd = '';
+		scheduleSave();
+	}
+
+	function removeTool(index: number) {
+		pieceTools.splice(index, 1);
+		scheduleSave();
+	}
+
 	function presentationSourceChanged() {
 		draft.presentationMetadataFetchedAtUtc = null;
 		draft.presentationProvider = '';
@@ -209,7 +235,19 @@
 		onrequestclose={requestClose}
 	>
 		{#snippet header()}
-			<p class="eyebrow">Fundusfassung</p>
+			<div class="piece-editor-kicker">
+				<p class="eyebrow">Fundusfassung</p>
+				<form method="POST" action="?/favorite" use:enhance>
+					<input type="hidden" name="favorite" value={data.piece.isFavorite ? '0' : '1'} />
+					<button
+						class="piece-favorite"
+						class:active={data.piece.isFavorite}
+						type="submit"
+						aria-label={data.piece.isFavorite ? 'Aus Favoriten entfernen' : 'Als Favorit markieren'}
+						aria-pressed={data.piece.isFavorite}>★</button
+					>
+				</form>
+			</div>
 			<label class="piece-dialog-title">
 				<span class="sr-only">Titel</span>
 				<textarea
@@ -396,6 +434,62 @@
 								</div>{/each}
 						</div>{:else}<p class="context-empty">Noch keine Quelle hinterlegt.</p>{/if}
 				</section>
+				<section class="piece-source-editor">
+					<div class="piece-subsection-heading">
+						<div>
+							<p class="eyebrow">Arbeitsmittel</p>
+							<h3>Werkzeuge</h3>
+						</div>
+						<div class="tool-picker">
+							<label class="sr-only" for="piece-tool-picker">Werkzeug auswählen</label>
+							<select id="piece-tool-picker" bind:value={toolToAdd}>
+								<option value="">Werkzeug auswählen</option>
+								{#each data.tools.filter((tool) => tool.isActive && !pieceTools.some((assigned) => assigned.toolId === tool.id)) as tool (tool.id)}
+									<option value={tool.id}
+										>{tool.name}{tool.formatIds.includes(draft.formatId ?? '')
+											? ' · passt zum Format'
+											: ''}</option
+									>
+								{/each}
+							</select>
+							<button class="secondary-button" type="button" onclick={addTool} disabled={!toolToAdd}
+								>Hinzufügen</button
+							>
+						</div>
+					</div>
+					{#if pieceTools.length}<div class="source-list">
+							{#each pieceTools as tool, index (tool.id)}<div
+									class="source-row tool-assignment-row"
+								>
+									<input type="hidden" name="toolId" value={tool.toolId} />
+									<div class="tool-assignment-name">
+										<strong>{tool.name}</strong>{#if !tool.isActive}<small>Deaktiviert</small>{/if}
+									</div>
+									<label
+										>Arbeitslink<input
+											name="toolWorkUrl"
+											type="url"
+											maxlength="2000"
+											placeholder={tool.startUrl || 'https://…'}
+											bind:value={tool.workUrl}
+										/></label
+									>
+									<label
+										>Notiz<input
+											name="toolNote"
+											maxlength="2000"
+											placeholder="Optional"
+											bind:value={tool.note}
+										/></label
+									>
+									<button
+										class="text-button danger-text"
+										type="button"
+										onclick={() => removeTool(index)}>Entfernen</button
+									>
+								</div>{/each}
+						</div>{:else}<p class="context-empty">Noch kein Werkzeug zugeordnet.</p>{/if}
+				</section>
 			</section>
 
 			<section class="piece-editor-panel" hidden={activeSection !== 'presentation'}>

src/routes/fundus/[id]/praesentation/+page.server.ts

@@ -1,7 +1,7 @@
 import { error } from '@sveltejs/kit';
 import type { PageServerLoad } from './$types';
 import { requireUser } from '#lib/server/auth.js';
-import { getPiece } from '#lib/server/content.js';
+import { getPiece, getTaxonomy } from '#lib/server/content.js';
 import { renderMarkdown } from '#lib/server/markdown.js';
 import { buildEmbedUrl, type PresentationContent } from '#lib/server/presentation.js';
 
@@ -18,6 +18,9 @@ export const load: PageServerLoad = ({ locals, params }) => {
 		images: { id: string; altText: string }[];
 	} = {
 		mode: piece.presentationMode,
+		topics: getTaxonomy()
+			.topics.filter((topic) => piece.topicIds.includes(topic.id))
+			.map((topic) => topic.name),
 		title: piece.outputTitle || piece.title,
 		html: renderMarkdown(piece.presentationText),
 		source,

src/routes/live/+page.svelte

@@ -13,6 +13,7 @@
 	let now = $state(Date.now());
 	let loadedAt = $state(Date.now());
 	let currentId = $state(untrack(() => data.live.current?.id ?? null));
+	let loadedRevision = $state(untrack(() => data.live.liveRevision));
 	let outputWindow: Window | null = null;
 	let progress = $derived(
 		data.live.totalCount ? Math.round((data.live.completedCount / data.live.totalCount) * 100) : 0
@@ -21,11 +22,21 @@
 		(data.live.current?.actualDurationSeconds ?? 0) +
 			(data.live.current ? Math.max(0, Math.floor((now - loadedAt) / 1000)) : 0)
 	);
+	let sectionElapsedSeconds = $derived(
+		(data.live.sectionTimer?.elapsedSeconds ?? 0) +
+			(data.live.sectionTimer?.runningSinceUtc
+				? Math.max(0, Math.floor((now - loadedAt) / 1000))
+				: 0)
+	);
+	let sectionRemainingSeconds = $derived(
+		(data.live.sectionTimer?.plannedDurationSeconds ?? 0) - sectionElapsedSeconds
+	);
 
 	$effect(() => {
 		const nextCurrentId = data.live.current?.id ?? null;
-		if (nextCurrentId !== currentId) {
+		if (nextCurrentId !== currentId || data.live.liveRevision !== loadedRevision) {
 			currentId = nextCurrentId;
+			loadedRevision = data.live.liveRevision;
 			loadedAt = Date.now();
 		}
 	});
@@ -73,6 +84,15 @@
 		persistSettings();
 	}
 
+	function formatCountdown(totalSeconds: number) {
+		const hours = Math.floor(totalSeconds / 3600);
+		const minutes = Math.floor((totalSeconds % 3600) / 60);
+		const seconds = Math.floor(totalSeconds % 60);
+		return hours > 0
+			? `${hours}:${minutes.toString().padStart(2, '0')}:${seconds.toString().padStart(2, '0')}`
+			: `${minutes.toString().padStart(2, '0')}:${seconds.toString().padStart(2, '0')}`;
+	}
+
 	function liveAction(name: string) {
 		return `?show=${encodeURIComponent(data.live.show.id)}&/${name}`;
 	}
@@ -187,6 +207,21 @@
 				style={`--prompt-size: ${promptSize}rem`}
 				aria-labelledby="current-title"
 			>
+				{#if data.live.sectionTimer?.sectionId === data.live.current.sectionId}
+					<section
+						class:warning={sectionRemainingSeconds <= 120 && sectionRemainingSeconds >= 0}
+						class:overrun={sectionRemainingSeconds < 0}
+						class="section-countdown"
+						aria-live="off"
+					>
+						<span>{data.live.sectionTimer.sectionName} · Abschnitt</span>
+						<strong
+							>{sectionRemainingSeconds < 0
+								? `Überzogen +${formatCountdown(Math.abs(sectionRemainingSeconds))}`
+								: `Noch ${formatCountdown(sectionRemainingSeconds)}`}</strong
+						>
+					</section>
+				{/if}
 				<div class="live-kicker">
 					<span>Aktuell · {data.live.current.sectionName}</span>
 					{#if showTimes}<strong
@@ -209,6 +244,45 @@
 					<!-- eslint-disable-next-line svelte/no-at-html-tags -->
 					<div class="live-markdown">{@html data.live.current.researchHtml}</div>
 				</details>
+				{#if data.live.current.sources.length || data.live.current.tools.length}
+					<!-- eslint-disable svelte/no-navigation-without-resolve -->
+					<section class="live-materials" aria-labelledby="live-materials-title">
+						<div>
+							<span>Nur Redaktion</span>
+							<h3 id="live-materials-title">Materialien</h3>
+						</div>
+						{#if data.live.current.sources.length}<div class="live-material-group">
+								<strong>Quellen</strong>
+								<ul>
+									{#each data.live.current.sources as source (source.id)}<li>
+											<!-- The URL is a server-validated private HTTP(S) snapshot. -->
+											<!-- eslint-disable-next-line svelte/no-navigation-without-resolve -->
+											<a href={source.url} target="_blank" rel="noopener noreferrer"
+												>{source.label}</a
+											>{#if source.timecodeSeconds !== null}<small
+													>ab {formatClock(source.timecodeSeconds)}</small
+												>{/if}
+										</li>{/each}
+								</ul>
+							</div>{/if}
+						{#if data.live.current.tools.length}<div class="live-material-group">
+								<strong>Werkzeuge</strong>
+								<ul>
+									{#each data.live.current.tools as tool (tool.id)}<li>
+											{#if tool.workUrl || tool.startUrl}<!-- The URL is a server-validated private HTTP(S) snapshot. -->
+												<!-- eslint-disable-next-line svelte/no-navigation-without-resolve -->
+												<a
+													href={tool.workUrl || tool.startUrl}
+													target="_blank"
+													rel="noopener noreferrer">{tool.name}</a
+												>{:else}<span>{tool.name}</span><small>Kein Link hinterlegt</small>{/if}
+											{#if tool.note}<small>{tool.note}</small>{/if}
+										</li>{/each}
+								</ul>
+							</div>{/if}
+					</section>
+					<!-- eslint-enable svelte/no-navigation-without-resolve -->
+				{/if}
 				{#if data.live.current.transitionHtml}<section class="transition-card">
 						<span>Überleitung</span>
 						<!-- eslint-disable-next-line svelte/no-at-html-tags -->

src/routes/sendungen/[id]/+page.server.ts

@@ -215,6 +215,9 @@ export const actions = {
 	updateUsage: async ({ locals, params, request }) => {
 		requireUser(locals.user);
 		const data = await request.formData();
+		const toolIds = data.getAll('usageToolId').map(String);
+		const toolWorkUrls = data.getAll('toolWorkUrl').map(String);
+		const toolNotes = data.getAll('toolNote').map(String);
 		return attempt('updateUsage', () =>
 			updatePieceUsage(params.id, text(data, 'usageId'), Number(data.get('revision')), {
 				title: text(data, 'title'),
@@ -235,7 +238,12 @@ export const actions = {
 				presentationTitle: text(data, 'presentationTitle'),
 				presentationDescription: text(data, 'presentationDescription'),
 				presentationImageUrl: text(data, 'presentationImageUrl'),
-				presentationSiteName: text(data, 'presentationSiteName')
+				presentationSiteName: text(data, 'presentationSiteName'),
+				tools: toolIds.map((id, index) => ({
+					id,
+					workUrl: toolWorkUrls[index] ?? '',
+					note: toolNotes[index] ?? ''
+				}))
 			})
 		);
 	},

src/routes/sendungen/[id]/+page.svelte

@@ -35,7 +35,7 @@
 	let visiblePieces = $derived(
 		data.pieces.filter(
 			(piece) =>
-				(showUsedPieces || piece.sentHistory.length === 0) &&
+				(showUsedPieces || piece.sentHistory.length === 0 || piece.isFavorite) &&
 				(showPlannedPieces || !piece.isPlannedInCurrentShow)
 		)
 	);
@@ -411,7 +411,10 @@
 									><i></i>{piece.categories.map((item) => item.name).join(', ') || 'Offen'}</span
 								><span>{formatClock(piece.durationSeconds)}</span>
 							</div>
-							<h3>{piece.title}</h3>
+							<h3>
+								{#if piece.isFavorite}<span class="favorite-mark" aria-label="Favorit">★</span
+									>{/if}{piece.title}
+							</h3>
 							<p>
 								{piece.format} · {piece.topics.map((item) => item.name).join(', ') || 'Ohne Thema'}
 							</p>

src/routes/verwaltung/+page.server.ts

@@ -7,6 +7,7 @@ import {
 	type TaxonomyKind
 } from '#lib/server/content.js';
 import { getMailConfig } from '#lib/server/config.js';
+import { createTool, listTools, updateTool, type ToolInput } from '#lib/server/tools.js';
 import {
 	inviteUser,
 	isRole,
@@ -25,6 +26,7 @@ export const load: PageServerLoad = ({ locals }) => {
 		taxonomy: getTaxonomy(),
 		users: listUsers(),
 		invitations: listOpenInvitations(),
+		tools: listTools(true),
 		mailTransport: getMailConfig().transport
 	};
 };
@@ -40,9 +42,25 @@ function actionError(cause: unknown): string {
 		return 'Verwendete oder für Vorlagen benötigte Einträge können nicht entfernt werden.';
 	if (code === 'INVALID_COLOR') return 'Bitte eine gültige Farbe wählen.';
 	if (code === 'INVALID_TAXONOMY') return 'Bitte einen gültigen Namen eingeben.';
+	if (code === 'TOOL_EXISTS') return 'Ein Werkzeug mit diesem Namen existiert bereits.';
+	if (code === 'INVALID_TOOL_URL')
+		return 'Die Start-URL muss eine vollständige HTTP- oder HTTPS-Adresse sein.';
+	if (code === 'INVALID_TOOL_FORMAT')
+		return 'Mindestens ein gewähltes Format existiert nicht mehr.';
+	if (code === 'INVALID_TOOL') return 'Bitte die Werkzeugdaten prüfen.';
 	return 'Die Aktion konnte nicht ausgeführt werden.';
 }
 
+function toolInput(data: FormData): ToolInput {
+	return {
+		name: String(data.get('name') || ''),
+		startUrl: String(data.get('startUrl') || ''),
+		description: String(data.get('description') || ''),
+		isActive: data.get('isActive') === '1',
+		formatIds: data.getAll('formatIds').map(String)
+	};
+}
+
 export const actions = {
 	invite: async ({ locals, request }) => {
 		const actor = requireBarkeeper(locals.user);
@@ -131,5 +149,25 @@ export const actions = {
 		} catch (cause) {
 			return fail(400, { intent: 'taxonomy', error: actionError(cause) });
 		}
+	},
+	createTool: async ({ locals, request }) => {
+		requireBarkeeper(locals.user);
+		const data = await request.formData();
+		try {
+			createTool(toolInput(data));
+			return { intent: 'tool', success: 'Werkzeug angelegt.' };
+		} catch (cause) {
+			return fail(400, { intent: 'tool', error: actionError(cause) });
+		}
+	},
+	updateTool: async ({ locals, request }) => {
+		requireBarkeeper(locals.user);
+		const data = await request.formData();
+		try {
+			updateTool(String(data.get('toolId') || ''), toolInput(data));
+			return { intent: 'tool', success: 'Werkzeug aktualisiert.' };
+		} catch (cause) {
+			return fail(400, { intent: 'tool', error: actionError(cause) });
+		}
 	}
 } satisfies Actions;

src/routes/verwaltung/+page.svelte

@@ -12,7 +12,7 @@
 <div class="page-wrap narrow-page">
 	<header class="page-heading">
 		<h1>Verwaltung</h1>
-		<p class="page-intro">Konten, Rollen und bestehende Taxonomie verwalten.</p>
+		<p class="page-intro">Konten, Werkzeuge und bestehende Taxonomie verwalten.</p>
 	</header>
 	{#if form?.error}<div class="form-message error" role="alert">{form.error}</div>{/if}
 	{#if form?.success}<div class="form-message success" role="status">{form.success}</div>{/if}
@@ -113,6 +113,89 @@
 		</section>
 	</div>
 
+	<h2 class="section-heading">Werkzeuge</h2>
+	<section class="quiet-panel tool-management">
+		<div class="panel-heading">
+			<div>
+				<p class="eyebrow">Redaktionelle Hilfsmittel</p>
+				<h2>Werkzeugkatalog</h2>
+			</div>
+			<small>Deaktivierte Werkzeuge bleiben in bestehenden Pieces und Sendungen erhalten.</small>
+		</div>
+		<div class="tool-settings-list">
+			{#each data.tools as tool (tool.id)}
+				<details class:inactive={!tool.isActive}>
+					<summary
+						><strong>{tool.name}</strong><span>{tool.isActive ? 'Aktiv' : 'Deaktiviert'}</span
+						></summary
+					>
+					<form class="compact-form tool-form" method="POST" action="?/updateTool">
+						<input type="hidden" name="toolId" value={tool.id} />
+						<label>Name<input name="name" required maxlength="120" value={tool.name} /></label>
+						<label
+							>Start-URL<input
+								name="startUrl"
+								type="url"
+								maxlength="2000"
+								value={tool.startUrl}
+								placeholder="https://…"
+							/></label
+						>
+						<label class="wide-field"
+							>Beschreibung<textarea name="description" rows="2" maxlength="2000"
+								>{tool.description}</textarea
+							></label
+						>
+						<fieldset class="wide-field">
+							<legend>Passende Formate</legend>
+							<div class="choice-grid">
+								{#each data.taxonomy.formats as format (format.id)}<label
+										><input
+											type="checkbox"
+											name="formatIds"
+											value={format.id}
+											checked={tool.formatIds.includes(format.id)}
+										/>{format.name}</label
+									>{/each}
+							</div>
+						</fieldset>
+						<label class="tool-active"
+							><input type="checkbox" name="isActive" value="1" checked={tool.isActive} /> Aktiv</label
+						>
+						<button class="secondary-button" type="submit">Speichern</button>
+					</form>
+				</details>
+			{/each}
+		</div>
+		<details class="new-tool">
+			<summary>Werkzeug hinzufügen</summary>
+			<form class="compact-form tool-form" method="POST" action="?/createTool">
+				<label>Name<input name="name" required maxlength="120" /></label>
+				<label
+					>Start-URL<input
+						name="startUrl"
+						type="url"
+						maxlength="2000"
+						placeholder="https://…"
+					/></label
+				>
+				<label class="wide-field"
+					>Beschreibung<textarea name="description" rows="2" maxlength="2000"></textarea></label
+				>
+				<fieldset class="wide-field">
+					<legend>Passende Formate</legend>
+					<div class="choice-grid">
+						{#each data.taxonomy.formats as format (format.id)}<label
+								><input type="checkbox" name="formatIds" value={format.id} />{format.name}</label
+							>{/each}
+					</div>
+				</fieldset>
+				<input type="hidden" name="isActive" value="1" />
+				<button class="primary-button" type="submit">Werkzeug anlegen</button>
+			</form>
+		</details>
+	</section>
+
 	<h2 class="section-heading">Taxonomie</h2>
 	<div class="settings-grid">
 		<section class="quiet-panel taxonomy-panel">