Reza_ashrafi
/
react-carousel
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Update documentation.

Browse Source
master
Hasan Genc 3 years ago
parent fd14b910aa
commit 7ad86fa304
15 changed files with 36 additions and 70 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 5
      .github/workflows/documentation.yml
  2. 11
      website/blog/2019-05-28-hola.md
  3. 17
      website/blog/2019-05-29-hello-world.md
  4. 13
      website/blog/2019-05-30-welcome.md
  5. 0
      website/blog/temp.md
  6. 34
      website/docs/carousel.md
  7. 2
      website/docs/infinityCarousel.md
  8. 2
      website/docs/installation.md
  9. 2
      website/docs/scrollingCarousel.md
  10. 2
      website/docs/scrollingCarouselApi.md
  11. 2
      website/docs/swipableCarousel.md
  12. 2
      website/docs/usage.md
  13. 4
      website/sidebars.js
  14. 8
      website/src/css/custom.css
  15. 2
      website/src/pages/index.js

5
.github/workflows/documentation.yml
Unescape View File

@ -28,10 +28,13 @@ jobs:
- uses: actions/setup-node@v1
with:
node-version: '12.x'
- uses: webfactory/ssh-agent@v0.5.0
with:
ssh-private-key: ${{ secrets.GH_PAGES_DEPLOY }}
- name: Release to GitHub Pages
working-directory: ./website
env:
USE_SSH: false
USE_SSH: true
GIT_USER: ${{ secrets.GIT_USER }}
run: |
git config --global user.email "${{ secrets.GIT_MAIL }}"

11
website/blog/2019-05-28-hola.md
Unescape View File

@ -1,11 +0,0 @@
---
id: hola
title: Hola
author: Gao Wei
author_title: Docusaurus Core Team
author_url: https://github.com/wgao19
author_image_url: https://avatars1.githubusercontent.com/u/2055384?v=4
tags: [hola, docusaurus]
---
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque elementum dignissim ultricies. Fusce rhoncus ipsum tempor eros aliquam consequat. Lorem ipsum dolor sit amet

17
website/blog/2019-05-29-hello-world.md
Unescape View File

@ -1,17 +0,0 @@
---
id: hello-world
title: Hello
author: Endilie Yacop Sucipto
author_title: Maintainer of Docusaurus
author_url: https://github.com/endiliey
author_image_url: https://avatars1.githubusercontent.com/u/17883920?s=460&v=4
tags: [hello, docusaurus]
---
Welcome to this blog. This blog is created with [**Docusaurus 2 alpha**](https://v2.docusaurus.io/).
<!--truncate-->
This is a test post.
A whole bunch of other information.

13
website/blog/2019-05-30-welcome.md
Unescape View File

@ -1,13 +0,0 @@
---
id: welcome
title: Welcome
author: Yangshun Tay
author_title: Front End Engineer @ Facebook
author_url: https://github.com/yangshun
author_image_url: https://avatars0.githubusercontent.com/u/1315101?s=400&v=4
tags: [facebook, hello, docusaurus]
---
Blog features are powered by the blog plugin. Simply add files to the `blog` directory. It supports tags as well!
Delete the whole directory if you don't want the blog features. As simple as that!

0
website/blog/temp.md
Unescape View File

34
website/docs/carousel.md
Unescape View File

@ -1,5 +1,5 @@
---
id: carousel
slug: carousel
title: Carousel
---
@ -11,19 +11,19 @@ Creates carousel component.
### Props
| Name | type | required | default | descripiton |
| ------------ | :-----: | -------: | ------: | ----------------------------------------------------------------------------------------------: |
| children | Node[] | true | [] | Child items that will be wrapped by carousel |
| show | number | false | 1 | number of items to show at per slide |
| slide | number | false | 1 | number of how many items to slide |
| infinite | boolean | false | true | scrolling infinity |
| transition | number | false | 0.5 | same as css transition property's second value |
| swiping | boolean | false | false | enable swiping/dragging with mouse/touch events |
| swipeOn | number | false | 1 | percantage of item width that slides when user drag count exceeds |
| responsive | boolean | false | false | enables the feature that adjusts items width according to screen size dynamically |
| className | string | false | "" | same as react's className property |
| useArrowKeys | boolean | false | false | enables sliding when press arrow keys |
| a11y | Array | false | {} | accessibility attributes |
| dynamic | Boolean | false | false | if items are stateful, specify this option as true. Also give unique key to each item (like id) |
| rightArrow | ReactElement | false | null | custom right arrow component |
| leftArrow | ReactElement | false | null | custom left arrow component |
| Name | type | required | default | descripiton |
| ------------ | :----------: | -------: | ------: | ----------------------------------------------------------------------------------------------: |
| children | Node[] | true | [] | Child items that will be wrapped by carousel |
| show | number | false | 1 | number of items to show at per slide |
| slide | number | false | 1 | number of how many items to slide |
| infinite | boolean | false | true | scrolling infinity |
| transition | number | false | 0.5 | same as css transition property's second value |
| swiping | boolean | false | false | enable swiping/dragging with mouse/touch events |
| swipeOn | number | false | 1 | percantage of item width that slides when user drag count exceeds |
| responsive | boolean | false | false | enables the feature that adjusts items width according to screen size dynamically |
| className | string | false | "" | same as react's className property |
| useArrowKeys | boolean | false | false | enables sliding when press arrow keys |
| a11y | Array | false | {} | accessibility attributes |
| dynamic | Boolean | false | false | if items are stateful, specify this option as true. Also give unique key to each item (like id) |
| rightArrow | ReactElement | false | null | custom right arrow component |
| leftArrow | ReactElement | false | null | custom left arrow component |

2
website/docs/infinityCarousel.md
Unescape View File

@ -1,5 +1,5 @@
---
id: infinity
slug: infinity
title: Infinite Carousel
---

2
website/docs/installation.md
Unescape View File

@ -1,5 +1,5 @@
---
id: installation
slug: installation
title: Installation Guide
sidebar_label: Installation Guide
---

2
website/docs/scrollingCarousel.md
Unescape View File

@ -1,5 +1,5 @@
---
id: scrolling-carousel
slug: scrolling-carousel
title: Scrolling carousel
---

2
website/docs/scrollingCarouselApi.md
Unescape View File

@ -1,5 +1,5 @@
---
id: scrolling-carousel-api
slug: scrolling-carousel-api
title: Scrolling Carousel
---

2
website/docs/swipableCarousel.md
Unescape View File

@ -1,5 +1,5 @@
---
id: swipible
slug: swipible
title: Swipeable Carousel
---

2
website/docs/usage.md
Unescape View File

@ -1,5 +1,5 @@
---
id: usage
slug: usage
title: Usage
---

4
website/sidebars.js
Unescape View File

@ -1,7 +1,7 @@
module.exports = {
someSidebar: {
Docusaurus: ['installation', 'usage'],
API: ['carousel', 'scrolling-carousel-api'],
Examples: ['infinity', 'swipible', 'scrolling-carousel'],
API: ['carousel', 'scrollingCarouselApi'],
Examples: ['infinityCarousel', 'swipableCarousel', 'scrollingCarousel'],
},
};

8
website/src/css/custom.css
Unescape View File

@ -24,7 +24,7 @@
padding: 0 var(--ifm-pre-padding);
}
.exampleCarousel1 button:first-child {
.exampleCarousel1 div > button[data-direction='left'] {
background: url('https://cdn.dsmcdn.com/web/production/slick-arrow.svg') no-repeat
center;
transform: rotateZ(180deg);
@ -33,9 +33,11 @@
cursor: pointer;
position: relative;
left: -16px;
height: 80px;
top: 80px;
}
.exampleCarousel1 button:last-child {
.exampleCarousel1 div > button[data-direction='right'] {
background: url('https://cdn.dsmcdn.com/web/production/slick-arrow.svg') no-repeat
center;
outline: none;
@ -43,6 +45,8 @@
cursor: pointer;
position: relative;
right: -16px;
height: 80px;
top: 80px;
}
.exampleCarousel1 div:first-child {

2
website/src/pages/index.js
Unescape View File

@ -138,7 +138,7 @@ function Feature({ imageUrl, title, description }) {
}
function Home() {
//return <Redirect to="/react-carousel/docs/installation" />;
return <Redirect to="/react-carousel/docs/installation" />;
const [features, setFeatures] = useState([
{
id: 1,

Write Preview
Loading…
Cancel
Save