Skip to content

Commit

Permalink
fix type of ElementTile.svelte precision prop
Browse files Browse the repository at this point in the history
  • Loading branch information
janosh committed Apr 3, 2023
1 parent 3863a6c commit 5ad957c
Show file tree
Hide file tree
Showing 2 changed files with 23 additions and 1 deletion.
2 changes: 1 addition & 1 deletion src/lib/ElementTile.svelte
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,7 @@
// at what background color lightness text color switches from black to white
export let text_color_threshold = 0.7
export let text_color: string | null = null
export let precision: number = 2
export let precision: string | null = null
type $$Events = PeriodicTableEvents // for type-safe event listening on this component
Expand Down
22 changes: 22 additions & 0 deletions src/routes/(demos)/element-tile/+page.svx
Original file line number Diff line number Diff line change
Expand Up @@ -21,3 +21,25 @@
}
</style>
```

Displaying values instead of element names by passing the `value` prop.

```svelte example stackblitz code_above
<script>
import { ElementTile, element_data } from '$lib'
</script>

<ol>
{#each ['red', 'green', 'blue', 'yellow', 'cyan', 'magenta', 'black', 'white'] as bg_color, idx}
<ElementTile {bg_color} element={element_data[idx]} value={Math.random()} style="width: 4em; margin: 0;" active />
{/each}
</ol>

<style>
ol {
display: flex;
flex-wrap: wrap;
gap: 1em;
}
</style>
```

0 comments on commit 5ad957c

Please sign in to comment.