<script>
import Grid from './Grid.svelte';
</script>
<main>
<h1>Line drawing grid</h1>
<h2>Default</h2>
<Grid />
<hr />
<h2>Custom (10 columns and rows)</h2>
<Grid columns={10} rows={10} />
</main>
<style>
:global(*) {
box-sizing: border-box;
margin: 0;
padding: 0;
}
:global(body) {
min-height: 100vh;
font-family: 'Major Mono Display', monospace;
background: #ffe0fc;
color: #2d194a;
}
main {
max-width: 600px;
margin: 0 auto;
padding: 1.25rem 2rem 3rem;
}
:global(main > * + *) {
margin-top: 1.5rem;