{"bugs":{"url":"https://github.com/AriaMinaei/RenderKid/issues"},"dist":{"shasum":"aa75dbbaba19b638f4c5d75e2af7599555a9199b","tarball":"https://registry.npmjs.org/renderkid/-/renderkid-2.0.7-dev.2.tgz","fileCount":52,"integrity":"sha512-i2/6c6Fe1LH9SLkaftQzMG8JSAOJQVMKPZe0Vh7H6IkWaVSlZlltAgVSHMbfWLH3n5zsI1mhKYIV2081v2bg8g==","signatures":[{"sig":"MEUCIGO1wkzbXbL88cU0a01L3/26yVvRKGNihWz4wbqlqsxhAiEAwiy8Zn0PryLRo2K1EFV3iposRq1mlpu61ogqepi1dRU=","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\nwsFcBAEBCAAQBQJgwjtkCRA9TVsSAnZWagAAeyYQAI0GUMqWc4DrRpVDEprc\nQPsWbT9NbJKlJDL9O4Yt60bOT+s5Q1tIPV3XggC7efl/a3W4KW4rvRiM3iLZ\nFlVLWAQaTewKte1XjRxHTrHTNtKivuYe7Xr2O4Ke0QT24q2LHzMEs795jXRk\nXZJqXogeRMuH6mSfMC5Djaqfz7IaKZsPA19oDzxHxtePpt55/wrp+p4RLLdA\nFFMUVTDC9tip5ukvuIguVydI8vUWg2nlcrh6Zo+p9Ss7pZXdGDtWssK9+fwv\nc7tNolIy5kWotDdATeyTTSyhEVFgJMs0sKlYRpuoDrE7T81awrzAq5NsiHXM\nrBHBhMxt2ik2kQZHq+wTBrEIxf8mywL4MzC8zqCse3NFfeQSvhzaQ5l3rU2u\naURTQDPS9Kcl2qTnV3gEouFNntIMoE3y9RWvHiKEnYxToh6tnNcacbzC7lSo\ngBojM7l6FZOgav5zCVPmzDLj9sSp/19BP65ZoLzX11rUnAi+HNPYfhBjc/gA\nJ/NAWETb3UWPlCO50VQXJtk04MW7j5VZCTPRfXmhF5s6DZ9tx1obhQvPMaOK\n/eVBGTsp5592t9mHPMEka1kJvkxjT/BL5m1GASTsVaRjuJBTtjE+alWJQ1j4\nko4Afa4XTUfTT27ZpAHMOFDPgItqYUCb8aytIFFtzDEOcqArCyUEkuD53bRh\nF49q\r\n=xuz9\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":"^3.0.1","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.2_1623341924336_0.7241448693226411","host":"s3://npm-registry-packages"},"_id":"renderkid@2.0.7-dev.2","version":"2.0.7-dev.2"}