https://github.com/krishna-suwal/simple-svelte-skeleton
https://github.com/krishna-suwal/simple-svelte-skeleton
Last synced: 2 months ago
JSON representation
- Host: GitHub
- URL: https://github.com/krishna-suwal/simple-svelte-skeleton
- Owner: krishna-suwal
- License: mit
- Created: 2021-07-30T13:47:20.000Z (almost 4 years ago)
- Default Branch: master
- Last Pushed: 2021-08-06T03:25:42.000Z (almost 4 years ago)
- Last Synced: 2025-02-08T21:31:30.877Z (4 months ago)
- Language: JavaScript
- Homepage: https://www.npmjs.com/package/simple-svelte-skeleton
- Size: 53.7 KB
- Stars: 3
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Simple Svelte Skeleton
Simple components for skeleton to use in svelte 😎
## Usage Example
Demo
Import skeleton comonents
```javascript
import { Box, Column, Row } from "simple-svelte-skeleton";
```
Use the components
```html
```
## Install
Using `npm`:
````sh
npm install simple-svelte-skeleton
````
Using `yarn`:`
````sh
yarn add simple-svelte-skeleton
````
## API
For all the components `Column`, `Row` and `Box`, you can pass any CSS properties as props.
### ``
Stack components vertically and add spaces in-between. Currently it adds `8px` margin.
Props:
- All CSS properties
- *`stretch`* (boolean): Stretches the component so that it takes all the remaining space by adding inline CSS `flex-grow: 1`.
### ``
Stack components horizontally and add spaces in-between. Currently it adds `8px` margin.
Props:
- All CSS properties
- *`stretch`* (boolean): Stretches the component so that it takes all the remaining space by adding inline CSS `flex-grow: 1`.
### ``
A box made with `div` element.
Props:
- All CSS properties
- *`stretch`* (boolean): Stretches the component so that it takes all the remaining space by adding inline CSS `flex-grow: 1`.
- *`round`* (boolean): Makes the component circular by adding inline CSS `border-radius: 100%`.