These elements can be used to create bars and boxes, both with and
without borders. These components are constructed from the more
fundamental table elements: 'table', 'row' and 'cell'.
Source #1:
[% PROCESS html/rgb %]
[% WRAPPER html/bar
col=rgb.rose
width="50%"
%]
[%- FOREACH word = ['Hello', 'World'] %]
<td width="50%">[% word %]</td>
[%- END %]
[% END %]
|
HTML Output #1:
<table border="0" bgcolor="#f08080" width="50%"><tr bgcolor="#f08080">
<td width="50%">Hello</td>
<td width="50%">World</td>
</tr>
</table>
|
Output #1:
|
|
Source #2:
[% INCLUDE html/box
col = rgb.lilac
pad = 4
content = 'Hello World'
%]
|
HTML Output #2:
<table border="0" bgcolor="#9797ff" cellpadding="4"><tr><td>Hello World</td>
</tr>
</table>
|
Output #2:
|
|
Source #3:
[% WRAPPER html/box
col = rgb.bud
width = '100%'
align = 'right'
pad = 4
%]
<font color="[% rgb.white %]"><b>Hello World</b></font>
[% END %]
|
HTML Output #3:
<table border="0" bgcolor="#66aa66" width="100%" cellpadding="4"><tr
align="right"><td align="right">
<font color="#ffffff"><b>Hello World</b></font>
</td>
</tr>
</table>
|
Output #3:
|
|
Source #4:
[% INCLUDE html/edgebox
content = "The Cat Sat on the Mat"
%]
|
HTML Output #4:
<table border="0" bgcolor="#000000" cellpadding="2"
cellspacing="0"><tr><td><table border="0" bgcolor="#ffffff" cellspacing="0"><tr
bgcolor="#ffffff">
<td>
The Cat Sat on the Mat
</td>
</tr>
</table></td>
</tr>
</table>
|
Output #4:
|
Source #5:
[% INCLUDE html/edgebox
border = 1
pad = 4
width = '50%'
content = "The Cat Sat on the Mat"
%]
|
Output #5:
|
|
Source #6:
[% INCLUDE html/edgebox
edge = rgb.blue.dark
fill = rgb.grey.light
pad = 4
width = '50%'
align = 'right'
content = "The Dog Sat on the Log"
%]
|
Output #6:
|
|
Source #7:
[% WRAPPER html/edgebox
edge = rgb.green.dark
fill = rgb.green.light
border = 1
pad = 4
width = '100%'
align = 'center'
%]
The Fish Lay on the Dish
[% END %]
|
Output #7:
|
|
Source #8:
[% WRAPPER html/edgebar
edge = rgb.green.dark
fill = rgb.green.light
border = 1
pad = 4
width = '100%'
%]
<td>Foo</td> <td>Bar</td> <td>Baz</td>
[% END %]
|
Output #8:
|
|
Source #9:
[% WRAPPER html/edgebar
edge = rgb.lavender.dark
fill = rgb.lavender.light
border = 2
pad = 4
width = '100%'
%]
<td align="left">Left Side</td>
<td align="right">Right Side</td>
[% END %]
|
Output #9:
|
|
Source #10:
<div align="center">
[% WRAPPER html/edge
edge = rgb.lavender.dark
fill = rgb.lavender.light
border = 2
pad = 4
width = '80%'
%]
<tr>
<td align="right">One</td>
<td align="left">Two</td>
</tr>
<tr>
<td align="right">Three</td>
<td align="left">Four</td>
</tr>
[% END %]
</div>
|
Output #10:
|
|
Source #11:
<div align="center">
[% WRAPPER html/edgebox
edge = rgb.grey50
fill = rgb.grey75
border = 1
pad = 6
width = '50%'
%]
<h2>Abstract Factory</h2>
<h3>Intent</h3>
<ul>
Provide an interface for creating families of
related or dependant objects without specifying
their concrete classes.
</ul>
<h3>Also Known As</h3>
<ul>
Kit
</ul>
<h3>Motivation</h3>
<ul>
Consider a user interface toolkit that supports
multiple look-and-feel standards, . . .
</ul>
[% END %]
</div>
|
Output #11:
Abstract Factory
Intent
Provide an interface for creating families of
related or dependant objects without specifying
their concrete classes.
Also Known As
Motivation
Consider a user interface toolkit that supports
multiple look-and-feel standards, . . .
|
|
|