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

docs: add npm install command

Browse source
This commit is contained in:
Eric Liu 2020-10-15 17:33:53 -07:00
commit e94227082b
1 changed files with 29 additions and 6 deletions
Download patch file Download diff file Expand all files Collapse all files

35
docs/src/pages/index.svelte
View file

@ -6,6 +6,9 @@
Column, Column,
CodeSnippet, CodeSnippet,
Link, Link,
Tabs,
Tab,
TabContent,
} from "carbon-components-svelte"; } from "carbon-components-svelte";
import TileCard from "../components/TileCard.svelte"; import TileCard from "../components/TileCard.svelte";
import { metatags } from "@sveltech/routify"; import { metatags } from "@sveltech/routify";
@ -16,6 +19,7 @@
"The Svelte implementation of the Carbon Design System featuring UI components, icons, pictograms, and charts."; "The Svelte implementation of the Carbon Design System featuring UI components, icons, pictograms, and charts.";
const installYarn = "yarn add -D carbon-components-svelte"; const installYarn = "yarn add -D carbon-components-svelte";
const installNpm = "npm i -D carbon-components-svelte";
</script> </script>
<Content> <Content>
@ -51,12 +55,31 @@
</Row> </Row>
<Row noGutter style="margin-bottom: var(--cds-layout-02)"> <Row noGutter style="margin-bottom: var(--cds-layout-02)">
<Column> <Column>
<CodeSnippet <Tabs>
code="{installYarn}" <Tab label="Yarn" />
on:click="{() => { <Tab label="npm" />
copy(installYarn); <div
}}" slot="content"
/> style="margin-left: calc(-1 * var(--cds-spacing-05)); margin-right: calc(-1 * var(--cds-spacing-05));"
>
<TabContent>
<CodeSnippet
code="{installYarn}"
on:click="{() => {
copy(installYarn);
}}"
/>
</TabContent>
<TabContent>
<CodeSnippet
code="{installNpm}"
on:click="{() => {
copy(installNpm);
}}"
/>
</TabContent>
</div>
</Tabs>
</Column> </Column>
</Row> </Row>
<Row> <Row>