diff --git a/frontend/src/App.svelte b/frontend/src/App.svelte index 87fbf9c..0d10c6a 100644 --- a/frontend/src/App.svelte +++ b/frontend/src/App.svelte @@ -11,7 +11,6 @@ import MaskPanel from './capture/MaskPanel.svelte'; import MeasurePanel from './capture/MeasurePanel.svelte'; import Settings from './create/settings/Settings.svelte'; - import SlabList from './create/slabs/SlabList.svelte'; import Review from './create/review/Review.svelte'; import Publish from './create/publish/Publish.svelte'; import { @@ -27,7 +26,6 @@ let busy = false; let pngUrl: string | null = null; let showSettings = false; - let showSlabs = false; let curFlow: import('./create/flow').Flow = { phase: 'capture' }; $: curFlow = $flow; @@ -238,16 +236,14 @@ {/if} {/if} - -
- - -
- {#if showSettings} - + + {#if curFlow.phase !== 'done'} +
+ +
{/if} - {#if showSlabs} - + {#if showSettings && curFlow.phase !== 'done'} + {/if} {/if} @@ -258,17 +254,24 @@ background: #121212; font-family: system-ui, -apple-system, Segoe UI, sans-serif; } - .app, .hardstop { max-width: 720px; margin: 0 auto; min-height: 100vh; } + .app, .hardstop { max-width: 720px; margin: 0 auto; min-height: 100vh; box-sizing: border-box; } + .app { padding: 12px 16px 24px; } .hardstop { padding: 48px 24px; color: #eee; text-align: center; } .hardstop h1 { font-size: 1.6rem; } .detail { color: #888; font-size: 0.85rem; } - .panel { padding: 16px; color: #eee; } + .panel { padding: 4px 0 16px; color: #eee; } .done .ok { color: #7fd37f; font-weight: 600; } .row { display: flex; gap: 10px; margin-top: 16px; } .primary { - flex: 1; padding: 14px; font-size: 1.05rem; border-radius: 10px; border: 0; + flex: 1; padding: 14px; font-size: 1rem; border-radius: 3px; border: 0; background: #00e5ff; color: #002; font-weight: 700; } .busy { color: #aaa; } .save-err { margin-top: 12px; color: #ffb4a2; font-weight: 600; } + .app-tools { margin-top: 1rem; display: flex; gap: 8px; } + .tool { + box-sizing: border-box; padding: 8px 12px; border-radius: 3px; border: 1px solid #444; + background: #1d1d1d; color: #ccc; font-size: .82rem; font-weight: 600; cursor: pointer; + } + .tool:hover { background: #242424; } diff --git a/frontend/src/create/publish/Publish.svelte b/frontend/src/create/publish/Publish.svelte index e0ebde7..2c7d225 100644 --- a/frontend/src/create/publish/Publish.svelte +++ b/frontend/src/create/publish/Publish.svelte @@ -77,11 +77,15 @@

Publish to WooCommerce

SKU {slab?.sku || '—'} · {slab?.bdft != null ? slab.bdft.toFixed(1) : '—'} bdft · {slab?.price != null ? `$${slab.price.toFixed(2)}` : '—'}

- {#if st.phase === 'idle' || st.phase === 'working'} - + + {:else if st.phase === 'working'} + - {/if} {#if st.phase === 'success'} @@ -119,7 +123,7 @@ {/if}