FFE-31 Create docs

SpareBank1 · Nov 10, 2016 · b970772 · b970772
1 parent 6abca33
commit b970772
Show file tree

Hide file tree

Showing 3 changed files with 25 additions and 24 deletions.
diff --git a/dev/dev-app.js b/dev/dev-app.js
@@ -1,9 +1,7 @@
 import 'babel-polyfill';
 import './styles.less';
-
 import React from 'react';
-import { render } from 'react-dom';
-
+import {render} from 'react-dom';
 import {
     ContextInfoMessage,
     ContextTipMessage,
@@ -27,8 +25,6 @@ render(
                 Vekommen til betaversjonen av nye Sparebank1.no.
             </ContextTipMessage>
         </div>
-    </div>
-
-    ,
+    </div>,
     document.getElementById('root')
 );
diff --git a/example/example.js b/example/example.js
@@ -1,6 +1,6 @@
 import React from 'react';
 import {renderToStaticMarkup} from 'react-dom/server';
-
+import ThumbUpIcon from 'ffe-icons-react/tommel-opp-ikon';
 import {
     ContextInfoMessage,
     ContextTipMessage,
@@ -9,51 +9,56 @@ import {
 const example = (
     <div>
         <div className="component-intro">
-            <h2 className="component-intro__header">System Message</h2>
-            <div className="lozenge lozenge-success">I PRODUKSJON</div>
+            <h2 className="component-intro__header">Kontekst Meldinger</h2>
+            <div className="lozenge lozenge--wip">UNDER ARBEID</div>
             <p className="ffe-micro-text ffe-external-docs-text">
-                HENTET FRA <a href="***REMOVED***">STASH</a>
+                RELATERTE PAKKER PÅ STASH:
+                <a href="***REMOVED***">LESS</a>
+                <a href="***REMOVED***">REACT</a>
             </p>
-            <p>Meldinger</p>
+            <p>Gir side eller produktspesifikk informasjon av ikke kritisk art</p>
         </div>
 
         <h3 className="ffe-h4">Eksempler</h3>
 
         <div className="example-container">
             <h4 className="example-container__header">Info</h4>
-            <ContextInfoMessage>
-                Informasjon
+            <ContextInfoMessage
+                header='Info'
+            >
+                Info om en spennede side eller produkt.
             </ContextInfoMessage>
         </div>
 
         <div className="example-container">
-            <h4 className="example-container__header">News</h4>
-            <ContextTipMessage>
-                Nyheter
+            <h4 className="example-container__header">Tips</h4>
+            <ContextTipMessage
+                header='Tips'
+                icon={<ThumbUpIcon />}
+            >
+                Tips om en spenndee side eller produkt.
             </ContextTipMessage>
         </div>
 
-
-
         <div className="expanding-field">
-            <button className="expanding-field__toggle">Vis kode</button>
+            <button className="expanding-field__toggle">Vis HTML</button>
             <span className="expanding-field__icon"></span>
             <div className="expanding-field__content">
                 <pre>
                     <code className="html hljs xml">
                         {
                             renderToStaticMarkup(
-                                <ContextInfoMessage>
-                                    Send innholdet her. Alt pakkes i et &lt;p&gt; element så unngå bruk av
-                                    feks &lt;div&gt;, &lt;p&gt; og &lt;ul&gt;.
+                                <ContextInfoMessage
+                                    header='Info'
+                                >
+                                    Info om en spennede side eller produkt.
                                 </ContextInfoMessage>
                             ).replace(/</, '\n<')
                         }
                     </code>
                 </pre>
             </div>
         </div>
-
     </div>
 );
 

diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "ffe-context-message-react",
-  "version": "0.0.1",
+  "version": "1.0.0",
   "description": "SpareBank 1 System Message komponent",
   "main": "lib/index.js",
   "scripts": {