add [u], [big], [small], [color], [center], [right] tags to babycode
This commit is contained in:
@ -14,23 +14,68 @@
|
||||
</section>
|
||||
<section class="babycode-guide-section">
|
||||
<h2 id="text-formatting-tags">Text formatting tags</h2>
|
||||
<ul>
|
||||
<ul class='babycode-guide-list'>
|
||||
<li>To make some text <strong>bold</strong>, enclose it in <code class="inline-code">[b][/b]</code>:<br>
|
||||
[b]Hello World[/b]<br>
|
||||
Will become<br>
|
||||
<strong>Hello World</strong>
|
||||
</li>
|
||||
</ul>
|
||||
<ul>
|
||||
<ul class='babycode-guide-list'>
|
||||
<li>To <em>italicize</em> text, enclose it in <code class="inline-code">[i][/i]</code>:<br>
|
||||
[i]Hello World[/i]<br>
|
||||
Will become<br>
|
||||
<em>Hello World</em>
|
||||
</li>
|
||||
</ul>
|
||||
<ul>
|
||||
<ul class='babycode-guide-list'>
|
||||
<li>To make some text <del>strikethrough</del>, enclose it in <code class="inline-code">[s][/s]</code>:<br>
|
||||
[s]Hello World[/s]<br>
|
||||
Will become<br>
|
||||
<del>Hello World</del>
|
||||
</li>
|
||||
</ul>
|
||||
<ul class='babycode-guide-list'>
|
||||
<li>To <u>underline</u> some text, enclose it in <code class="inline-code">[u][/u]</code>:<br>
|
||||
[u]Hello World[/u]<br>
|
||||
Will become<br>
|
||||
<u>Hello World</u>
|
||||
</li>
|
||||
</ul>
|
||||
<ul class='babycode-guide-list'>
|
||||
<li>To make some text {{ "[big]big[/big]" | babycode | safe }}, enclose it in <code class="inline-code">[big][/big]</code>:<br>
|
||||
[big]Hello World[/big]<br>
|
||||
Will become<br>
|
||||
{{ "[big]Hello World[/big]" | babycode | safe }}
|
||||
<li>Similarly, you can make text {{ "[small]small[/small]" | babycode | safe }} with <code class="inline-code">[small][/small]</code>:<br>
|
||||
[small]Hello World[/small]<br>
|
||||
Will become<br>
|
||||
{{ "[small]Hello World[/small]" | babycode | safe }}
|
||||
</li>
|
||||
</ul>
|
||||
<ul class='babycode-guide-list'>
|
||||
<li>You can change the text color by using <code class="inline-code">[color][/color]</code>:<br>
|
||||
[color=red]Red text[/color]<br>
|
||||
[color=white]White text[/color]<br>
|
||||
[color=#3b08f0]Blueish text[/color]<br>
|
||||
Will become<br>
|
||||
{{ "[color=red]Red text[/color]" | babycode | safe }}<br>
|
||||
{{ "[color=white]White text[/color]" | babycode | safe }}<br>
|
||||
{{ "[color=#3b08f0]Blueish text[/color]" | babycode | safe }}<br>
|
||||
</li>
|
||||
</ul>
|
||||
<ul class='babycode-guide-list'>
|
||||
<li>You can center text by enclosing it in <code class="inline-code">[center][/center]</code>:<br>
|
||||
[center]Hello World[/center]<br>
|
||||
Will become<br>
|
||||
{{ "[center]Hello World[/center]" | babycode | safe }}
|
||||
</li>
|
||||
<li>You can right-align text by enclosing it in <code class="inline-code">[right][/right]</code>:<br>
|
||||
[right]Hello World[/right]<br>
|
||||
Will become<br>
|
||||
{{ "[right]Hello World[/right]" | babycode | safe }}
|
||||
</li>
|
||||
Note: the center and right tags will break the paragraph. See <a href="#paragraph-rules">Paragraph rules</a> for more details.
|
||||
</ul>
|
||||
</section>
|
||||
<section class="babycode-guide-section">
|
||||
@ -60,6 +105,15 @@
|
||||
{{ '[code]paragraph 1 \nstill paragraph 1[/code]' | babycode | safe }}
|
||||
That will produce:<br>
|
||||
{{ 'paragraph 1 \nstill paragraph 1' | babycode | safe }}
|
||||
<p>Additionally, the following tags will break into a new paragraph:</p>
|
||||
<ul>
|
||||
<li><code class="inline-code">[code]</code> (code block, not inline);</li>
|
||||
<li><code class="inline-code">[img]</code>;</li>
|
||||
<li><code class="inline-code">[center]</code>;</li>
|
||||
<li><code class="inline-code">[right]</code>;</li>
|
||||
<li><code class="inline-code">[ul]</code> and <code class="inline-code">[ol]</code>;</li>
|
||||
<li><code class="inline-code">[quote]</code>.</li>
|
||||
</ul>
|
||||
</section>
|
||||
<section class="babycode-guide-section">
|
||||
<h2 id="links">Links</h2>
|
||||
|
@ -53,6 +53,7 @@
|
||||
<button class="babycode-button" type=button id="post-editor-bold" title="Insert Bold"><strong>B</strong></button>
|
||||
<button class="babycode-button" type=button id="post-editor-italics" title="Insert Italics"><em>I</em></button>
|
||||
<button class="babycode-button" type=button id="post-editor-strike" title="Insert Strikethrough"><del>S</del></button>
|
||||
<button class="babycode-button" type=button id="post-editor-underline" title="Insert Underline"><u>U</u></button>
|
||||
<button class="babycode-button" type=button id="post-editor-url" title="Insert Link"><code>://</code></button>
|
||||
<button class="babycode-button" type=button id="post-editor-code" title="Insert Code block"><code></></code></button>
|
||||
<button class="babycode-button contain-svg full" type=button id="post-editor-img" title="Insert Image"><img src="/static/misc/image.svg"></button>
|
||||
|
Reference in New Issue
Block a user