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

feat(palimpsest): add ComponentLayout

Browse source
This commit is contained in:
Eric Liu 2020-01-09 09:49:35 -08:00
commit 82039d8843
1 changed files with 49 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

49
palimpsest/src/components/ComponentLayout.svelte Normal file
View file

@ -0,0 +1,49 @@
<script>
export let params = {};
import { Tabs, Tab } from 'carbon-components-svelte';
import CodeSnippet from './carbon-components/CodeSnippet.svelte';
const registry = {
CodeSnippet
};
let selected = 0;
</script>
<style>
main {
margin-top: 2.5rem;
padding-top: 3rem;
}
header {
border-bottom: 1px solid var(--cds-ui-03);
}
h1 {
margin-bottom: 1.5rem;
}
.bx--grid {
padding-left: 16rem;
}
</style>
<main>
<div class="bx--grid">
<header class="bx--row">
<div class="bx--col">
<h1>{params.name}</h1>
</div>
<Tabs type="container" bind:selected>
<Tab label="Overview" />
<Tab label="API" />
<Tab label="Kitchen Sink" />
</Tabs>
</header>
</div>
<section class="bx--grid">
<svelte:component this={registry[params.name]} {selected} />
</section>
</main>