projectdoc Toolbox
Colored Sections and Boxes
Colored sections or boxes – like the Confluence panel macro – support authors to emphasize their content.
Using the Section Macro or Content Marker Macro of the projectdoc Toolbox with version 2.0 it is possible to style the section more easily than defining your own CSS classes (see parameter CSS Classes of the Section Macro).
The projectdoc Toolbox provides a set of predefined CSS classes to support rounded boxes with colors easily.
Using the CSS class projectdoc-section-box the following styles are applied:
projectdoc-section-box
.projectdoc-section-box { border-radius: 25px; padding: 20px; margin-bottom: 5px; margin-top: 25px; }
Now in conjunction with three templates for CSS classes colored boxes can be rendered:
projectdoc-h-COLORNAME
projectdoc-c-COLORNAME
projectdoc-bg-COLORNAME
Here is a short example to show how to add a section and configure it to render the section as a box.
Assume to render a section using the Section Macro rendered like this:
This is an example of a colored section.
Use the section macro, add title and body:
Now simply add the following classes to as value to the "CSS Classes" parameter of the Section Macro:
projectdoc-h-White
projectdoc-c-DarkBlue
projectdoc-bg-Darkorange
In the macro editor these values are added like this:
The CSS class names are separated by whitespace (a single space).