Boxes
To off set a block of text, and enclose it in a shaded,
rounded rectangle,
use the [box]…[end] tag.
For example…
Line 1[br]
Line 2
[box]
Line 3[br]
Line 4
[end]
Line 5[br]
Line 6
The above produces the following (enclosed in horizontal lines)…
Line 1
Line 2
Line 3
Line 4
Line 5
Line 6
Line 1
Line 2
Line 3
Line 4
Line 6
A block box is one where the
[box] and [end]
tags each appear alone on their respective lines
(except for comments and/or whitespace).
The previous example shows a block box.
An inline box is one where the start and/or end
tags appear on a line with other content.
For example:
This is an example of [box]an inline box[end],
which doesn't change the text, but does make
a nice [box]background[end].
The above produces the following (enclosed in horizontal lines)…
This is an example of an inline box, which doesn't change the text, but does make a nice background.
This is an example of an inline box, which doesn't change the text, but does make a nice background.
Within a [box] tag, the [line] tag
produces a thin horizontal line. For example…
Introduction[...]
[box]
Preface[...]
[line]
Details[...][br]
More details[...][br]
Details[...]
[end]
Conclusion[...]
The above produces the following (enclosed in horizontal lines)…
Introduction…
Preface…
Details…
More details…
Details…
Conclusion…
The [line] tag is not allowed outside of a [box] tag.
Introduction…
Preface…
Details…
More details…
Details…
The [line] tag is not allowed outside of a [box] tag.
You can specify the alert attribute on a [box] tag,
to produce a box with an additional notice for the user.
This is only supported on block boxes.
For example, to create an "Installation Instructions" box…
[box alert="Installation Instructions"]
To install ProductX, follow these steps[...]
[list]
## First Step
## Second Step
## Final Step
[end]
If you have questions, call 1-800-000-0000.
[end]
The above produces a box like this…
Additionally, Sage offers a handful of special alert
categories, with associated custom colors.
The category is inferred by looking at the first word
(after removing symbols) of the alert title.
For example, errors and warnings appear in red…
[box alert="Warning - Untested Code"]
This code hasn't been tested, but it did compile, so[...]
[end]
The above produces…
Below is a complete list of all box alert colors,
and the corresponding initial word(s) for each…
The [title] tag allows you to use Sage markup
in the box title. For example…
[box]
[title]Dividing By [&infin][end]
This library doesn't support dividing by infinity.
[end]
The above produces this…
The [title] tag must follow the [box]
tag immediately (other than whitespace).
You can do nearly anything in the title tag, including
having multiple lines, images, links, etc.
For example…
[box]
[title]
[img Fail.png][br]Here Be
[url https://en.wikipedia.org/wiki/Welsh_Dragon]Dragons[end]!
[end]
This library doesn't support dividing by infinity.
[end]
The above produces this…
The [title] tag also allows you to
specify the box color independently from the title.
For example…
[box alert=error]
[title][img Fail.png][br]Here Be Dragons![end]
This library doesn't support dividing by infinity.
[end]
The above produces this…
Other than selecting a color, the alert attribute is ignored
when the [title] tag is also present.
When using the alert attribute,
you can also use the NoTitle attribute to omit the title bar.
For example…
[box alert=Error NoTitle]
This library doesn't support dividing by infinity.
[end]
The above produces this…
The NoTitle attribute must not have a value,
and precludes the use of the
[title] tag.
Using the color attribute, you can indicate a specific color
This overrides the color implied by the alert
attribute, if present.
This color will be used for the thin strip along the left
edge of the box.
The title bar, if visible, uses the same color, at 50% opacity.
For example…
[box alert="Additional Info" color=Pink]
More information can be found[...]
[end]
The above produces this…
More information can be found…
Colors may be specified using standard web color names,
or as hexadecimal RGB values (prefixed with #).
The alert and color attributes
are mutually exclusive in the presence of the
NoTitle attribute
or the [title] tag.
Additional Info
More information can be found…
Boxes can nest, to any desired depth.
In addition, a box may include code samples,
tables, lists, and so forth.
For example…
Line 1[br]
Line 2
[box]
Line 3 [-] a `SQL` example...
[.sql]
select *
from acct
where acct_nbr < 100
[end]
Line 4
[box alert="Nested Box"]
This is a nested box.
[end]
Line 5
[end]
Line 6[br]
[box alert="Nested Box"]
This is a nested box, with some `monospace` text.
[end]
Line 7
The above produces the following (enclosed in horizontal lines)…
Line 1
Line 2
Line 3 – a SQL example... select * from acct where acct_nbr < 100 Line 4 Line 5
Line 6
Line 7
Note how code samples (and monospace text) appear in a nested box, of a contrasting color.
Line 1
Line 2
Line 3 – a SQL example... select * from acct where acct_nbr < 100 Line 4 Line 5
Line 7
Note how code samples (and monospace text) appear in a nested box, of a contrasting color.
⏱ Last Modified: 10/24 9:45:52 am