feat(ui): assemble the duplicate chess sandbox app
Wire Compass, Panel, and PromotionDialog into App.svelte; apply dark-theme base styles in app.css. Build passes, 26 tests pass, smoke render confirmed. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
+23
-2
@@ -1,4 +1,25 @@
|
||||
<main>
|
||||
<script lang="ts">
|
||||
import Compass from './lib/Compass.svelte';
|
||||
import Panel from './lib/Panel.svelte';
|
||||
import PromotionDialog from './lib/PromotionDialog.svelte';
|
||||
</script>
|
||||
|
||||
<header>
|
||||
<h1>Duplicate Chess</h1>
|
||||
<p>Sandbox under construction.</p>
|
||||
<p>Local sandbox — operator drives all four players. Click a piece on the
|
||||
glowing boards to see its synchronized-legal moves.</p>
|
||||
</header>
|
||||
|
||||
<main>
|
||||
<Compass />
|
||||
<Panel />
|
||||
</main>
|
||||
|
||||
<PromotionDialog />
|
||||
|
||||
<style>
|
||||
header { padding: 14px 22px; border-bottom: 1px solid #333845; }
|
||||
header h1 { margin: 0; font-size: 17px; }
|
||||
header p { margin: 4px 0 0; font-size: 12px; color: #9aa0aa; }
|
||||
main { display: flex; gap: 22px; padding: 20px 22px; align-items: flex-start; }
|
||||
</style>
|
||||
|
||||
@@ -0,0 +1,8 @@
|
||||
:root { color-scheme: dark; }
|
||||
* { box-sizing: border-box; }
|
||||
body {
|
||||
margin: 0;
|
||||
background: #15171c;
|
||||
color: #e6e8ec;
|
||||
font-family: -apple-system, "Segoe UI", Roboto, sans-serif;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user