diff options
Diffstat (limited to 'node_modules/renderkid/README.md')
-rw-r--r-- | node_modules/renderkid/README.md | 189 |
1 files changed, 0 insertions, 189 deletions
diff --git a/node_modules/renderkid/README.md b/node_modules/renderkid/README.md deleted file mode 100644 index b98f93d5f..000000000 --- a/node_modules/renderkid/README.md +++ /dev/null @@ -1,189 +0,0 @@ -# RenderKid -[](http://travis-ci.org/AriaMinaei/RenderKid) - -RenderKid allows you to use HTML and CSS to style your CLI output, making it easy to create a beautiful, readable, and consistent look for your nodejs tool. - -## Installation - -Install with npm: -``` -$ npm install renderkid -``` - -## Usage - -```coffeescript -RenderKid = require('renderkid') - -r = new RenderKid() - -r.style({ - "ul": { - display: "block" - margin: "2 0 2" - } - - "li": { - display: "block" - marginBottom: "1" - } - - "key": { - color: "grey" - marginRight: "1" - } - - "value": { - color: "bright-white" - } -}) - -output = r.render(" -<ul> - <li> - <key>Name:</key> - <value>RenderKid</value> - </li> - <li> - <key>Version:</key> - <value>0.2</value> - </li> - <li> - <key>Last Update:</key> - <value>Jan 2015</value> - </li> -</ul> -") - -console.log(output) -``` - - - -## Stylesheet properties - -### Display mode - -Elements can have a `display` of either `inline`, `block`, or `none`: -```coffeescript -r.style({ - "div": { - display: "block" - } - - "span": { - display: "inline" # default - } - - "hidden": { - display: "none" - } -}) - -output = r.render(" -<div>This will fill one or more rows.</div> -<span>These</span> <span>will</span> <span>be</span> in the same <span>line.</span> -<hidden>This won't be displayed.</hidden> -") - -console.log(output) -``` - - - - -### Margin - -Margins work just like they do in browsers: -```coffeescript -r.style({ - "li": { - display: "block" - - marginTop: "1" - marginRight: "2" - marginBottom: "3" - marginLeft: "4" - - # or the shorthand version: - "margin": "1 2 3 4" - }, - - "highlight": { - display: "inline" - marginLeft: "2" - marginRight: "2" - } -}) - -r.render(" -<ul> - <li>Item <highlgiht>1</highlight></li> - <li>Item <highlgiht>2</highlight></li> - <li>Item <highlgiht>3</highlight></li> -</ul> -") -``` - -### Padding - -See margins above. Paddings work the same way, only inward. - -### Width and Height - -Block elements can have explicit width and height: -```coffeescript -r.style({ - "box": { - display: "block" - "width": "4" - "height": "2" - } -}) - -r.render("<box>This is a box and some of its text will be truncated.</box>") -``` - -### Colors - -You can set a custom color and background color for each element: - -```coffeescript -r.style({ - "error": { - color: "black" - background: "red" - } -}) -``` - -List of colors currently supported are `black`, `red`, `green`, `yellow`, `blue`, `magenta`, `cyan`, `white`, `grey`, `bright-red`, `bright-green`, `bright-yellow`, `bright-blue`, `bright-magenta`, `bright-cyan`, `bright-white`. - -### Bullet points - -Block elements can have bullet points on their margins. Let's start with an example: -```coffeescript -r.style({ - "li": { - # To add bullet points to an element, first you - # should make some room for the bullet point by - # giving your element some margin to the left: - marginLeft: "4", - - # Now we can add a bullet point to our margin: - bullet: '"-"' - } -}) - -# The four hyphens are there for visual reference -r.render(" ----- -<li>Item 1</li> -<li>Item 2</li> -<li>Item 3</li> ----- -") -``` -And here is the result: - - |