#422, add support for column ratios in shortcode

exampleSite/content.en/docs/shortcodes/columns.md

@@ -2,9 +2,10 @@
 
 Columns help organize shorter pieces of content horizontally for readability.
 
+## Example
 
 ```html
-{{%/* columns */%}} <!-- begin columns block -->
+{{%/* columns [ratio="1:1"] [class="..."] */%}} <!-- begin columns block -->
 # Left Content
 Lorem markdownum insigne...
 
@@ -20,10 +21,8 @@ Lorem markdownum insigne...
 {{%/* /columns */%}}
 ```
 
-## Example
-
 {{% columns %}}
-## Left Content
+### 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.
@@ -31,15 +30,51 @@ Miseratus fonte Ditis conubia.
 
 <--->
 
-## Mid Content
+### Mid Content
 Lorem markdownum insigne. Olympo signis Delphis! Retexi Nereius nova develat
 stringit, frustra Saturnius uteroque inter!
 
 <--->
 
-## 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.
 {{% /columns %}}
+
+## Settings size ratio for columns
+
+```html
+{{%/* columns ratio="1:2" */%}} <!-- begin columns block -->
+
+## x1 Column
+Lorem markdownum insigne...
+
+<---> <!-- magic separator, between columns -->
+
+## x2 Column
+Lorem markdownum insigne...
+
+{{%/* /columns */%}}
+```
+
+{{% columns ratio="1:2" %}}
+### x1 Column
+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.
+
+<--->
+
+### x2 Column
+Lorem markdownum insigne. Olympo signis Delphis! Retexi Nereius nova develat
+stringit, frustra Saturnius uteroque inter!
+
+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.
+
+{{% /columns %}}

exampleSite/content.en/docs/shortcodes/katex.md

@@ -9,16 +9,16 @@ KaTeX shortcode let you render math typesetting in markdown document. See [KaTeX
 {{% columns %}}
 
 ```latex
-{{</* katex display=true class="optional" >}}
+{{</* katex display=true [class="..."] >}}
 f(x) = \int_{-\infty}^\infty\hat f(\xi)\,e^{2 \pi i \xi x}\,d\xi
 {{< /katex */>}}
 ```
 
 <--->
 
-{{< katex display=true class="optional" >}}
+{{<katex display=true>}}
 f(x) = \int_{-\infty}^\infty\hat f(\xi)\,e^{2 \pi i \xi x}\,d\xi
-{{< /katex >}}
+{{</katex>}}
 
 {{% /columns %}}
 

exampleSite/content.en/docs/shortcodes/mermaid.md

@@ -14,7 +14,7 @@ create a `mermaid.json` file in your `assets` folder!
 {{% columns %}}
 
 ```tpl
-{{</* mermaid class="optional" >}}
+{{</* mermaid [class="..."] >}}
 stateDiagram-v2
     State1: The state with a note
     note right of State1
@@ -28,7 +28,7 @@ stateDiagram-v2
 
 <--->
 
-{{< mermaid class="optional" >}}
+{{<mermaid>}}
 stateDiagram-v2
     State1: The state with a note
     note right of State1
@@ -37,6 +37,6 @@ stateDiagram-v2
     end note
     State1 --> State2
     note left of State2 : This is the note to the left.
-{{< /mermaid >}}
+{{</mermaid>}}
 
 {{% /columns %}}