Skip to content
This repository has been archived by the owner on Apr 26, 2024. It is now read-only.

Commit

Permalink
added read me to npm build
Browse files Browse the repository at this point in the history
  • Loading branch information
fisshy committed Mar 3, 2015
1 parent e20b2dc commit 4c02259
Show file tree
Hide file tree
Showing 2 changed files with 103 additions and 1 deletion.
96 changes: 96 additions & 0 deletions build/npm/README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,96 @@
## React Scroll

Directive for basic scrolling and smooth scrolling ( work in progress )
Feel free to contribute - everything is appreciated

### Install
```js
$ I've not uploaded it to npm yet, I want to finish it first.
```
### Run
```js
$ npm install
$ npm run examples
```
### Examples
Checkout examples
> [basic](https://github.com/fisshy/react-scroll/blob/master/examples/basic/app.js)
### Usage
```js
var React = require('react');
var Scroll = require('react-scroll');
var Link = Scroll.Link;
var Element = Scroll.Element;
var Section = React.createClass({
render: function () {
return (
<Link to="test1" smooth={true}>Test 1</Link>
<Link to="test2" smooth={true}>Test 2</Link>
<Element name="test1" className="element">
test 1
</Element>
<Element name="test2" className="element">
test 2
</Element>
);
}
});
React.render(
<Section />,
document.getElementById('example')
);
```
#### Create your own Link/Element
> Simply just include the mixins!
```js
var React = require('react');
var Scroll = require('react-scroll');
var Helpers = Scroll.Helpers;
var Element = React.createClass({
mixins: [Helpers.Element],
render: function () {
return (
<div>
{this.props.children}
</div>
);
}
});
var Link = React.createClass({
mixins: [Helpers.Scroll],
render: function () {
return (
<a onClick={this.onClick} href="test">
{this.props.children}
</a>
);
}
});
```
### Todo
- [x] Vertical scrolling
- [x] Scroll to element
- [x] Smooth scroll animation
- [ ] Live examples
- [ ] Pass scroll/animation duration as settings
- [ ] Horizontal scrolling
- [ ] Spy on scrolling/Highlight
- [ ] Write test
8 changes: 7 additions & 1 deletion gulpfile.js
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,13 @@ var gulp = require('gulp');
var SOURCE = './modules/**/*.js';
var DEST = './build/npm/lib'

var SOURCE_README = '*.md';
var DEST_README = './build/npm';

gulp.task('default', function() {
gulp.src(SOURCE)
.pipe(gulp.dest(DEST));
.pipe(gulp.dest(DEST));

gulp.src(SOURCE_README)
.pipe(gulp.dest(DEST_README));
});

0 comments on commit 4c02259

Please sign in to comment.