#39, Finish columns shortcode, clean scss

2 files changed, 80 insertions, 29 deletions

diff --git a/exampleSite/content/_index.md b/exampleSite/content/_index.md
index a984a44..8da2a30 100644
--- a/exampleSite/content/_index.md
+++ b/exampleSite/content/_index.md
@@ -5,6 +5,23 @@ type: docs
 
 # Acerbo datus maxime
 
+{{< columns >}}
+
+## Astris ipse furtiva
+
+Est in vagis et Pittheus tu arge accipiter regia iram vocatur nurus. Omnes ut
+olivae sensit **arma sorori** deducit, inesset **crudus**, ego vetuere aliis,
+modo arsit? Utinam rapta fiducia valuere litora _adicit cursu_, ad facies
+
+<--->
+
+## Suis quot vota
+
+Ea _furtique_ risere fratres edidit terrae magis. Colla tam mihi tenebat:
+miseram excita suadent es pecudes iam. Concilio _quam_ velatus posset ait quod
+nunc! Fragosis suae dextra geruntur functus vulgata.
+{{< /columns >}}
+
 ## Tempora nisi nunc
 
 Lorem **markdownum** emicat gestu. Cannis sol pressit ducta. **Est** Idaei,
@@ -26,8 +43,8 @@ sequens!
 
 ## Locis suis novi cum suoque decidit eadem
 
-Idmoniae ripis, at aves, ali missa adest, ut *et autem*, et ab? Venit spes
-versus finis sermonibus patefecit murum nec est sine oculis. *Ille* inmota
+Idmoniae ripis, at aves, ali missa adest, ut _et autem_, et ab? Venit spes
+versus finis sermonibus patefecit murum nec est sine oculis. _Ille_ inmota
 macies domoque caelestia cadit tantummodo scelus procul, corde!
 
 1. Dolentem capi parte rostro alvum habentem pudor
@@ -35,22 +52,9 @@ macies domoque caelestia cadit tantummodo scelus procul, corde!
 3. E punior consurgit lentus
 4. Vox hasta eras micantes
 
-## Suis quot
-
-Ea *furtique* risere fratres edidit terrae magis. Colla tam mihi tenebat:
-miseram excita suadent es pecudes iam. Concilio *quam* velatus posset ait quod
-nunc!
-
-## Astris ipse furtiva vota collumque et habe
-
-Est in vagis et Pittheus tu arge accipiter regia iram vocatur nurus. Omnes ut
-olivae sensit **arma sorori** deducit, inesset **crudus**, ego vetuere aliis,
-modo arsit? Utinam rapta fiducia valuere litora *adicit cursu*, ad facies:
-fragosis suae dextra geruntur functus vulgata.
-
 ## Facibus pharetrae indetonsusque indulsit sic incurrite foliis
 
-Nefandam et prisci palmas! Blandita cutis flectitur montis macies, te *nati*
+Nefandam et prisci palmas! Blandita cutis flectitur montis macies, te _nati_
 Latiis; turbaque inferias. Virginis tibi peracta avidusque facies caper nec, e
 at ademptae, mira.
 
diff --git a/exampleSite/content/docs/shortcodes.md b/exampleSite/content/docs/shortcodes.md
index ff46e16..9889fc6 100644
--- a/exampleSite/content/docs/shortcodes.md
+++ b/exampleSite/content/docs/shortcodes.md
@@ -80,30 +80,77 @@ Miseratus fonte Ditis conubia.
 
 # Multi-Column shortcode
 
-```tpl
-{{</* column */>}} <!-- begin columns block -->
+```html
+{{</* columns */>}} <!-- begin columns block -->
 # Left Content
-...
-{{</* column /*/>}} <!-- columns separator -->
+Lorem markdownum insigne...
+
+<---> <!-- magic sparator, between columns -->
+
+# Mid Content
+Lorem markdownum insigne...
+
+<---> <!-- magic sparator, between columns -->
+
 # Right Content
-...
-{{</* /column */>}} <!-- end columns block -->
+Lorem markdownum insigne...
+{{</* /columns */>}}
 ```
 
-{{< column >}}
-# Left Content
+{{< columns >}}
+## Left Content
 Lorem markdownum insigne. Olympo signis Delphis! Retexi Nereius nova develat
 stringit, frustra Saturnius uteroque inter! Oculis non ritibus Telethusa
 protulit, sed sed aere valvis inhaesuro Pallas animam: qui _quid_, ignes.
 Miseratus fonte Ditis conubia.
-{{< column />}}
-# Mid Content
+
+<--->
+
+## Mid Content
 Lorem markdownum insigne. Olympo signis Delphis! Retexi Nereius nova develat
 stringit, frustra Saturnius uteroque inter!
-{{< column />}}
-# Right Content
+
+<--->
+
+## Right Content
 Lorem markdownum insigne. Olympo signis Delphis! Retexi Nereius nova develat
 stringit, frustra Saturnius uteroque inter! Oculis non ritibus Telethusa
 protulit, sed sed aere valvis inhaesuro Pallas animam: qui _quid_, ignes.
 Miseratus fonte Ditis conubia.
-{{< /column >}}
+{{< /columns >}}
+
+
+# Mermaid Chart Shortcode
+
+{{< columns >}}
+```tpl
+{{</* mermaid */>}}
+sequenceDiagram
+    Alice->>Bob: Hello Bob, how are you?
+    alt is sick
+        Bob->>Alice: Not so good :(
+    else is well
+        Bob->>Alice: Feeling fresh like a daisy
+    end
+    opt Extra response
+        Bob->>Alice: Thanks for asking
+    end
+{{</* /mermaid */>}}
+```
+
+<--->
+
+{{< mermaid >}}
+sequenceDiagram
+    Alice->>Bob: Hello Bob, how are you?
+    alt is sick
+        Bob->>Alice: Not so good :(
+    else is well
+        Bob->>Alice: Feeling fresh like a daisy
+    end
+    opt Extra response
+        Bob->>Alice: Thanks for asking
+    end
+{{< /mermaid >}}
+
+{{< /columns >}}