Skip to content

whizzes/svelte-placeholder

Repository files navigation

Example

Svelte Content Placeholder

Replicate components with shadow versions while content is not yet available

Build Lint Test Version Downloads

Getting Started

To use the Svelte Placeholder library in your Svelte application, you can install it using npm:

npm install @whizzes/svelte-placeholder

Usage

<script>
	import Placeholder from 'svelte-content-placeholder';
</script>

<Placeholder>
	<circle cx="50" cy="30" r="30" />
	<rect x="10" y="70" rx="3" ry="3" width="40" height="10" />
	<rect x="60" y="70" rx="3" ry="3" width="70" height="10" />
	<rect x="140" y="70" rx="3" ry="3" width="20" height="10" />
	<rect x="10" y="90" rx="3" ry="3" width="90" height="10" />
	<rect x="110" y="90" rx="3" ry="3" width="70" height="10" />
	<rect x="10" y="110" rx="3" ry="3" width="70" height="10" />
	<rect x="90" y="110" rx="3" ry="3" width="60" height="10" />
</Placeholder>

Development

git clone git@github.com:whizzes/svelte-notifications.git
cd ./svelte-notifications
npm i
npm run dev

Contributing

Feel free to open pull requests or issues on our GitHub Repository.