1 | # Plumes
|
2 |
|
3 | [![Join the chat at https://gitter.im/CodeCorico/plumes](https://badges.gitter.im/Join%20Chat.svg)](https://gitter.im/CodeCorico/plumes?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge&utm_content=badge)
|
4 | [![Issue Stats](http://issuestats.com/github/codecorico/plumes/badge/issue)](http://issuestats.com/github/codecorico/plumes)
|
5 | [![Issue Stats](http://issuestats.com/github/codecorico/plumes/badge/pr)](http://issuestats.com/github/codecorico/plumes)
|
6 |
|
7 | Flying-fast Metro future vision components
|
8 |
|
9 | [![Microsoft: Productivity Future Vision](http://img.youtube.com/vi/w-tFdreZB94/0.jpg)](http://www.youtube.com/watch?v=w-tFdreZB94)
|
10 |
|
11 | ## Installation
|
12 |
|
13 | Include the module in your project with :
|
14 | ```
|
15 | npm install --save plumes
|
16 | ```
|
17 |
|
18 | ## How to use it
|
19 |
|
20 | ### Compile template files
|
21 |
|
22 | You can compile and move your Less, JavaScript and HTML files to your ```/public``` folder with Plumes.
|
23 |
|
24 | To start the gulp watcher, include this code in your *gulpfile.js* then start ```gulp```:
|
25 |
|
26 | ```javascript
|
27 | var Plumes = require('plumes');
|
28 |
|
29 | new Plumes({
|
30 | paths: {
|
31 | features: './features',
|
32 | public: './public'
|
33 | }
|
34 | });
|
35 | ```
|
36 |
|
37 | ### Use the components
|
38 |
|
39 | Plumes contains many Ractive components and CSS layouts. To use it you have to include [Ractive](http://ractivejs.org), [Ractive Require](https://github.com/XavierBoubert/ractive-require) and [jQuery](http://jquery.com):
|
40 |
|
41 | ```html
|
42 | <script src="http://cdn.ractivejs.org/latest/ractive.js"></script>
|
43 | <script src="http://cdn.ractivejs.org/latest/ractive-require.js"></script>
|
44 | <script src="https://code.jquery.com/jquery-2.1.3.min.js"></script>
|
45 | <script src="https://cdnjs.cloudflare.com/ajax/libs/velocity/1.2.2/velocity.min.js"></script>
|
46 | ```
|
47 |
|
48 | Each component is compiled and ready to use in the ```/public``` folder.
|
49 |
|
50 | ## Example
|
51 |
|
52 | You can try all of the components with the [examples](examples/).
|
53 |
|
\ | No newline at end of file |