Feature #38 improve documentation (#40)

* Add verbose, files, namespace and script configuration documention * Add script annotation * Fix typo
holidaypirates · Feb 9, 2017 · 5511fd0 · 5511fd0
1 parent 64e7824
commit 5511fd0
Show file tree

Hide file tree

Showing 3 changed files with 85 additions and 0 deletions.
diff --git a/docs/src/views/common/menu.pug b/docs/src/views/common/menu.pug
@@ -9,6 +9,7 @@ nav.menu.SG-toc
         li: a.SG-a(href="annotation-reference.html") Annotation reference
         li: a.SG-a(href="substitutions-flags.html") Substitutions &amp; Flags
         li: a.SG-a(href="modifiers.html") Modifiers
+        li: a.SG-a(href="script.html") Script
         li: a.SG-a(href="vendored-elements.html") Vendored elements
 
         li.SG-toc__category Meta

diff --git a/docs/src/views/configuration.pug b/docs/src/views/configuration.pug
@@ -1,3 +1,7 @@
+//-
+  With contributions from:
+    - Alexis Piéplu ([email protected])
+
 extends layouts/doc-page
 
 block title
@@ -124,3 +128,49 @@ block content
     div.SG-config__row
       div.SG-config__label Example
       div.SG-config__value nucleus --norandom
+
+  h3.SG-h3 Verbose level
+  p.SG-p To defines the vebosity level of the console output. For silent output set 0, for debug mode set 3.
+  div.SG-config
+    div.SG-config__row
+      div.SG-config__label CLI flag
+      div.SG-config__value --verbose
+      div.SG-config__row
+        div.SG-config__label Config key
+        div.SG-config__value verbose
+        div.SG-config__row
+          div.SG-config__label Default value
+          div.SG-config__value 3
+          div.SG-config__row
+            div.SG-config__label Example
+            div.SG-config__value nucleus --verbose 2
+
+  h3.SG-h3 Files to crawl
+  p.SG-p Path to your scss files that nuceleus use for generating source
+  div.SG-config
+    div.SG-config__row
+      div.SG-config__label Config key
+      div.SG-config__value files
+    div.SG-config__row
+      div.SG-config__label Default value
+      div.SG-config__value ["*.scss", "**/*.scss"]
+
+  h3.SG-h3 Javascript files includes
+  p.SG-p To add your javascipt, you need to specify the path (URI) to your Javascript file. You may also pass multiple paths as array.
+  div.SG-config
+    div.SG-config__row
+      div.SG-config__label Config key
+      div.SG-config__value script
+    div.SG-config__row
+      div.SG-config__label Default value
+      div.SG-config__value null
+
+  h3.SG-h3 Css namespace
+  p.SG-p If you use a CSS namespace class around your style, it will appear on the parent node preview.
+  div.SG-config
+    div.SG-config__row
+      div.SG-config__label Config key
+      div.SG-config__value namespace
+    div.SG-config__row
+      div.SG-config__label Default value
+      div.SG-config__value page
diff --git a/docs/src/views/script.pug b/docs/src/views/script.pug
@@ -0,0 +1,34 @@
+//-
+  With contributions from:
+    - Alexis Piéplu ([email protected])
+
+extends layouts/doc-page
+
+block title
+  | Script
+
+block content
+  h1.SG-h1 Script
+  p.SG-p.
+    For javascript code linked to your component, use @script tag that will render it in a code block, just below the markup.
+
+  code.code.language-nucleus(data-d-code-preview).
+    /**
+     * Header bar with logo, navigation, and tool icons at the top of the page.
+     *
+     * @structure Header
+     * @flag full-width
+     * @markup
+     *  <div class="SG-header">
+     *    @{include:.SG-logo}
+     *    @{include:.SG-nav-icons}
+     *    @{include:.SG-nav}
+     *  </div>
+     * @script
+     *    $('body').on('click','.SG-header',function(){
+     *        $(this).doSomething();
+     *    });
+     */
+    .SG-header{
+      ...
+    }