Gate B: SvelteKit capture→mask→numbers→review UI with deterministic pipeline
- Scaffold SvelteKit app (svelte.config.js, vite.config.ts, app.html, app.d.ts) - Build full capture flow: photo input → mask overlay + 4 knobs → axis overlay + rotation → length/thickness/SKU inputs → review + upload to /api/v1/slabs - Uses existing lib/pipeline/* pure modules (mask, axis, units, crop, pricing, types) - Uses existing validation/sku.ts for SKU validation - Svelte 5 runes ($state, $effect, $derived) for reactive state - Canvas-based rendering for mask overlay, axis visualization, and 3:4 crop preview - Dockerfile updated for Vite production build with static Node server on :80 - All 54 existing tests pass, build succeeds
This commit is contained in:
@@ -0,0 +1,33 @@
|
||||
<script lang="ts">
|
||||
import type { LayoutData } from './$types.js';
|
||||
export let data: LayoutData;
|
||||
</script>
|
||||
|
||||
<h1 class="app-header">SlabUploader</h1>
|
||||
|
||||
<slot />
|
||||
|
||||
<style>
|
||||
:global(*) {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
:global(body) {
|
||||
margin: 0;
|
||||
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
|
||||
background: #f5f5f5;
|
||||
color: #1a1a1a;
|
||||
}
|
||||
:global(.app-wrapper) {
|
||||
max-width: 960px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
.app-header {
|
||||
text-align: center;
|
||||
padding: 1rem;
|
||||
background: #1a1a1a;
|
||||
color: white;
|
||||
margin: 0;
|
||||
font-size: 1.5rem;
|
||||
letter-spacing: 0.05em;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,6 @@
|
||||
export const ssr = false;
|
||||
export const prerender = true;
|
||||
|
||||
export function load() {
|
||||
return {};
|
||||
}
|
||||
File diff suppressed because it is too large
Load Diff
Reference in New Issue
Block a user