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

docs(skeleton-text): improve docs

Browse source
This commit is contained in:
Eric Liu 2025-05-03 10:45:33 -07:00
commit e8ce5d5ebd
1 changed files with 12 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

12
docs/src/pages/components/SkeletonText.svx
View file

@ -3,22 +3,34 @@
import Preview from "../../components/Preview.svelte"; import Preview from "../../components/Preview.svelte";
</script> </script>
`SkeletonText` provides a loading state for text content with support for different sizes and line counts. It's commonly used to indicate that text content is being loaded.
## Default ## Default
Create a basic skeleton text with default styling.
<SkeletonText /> <SkeletonText />
## Heading variant ## Heading variant
Use the heading variant for larger text placeholders.
<SkeletonText heading /> <SkeletonText heading />
## Paragraph variant ## Paragraph variant
Use the paragraph variant for multi-line text placeholders.
<SkeletonText paragraph /> <SkeletonText paragraph />
## Paragraph with custom line count ## Paragraph with custom line count
Specify the number of lines to render using the `lines` prop.
<SkeletonText paragraph lines={8} /> <SkeletonText paragraph lines={8} />
## Paragraph with max width ## Paragraph with max width
Set a custom width for the text placeholder using the `width` prop.
<SkeletonText paragraph width="50%" /> <SkeletonText paragraph width="50%" />