RanchiMall/standard-ui
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update README.md

Browse Source
This commit is contained in:
sairaj mote 2020-08-02 01:46:06 +05:30 committed by GitHub
parent d902a8d7d1
commit ee90724ccf
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 18 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
Standard UI Components/README.md
View File

@ -38,8 +38,6 @@ Every component responds to some css variable that needs to be set in order to s
***!!! It's important to set only comma separated rgb values with `--text-color` and `--foreground-color` css variables.*** ***!!! It's important to set only comma separated rgb values with `--text-color` and `--foreground-color` css variables.***
Now you are ready to use them in your HTML markup as any other standard HMTL tags 😄. Now you are ready to use them in your HTML markup as any other standard HMTL tags 😄.
## Components
| Table of components | | Table of components |
| --- | | --- |
@ -121,6 +119,24 @@ This component supports keyboard interactivity like ***Enter*** or ***Spacebar**
`<sm-carousel` allows you easily add carousel to your website with everything already ready to go. Just add elements you want show inside opening `<sn-carousel>` and closing `<sn-carousel>` brackets. `<sm-carousel` allows you easily add carousel to your website with everything already ready to go. Just add elements you want show inside opening `<sn-carousel>` and closing `<sn-carousel>` brackets.
#### Custom Attribute
1. align-items
This attribute sets alignment of items inside carousel to value from three options ***start***, ***center***, ***end***.
`align-items="center"` is default value. Carousel childrens are set to center align.
##### align start
This will align elements such that element will align from left edge to the carousel container
```html
<!--To set alignment of elements to start -->
<sm-carousel align-items="start"></sm-carousel>
```
This will align elements such that element will align from left edge to the carousel container
```html
<!--To set alignment of elements to end -->
<sm-carousel align-items="end"></sm-carousel>
```
#### Interactions #### Interactions
Once focused elements inside carousel can be scrolled using ***Arrow Keys***. Once focused elements inside carousel can be scrolled using ***Arrow Keys***.