mcp/carbon-components-svelte
1
0
Fork 0
mirror of https://github.com/carbon-design-system/carbon-components-svelte.git synced 2025-09-20 20:33:02 +00:00
Code Issues Projects Releases Packages Wiki Activity

Merge 992ee13626 into ea7c0d446e

Browse source
This commit is contained in:
lalilaloe 2022-03-26 18:44:33 +00:00 • committed by GitHub
commit f4282037a6
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
1 changed files with 9 additions and 6 deletions
Download patch file Download diff file Expand all files Collapse all files

11
src/StructuredList/StructuredListSkeleton.svelte
View file

@ -2,6 +2,9 @@
/** Specify the number of rows */ /** Specify the number of rows */
export let rows = 5; export let rows = 5;
/** Specify the number of cols */
export let cols = 3;
/** Set to `true` to use the bordered variant */ /** Set to `true` to use the bordered variant */
export let border = false; export let border = false;
</script> </script>
@ -22,17 +25,17 @@
class:bx--structured-list-row="{true}" class:bx--structured-list-row="{true}"
class:bx--structured-list-row--header-row="{true}" class:bx--structured-list-row--header-row="{true}"
> >
{#each Array.from({ length: cols }, (_, i) => i) as row, i (row)}
<div class:bx--structured-list-th="{true}"><span></span></div> <div class:bx--structured-list-th="{true}"><span></span></div>
<div class:bx--structured-list-th="{true}"><span></span></div> {/each}
<div class:bx--structured-list-th="{true}"><span></span></div>
</div> </div>
</div> </div>
<div class:bx--structured-list-tbody="{true}"> <div class:bx--structured-list-tbody="{true}">
{#each Array.from({ length: rows }, (_, i) => i) as row, i (row)} {#each Array.from({ length: rows }, (_, i) => i) as row, i (row)}
<div class:bx--structured-list-row="{true}"> <div class:bx--structured-list-row="{true}">
{#each Array.from({ length: cols }, (_, i) => i) as row, i (row)}
<div class:bx--structured-list-td="{true}"></div> <div class:bx--structured-list-td="{true}"></div>
<div class:bx--structured-list-td="{true}"></div> {/each}
<div class:bx--structured-list-td="{true}"></div>
</div> </div>
{/each} {/each}
</div> </div>