feat: add demo page

2026-08-25 18:44:03 +05:00
parent 148e4b1957
commit 6e0647dfbf
8 changed files with 504 additions and 234 deletions
@@ -0,0 +1,40 @@
+<script lang="ts">
+	import ToolPage from '$lib/components/ToolPage.svelte';
+	import { getTool } from '$lib/registry';
+
+	const base = getTool('linear-gradient-png')!;
+</script>
+
+<svelte:head>
+	<title>Mockup: цепочка инструментов — easy-png-tools</title>
+	<meta name="robots" content="noindex, nofollow" />
+</svelte:head>
+
+<section class="demo">
+	<ToolPage
+		tool={base}
+		stageVariant="inline"
+		presetBaseValues={{
+			width: 520,
+			height: 340,
+			fromColor: '#e5484d',
+			toColor: '#fbbf24',
+			direction: 'horizontal'
+		}}
+		presetChain={[
+			{
+				toolId: 'remove-background-png',
+				values: { color: '#fbbf24', tolerance: 10, outerOnly: true, smooth: 2 }
+			},
+			{ toolId: 'add-stroke-png', values: { color: '#2563eb', thickness: 8 } },
+			{ toolId: 'round-corners-png', values: { radius: 28 } }
+		]}
+	/>
+</section>
+
+<style>
+	.demo {
+		max-width: 100rem;
+		margin: 0 auto;
+	}
+</style>