add [lb], [rb], and [@] tags

app/templates/guides/babycode.html

@@ -173,6 +173,19 @@
         <a class="mention display me" href="#mentions" title="@your-username">Your display name</a>
         <p>Mentioning a user does not notify them. It is simply a way to link to their profile in your posts.</p>
       </section>
+      <section class="guide-section">
+        <h2 id="void-tags">Void tags</h2>
+        <p>The special void tags <code class="inline-code">[lb]</code>, <code class="inline-code">[rb]</code>, and <code class="inline-code">[@]</code> will appear as the literal characters <code class="inline-code">[</code>, <code class="inline-code">]</code>, and <code class="inline-code">@</code> respectively. Unlike other tags, they are self-contained and have no closing equivalent.</p>
+        <ul class="guide-list">
+          {% set lbrb = "[color=red]This text will be red[/color]\n\n[lb]color=red[rb]This text won't be red[lb]/color[rb]" %}
+          <li><code class="inline-code">[lb]</code> and <code class="inline-code">[rb]</code> allow you to use square brackets without them being interpreted as Babycode:
+            {{ ("[code]" + lbrb + "[/code]") | babycode | safe }}
+            Will result in:<br>
+            {{ lbrb | babycode | safe }}
+          </li>
+          <li>The <code class="inline-code">[@]</code> tag allows you to use the @ symbol without it being turned into a mention.</li>
+        </ul>
+      </section>
     {% endset %}
     {{ sections | safe }}
   </div>