{"bugs":{"url":"https://github.com/AriaMinaei/RenderKid/issues"},"dist":{"shasum":"b57d6067044e92d9c6e662bd1cfac0c7b3dec4e9","tarball":"https://registry.npmjs.org/renderkid/-/renderkid-2.0.7-dev.1.tgz","fileCount":52,"integrity":"sha512-bwAfZ1Xsi3xtLJEjtobnWKL7WvTetCrQoSkSE3ivIaADw+D+yiSorK5SQvyKOpsORUp/rZ2/1d+RNJpj5ZzlMw==","signatures":[{"sig":"MEUCIQCZmdn93sKBHCfbAhjfT12tiwUEiIq3LS4kJ3XjfM2UYQIgMK/DwBv0y18zPNn6m4Je7moTtZGPNmByT1z1JLrgWWU=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":169406,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgwiTiCRA9TVsSAnZWagAAFRYQAKCJDWSnxOaS4I9qZh1t\nxL4ahPnGRGzk90P8nXo8ovOqXbhQOm/HhFQIaTEFaZVwBt7vS94KApm2iB2s\ntpc+9NykpdNxzqB4lp9C/qG1Mxxsw834gyqcX8MCTpN5+UzIsgJ+g7gcoyWj\nwIMcXYGEQqbbbzcWvhTfS/Mczgyz2VWKnd+q+rcOvg1fb0K9iEOAdUIk1Vy2\n82HOSG4ETrcXXk4FVXPkZkoLjOKGEQh9wjXzkFYjHOWsDqq173v9b9Vo1KBh\nSNBaCIsJIxF2xpxSpEqpZ0E+TdyL+DY1ZCSphf9fuXRd5RLNryHa7h67Ytl8\nseQJuDoLcsdGrlDKPdQvtCH3PlG/FZVKNPVlTaqWcAoKQ4mc9CVwrHit5FBa\n8rdWGtXtjfwZ3/YPWzsfBUzw9nMi7123UBg2I2eH+a5t4S23TRHTo4zfNQ/y\nqWkPCG0s3HBUvjDgqrZIcNsZ//Gew87rxMxlwvn25SF0ASvwJ4LTKF2XTThB\nxE/TgswV4ddD5YZn9lH9aOFJt5BBqpFpO6Wz6/BSQn8yaAI1QDxeLTGE+qtS\ncycJVA9xREnjI24bjcwWV0kcvE98bfCMkNmt7T1L98yNZQXRqVvbhgCMC8kj\nmTqk1K46aRnl5QYVbI9BKpn3yQfmvPtgQ2FmvwMLiXk8c0sueGAdWsN/WwAS\nYEmm\r\n=a6VN\r\n-----END PGP SIGNATURE-----\r\n"},"main":"lib/RenderKid.js","name":"renderkid","author":{"name":"Aria Minaei"},"readme":"# RenderKid\n[![Build Status](https://secure.travis-ci.org/AriaMinaei/RenderKid.png)](http://travis-ci.org/AriaMinaei/RenderKid)\n\nRenderKid 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.\n\n## Installation\n\nInstall with npm:\n```\n$ npm install renderkid\n```\n\n## Usage\n\n```coffeescript\nRenderKid = require('renderkid')\n\nr = new RenderKid()\n\nr.style({\n \"ul\": {\n display: \"block\"\n margin: \"2 0 2\"\n }\n\n \"li\": {\n display: \"block\"\n marginBottom: \"1\"\n }\n\n \"key\": {\n color: \"grey\"\n marginRight: \"1\"\n }\n\n \"value\": {\n color: \"bright-white\"\n }\n})\n\noutput = r.render(\"\n\n\")\n\nconsole.log(output)\n```\n\n![screenshot of usage](https://github.com/AriaMinaei/RenderKid/raw/master/docs/images/usage.png)\n\n## Stylesheet properties\n\n### Display mode\n\nElements can have a `display` of either `inline`, `block`, or `none`:\n```coffeescript\nr.style({\n \"div\": {\n display: \"block\"\n }\n\n \"span\": {\n display: \"inline\" # default\n }\n\n \"hidden\": {\n display: \"none\"\n }\n})\n\noutput = r.render(\"\n
This will fill one or more rows.
\nThese will be in the same line.\nThis won't be displayed.\n\")\n\nconsole.log(output)\n```\n\n![screenshot of usage](https://github.com/AriaMinaei/RenderKid/raw/master/docs/images/display.png)\n\n\n### Margin\n\nMargins work just like they do in browsers:\n```coffeescript\nr.style({\n \"li\": {\n display: \"block\"\n\n marginTop: \"1\"\n marginRight: \"2\"\n marginBottom: \"3\"\n marginLeft: \"4\"\n\n # or the shorthand version:\n \"margin\": \"1 2 3 4\"\n },\n\n \"highlight\": {\n display: \"inline\"\n marginLeft: \"2\"\n marginRight: \"2\"\n }\n})\n\nr.render(\"\n\n\")\n```\n\n### Padding\n\nSee margins above. Paddings work the same way, only inward.\n\n### Width and Height\n\nBlock elements can have explicit width and height:\n```coffeescript\nr.style({\n \"box\": {\n display: \"block\"\n \"width\": \"4\"\n \"height\": \"2\"\n }\n})\n\nr.render(\"This is a box and some of its text will be truncated.\")\n```\n\n### Colors\n\nYou can set a custom color and background color for each element:\n\n```coffeescript\nr.style({\n \"error\": {\n color: \"black\"\n background: \"red\"\n }\n})\n```\n\nList 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`.\n\n### Bullet points\n\nBlock elements can have bullet points on their margins. Let's start with an example:\n```coffeescript\nr.style({\n \"li\": {\n # To add bullet points to an element, first you\n # should make some room for the bullet point by\n # giving your element some margin to the left:\n marginLeft: \"4\",\n\n # Now we can add a bullet point to our margin:\n bullet: '\"-\"'\n }\n})\n\n# The four hyphens are there for visual reference\nr.render(\"\n----\n
  • Item 1
    • \n
  • Item 2
    • \n
  • Item 3
    • \n----\n\")\n```\nAnd here is the result:\n\n![screenshot of bullet points, 1](https://github.com/AriaMinaei/RenderKid/raw/master/docs/images/bullets-1.png)\n","gitHead":"d1c00a98d1f402218dd9b2066cc9b9ef9456d7ce","license":"MIT","scripts":{"test":"mocha \"test/**/*.coffee\"","watch":"npm run compile:watch & npm run test:watch","compile":"coffee --bare --transpile --output ./lib ./src","prepublish":"npm run compile","test:watch":"npm run test -- --watch","compile:watch":"coffee --watch --bare --transpile --output ./lib ./src"},"_npmUser":{"name":"ariaminaei","email":"aria.minaei@gmail.com"},"homepage":"https://github.com/AriaMinaei/RenderKid#readme","repository":{"url":"git+https://github.com/AriaMinaei/RenderKid.git","type":"git"},"_npmVersion":"7.13.0","description":"Stylish console.log for node","directories":{},"maintainers":[{"name":"ariaminaei","email":"aria.minaei@gmail.com"}],"_nodeVersion":"16.2.0","dependencies":{"lodash":"^4.17.21","css-select":"^4.1.3","strip-ansi":"^6.0.0","htmlparser2":"^6.1.0","dom-converter":"^0.2.0"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"chai":"^4.3.4","mocha":"^9.0.0","sinon":"^11.1.1","chai-fuzzy":"^1.6.1","sinon-chai":"^3.7.0","@babel/core":"^7.14.5","chai-changes":"^1.3.6","coffeescript":"^2.5.1","@babel/preset-env":"^7.14.5"},"_npmOperationalInternal":{"tmp":"tmp/renderkid_2.0.7-dev.1_1623336162765_0.6979203277303978","host":"s3://npm-registry-packages"},"_id":"renderkid@2.0.7-dev.1","version":"2.0.7-dev.1"}