grokbot_ty
8d8b3a2ff1
- 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
34 lines
598 B
Svelte
34 lines
598 B
Svelte
<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>
|