styledocs
v0.1.5
Published
Generate style guide from your stylesheet.
Downloads
4
Readme
#Styledocs
Styledocs is a style document generator. It parse through stylesheet and creates style documents based on the comments provided in it. Its a customized version of jacobrask's styledocco.
#Installation
npm install -g styledocs
#Usage
styledocs [options] [INPUT]
styledocco -n "My Project" css
or styledocco -n "My Project" style.css
Options
--name
,-n
Name of the project (required)--out
,-o
Output directory (default: "docs")--resources
,-s
Directory for custom template, CSS and JavaScript. Can be the same as the output directory if you don't want to overwrite your changes. StyleDocco defaults will be used for any required file not found in this directory. (optional)--preprocessor
Custom preprocessor command. To disable preprocessing, usenone
. (optional) (ex:--preprocessor "scss --load-path=deps/"
)--include
Prepend specified CSS file to the documentation stylesheet. (optional) (ex:--include mysite.css
)
Example
/*#breadcrumb
<div class="breadcrumb"><a href="">Home</a><span>Email</span></div>
*/
.breadcrumb a{ padding-right:10px; text-decoration:none; } .breadcrumb a:after{ content: '>'; width: 15px; height: 14px; display: inline-block; background: red; font-size: 11px; text-align: center; border-radius: 15px; margin-left: 10px; color: white; font-weight: bold;
} .breadcrumb a:hover{ color:gray; } .breadcrumb span{ color:green; }
/* #search
<form id="searchFrmNormal" action="" method="get" class="search" onsubmit="return searchboxValidate('Search')"><input accesskey="f" name="q" type="text" id="search-text" class="txt-search" placeholder="Search" value="Search"><input type="submit" class="btn-search" value=">"></form>
*/
.search{ background:#f1f1f1; border:1px solid #ccc; padding:5px 10px; display:inline-block; border-radius:5px; }
.search input{ background:none; border:0; }
.search input[type="submit"]{ border-radius:5px; background:#333; font-size:13px; font-weight:bold; color:#fff; }