diff --git a/src/routes/toggle/+page.svelte b/src/routes/toggle/+page.svelte index 76fe0b5..cdeecbf 100644 --- a/src/routes/toggle/+page.svelte +++ b/src/routes/toggle/+page.svelte @@ -14,9 +14,10 @@ descriptionSlots, contentLeftSlots, contentRightSlots, - usage + usage, + classList } from './examples'; - import { PropsTable, SlotsTable, CodeBlock, ExampleContainer } from '../../docs'; + import { PropsTable, SlotsTable, ClassTable, CodeBlock, ExampleContainer } from '../../docs'; import { brightness_4, brightness_5 } from '../../docs/icons'; let on = false; @@ -120,3 +121,5 @@ + + diff --git a/src/routes/toggle/examples.ts b/src/routes/toggle/examples.ts index f912dfc..9b4fadd 100644 --- a/src/routes/toggle/examples.ts +++ b/src/routes/toggle/examples.ts @@ -1,4 +1,4 @@ -import type { Slot, Prop } from '../../docs'; +import type { Slot, Prop, IClass } from '../../docs'; export const props: Prop[] = [ { @@ -137,6 +137,49 @@ export const descriptionSlots: Slot[] = [ } ]; +export const classList: IClass[] = [ + { + id: '1', + class: 'stwui-toggle-wrapper' + }, + { + id: '2', + class: 'stwui-toggle' + }, + { + id: '3', + class: 'stwui-toggle-dongle' + }, + { + id: '4', + class: 'stwui-toggle-left-icon-wrapper' + }, + { + id: '5', + class: 'stwui-toggle-right-icon-wrapper' + }, + { + id: '6', + class: 'stwui-toggle-error' + }, + { + id: '7', + class: 'stwui-toggle-label' + }, + { + id: '8', + class: 'stwui-toggle-content-left' + }, + { + id: '9', + class: 'stwui-toggle-content-right' + }, + { + id: '10', + class: 'stwui-toggle-description' + } +]; + export const usage = ` import { Toggle } from 'stwui'; // OR