Neutron is an Atomic Design tool based in Brad Frost's concept it is inspired in Patternlab.

• Navigation isn't iframe based. It creates a single, stand alone script and css that loads with your pattern, without any interference to your Scripts or CSS
• Patterns markup: Handlebars.js
• Easy to document your patterns with Markdown
• Search your patterns quickly
• Easy to customize Neutron features with your own CSS
• Multiple CSS themes
• QRCode generator
• Loads your markup in Handlebars, HTML output and documentation under user action - not attached to the code
• Add status to patterns. Default: in progress, done, deprecated

To run Neutron you just need:

Install it globally

$ npm install neutron-adt -g

Install it in your development path

$ neutron install

After successfully load your own implementation, just run:

$ neutron run -w -s

It will compile your patterns, copy your assets and automatically load a browsersync server in https://localhost:3000 and watch your changes

Check the items below to understand Neutron's functionalities and structure.

• Write patterns - TBD
• Document your patterns - TBD
• Project structure - TBD
• Keyboard shortcuts - TBD
• Add status to a pattern - TBD

It’s useful for team work to define the status of every particular pattern to allow/disallow usage by other team members. To add status to your pattern, simply do the following:

1. Create a json file with the same name of your pattern. Example: atoms/text/headline.hbs should be atoms/text/headline.json

2. You may include everything you need as data to your pattern and include the property _status. Example:

   {
     "_status": "in-progress",
     "...": "..."
   }

3. The standard keywords included by default are: in-progress, done and deprecated. The tool automatically replaces the (-) by a whitespace.

4. To customize your own keywords, just add your custom-keyword as _status in your json file and create the following css rules to add styles:

   .neutron-custom-keyword::before {
     color: /* any color */;
     /* what ever you want to do */
   }
   
   #neutron-status .neutron-custom-keyword {
   	background-color: /* any color */;
   	/* what ever you want to do */
   }

Neutron has a friendly command line setup.

TODO: Add more documentation.

• neutron run: Renders your patterns, generates the navigation module and copy your assets folder.
• neutron run -s: Renders your patterns, generates the navigation module, copy your assets folder and runs a server.
• neutron run -w: Renders your patterns, generates the navigation module, copy your assets folder and watch your files.
• neutron run -w -s: Do everything as documented above.
• neutron install: Install neutron in your current path, including a dummy example.
• neutron install -c Install neutron in your current path, without dummy contents. It's an empty run ready for development:

Neutron requires node.js.

TODO

Please, contribute! We'd love to have you as a contributor! Before contribue, read the blog post 10 tips for better Pull Requests to provide good Pull Requests.

• André Dias - Support in navigation module - andrehNSFW
• Mateus Vahl - Support in core - mateuspv
• Vinícius Ebersol - Initial work - vebersol

See also the list of contributors and members who participated in this project.

This project is licensed under the GNU GENERAL PUBLIC LICENSE - see the LICENSE file for details