Basic Syntax - Group

This page describe the group syntax of KARAS.

Inline group
Block group

Inline group

Inline group syntax is the syntax to group some text or words. (In other words, syntax to close the text with span element.) Text closed with << and >> becomes inline group.

Input

<<Sample>> text.

Output

 <span>Sample</span> text.

Inline group enable to add the name with option syntax ::. The maximum level of inline group is 2. ** In level 1, outputs class group. And in level 2, outputs id group. Usually group has name, and the id should be uniquely defined in the document.

Input

<<group::Sample>> text.
<<<group::Sample>>> text.

Output

<span class="group">Sample</span> text.
<span id="group">Sample</span> text.

Block group

Block group syntax is the syntax to group everything like heading, list, table, text or the other. (In other words, syntax to close the text with div element or the other.) When write a {{ at the beginning of the line, it becomes the start of the group. And, when write a }} at the beginning of the line, it becomes the end of the group. Heading, text, and the others between start and end will be grouped.

Input

{{
 = Heading
 
 Some paragraphs. 
 
 - Some lists.
 -- 2nd item.
}}

Output

<div>
<h1>Heading</h1>
<p>Some paragraphs</p>
<ul>
<li> Some lists.
<ul><li>2nd item.</li></ul>
</li>
</ul>
</div>

Named group

Following text after the syntax of the block group start {{ becomes group name. (In other words, it becomes class name of div element.) Note, the group name cannot break the line.

Input

{{groupname
Contents in group.
}}

Output

<div class="groupname">
<p>Contents in group.</p>
</div>

Special group

Following names cannot use as group name. When these names are set, the group becomes special group.

In other words, the group becomes that name element. If you need more information about these group, please search and read document about HTML element.

div	Nothing have special mean.
header	Represent header of contents.
footer	Represent footer of contents.
nav	Represent menu or structure of contents.
article	Represent article. (same topic contents).
section	Represent section (smaller than article).
aside	Represent not main subject.
address	Represent author info of contents.
details	Repesent additional info, detail info.
figure	Represent figure, table.
pre	Reperesent preformatted contents.
code	Represent source code or path.
kbd	Represent user input.
samp	Reperesent output. Like sample.

For example, the group named 'header' is output as header element.

Input

{{header
Contents in header.
}}

Output

<header>
Contents in header.
</header>

In order to add the name to header group, use option syntax ::. The following text becomes the group name.

Input

{{header::groupname
Contents in header.
}}

Output

<header class="groupname">
Contents in header.
</header>

In order to name 'header' to the div group, use 'div' as group name, and add the 'header' as option.

Input

{{div::header
Contents in div group.
}}

Output

<div class="header">
Contents in div group.
</div>

figure, details group

figure and details group have a special function. Heading syntax = in figure group is output as figcaption. You can write heading syntax at anywhere in the figure group. However, usually at the top or bottom of figure group.

Input

{{figure
= Caption text.

!|table head || table item
!|table head || table item
}}

Output

<figure>
<figcaption>Caption text.</figcaption>
<table>
<tr><th>table head</th><td>table item</td></tr>
<tr><th>table head</th><td>table item</td></tr>
</table> 
</figure>

Heading syntax = in details group is output as summary. You can write heading syntax at anywhere in the details group. However, usually at the top of details group.

Input

{{details
= Summary text.
 
;detail-1
;;More detail.
;detail-2
;;more detail.
}}

Output

<details>
<summary>Summary text.</summary>
<dl>
<dt>detail-1</dt>
<dd>More details.</dd>
<dt>detail-2</dt>
<dd>More details.</dd>
</dl>
</details>

pre, code, kbd, samp group

pre, code, kbd, and samp, group have a special function. Text in these group enable to break the line without using syntax ~ to linebreak. In addition, KARAS syntax in the text is not converted, and the special marks like < or > are convert to the character reference.

Input

{{pre
Preformatted text.
2nd line.
<tag>Text in tag.</tag>
}}

Output

<pre>
Preformatted text.
2nd line.
&lt;tag&gt;Text in tag.&lt;/tag&gt;
</pre>

code, kbd and sample group is output along with pre group(element). Group name added as option added to the both pre and code (kbd, samp) group.

Input

{{code :: lang-c
int main()
{
    printf("Unyalder!");
    return 0;
}
}}
 
{{samp :: terminal
$echo Unyalder!
Unyalder!
}}

Output

<pre class="lang-c">
<code class="lang-c">
int main()
{
    printf("Unyalder!");
    return 0;
}
</code>
</pre>

<pre class="terminal">
<samp class="terminal">
$echo Unyalder!
Unyalder!
</samp>
</pre>