Wiki page Layout
You can use one or two column layout blocks to organize information in a wiki page or card. In Mingle this kind of layout is often referred to as a dashboard.
You can take a look at this example project overview page to see how that might look with some charts and tables included.
One-column layout
To create a single column layout block, this will create a named section within a wiki page which spans the wiki page and encloses other wiki content.
{% dashboard-panel %}
{% panel-heading %}A heading for the layout{% panel-heading %}
{% panel-content %}
Some wiki content for layout
{% panel-content %}
{% dashboard-panel %}
Preview
Where you would substitute appropriate text and content for A heading for the layout, and Some wiki content for layout respectively. The layout content can include any other wiki formatting or content, however nesting layout blocks is not recommended except as part of a two-column layout.
Two-column layout
To create a two column layout block, this will create a set of named sections within a wiki page, organized into two columns of equal width.
{% two-columns %}
{% left-column %}
{% dashboard-half-panel %}
{% panel-heading %}Top Left heading{% panel-heading %}
{% panel-content %}
Top Left content
{% panel-content %}
{% dashboard-half-panel %}
{% left-column %}
{% right-column %}
{% dashboard-half-panel %}
{% panel-heading %}Top Right heading{% panel-heading %}
{% panel-content %}
Top Right content
{% panel-content %}
{% dashboard-half-panel %}
{% right-column %}
{% two-columns %}
{% two-columns %}
{% left-column %}
{% dashboard-half-panel %}
{% panel-heading %}Second Left heading{% panel-heading %}
{% panel-content %}
Second Left content
{% panel-content %}
{% dashboard-half-panel %}
{% left-column %}
{% two-columns %}
Preview
Where you would substitute appropriate text and content for xxx left/right panel, and Some content. You can add multiple
{% dashboard-half-panel %}
blocks on each side of the layout.
Mixed column layout
This is an example of using both one-column and two-column layout blocks in the same page
{% dashboard-panel %}
{% panel-heading %}A heading for the layout{% panel-heading %}
{% panel-content %}
Some wiki content for layout
{% panel-content %}
{% dashboard-panel %}
{% two-columns %}
{% left-column %}
{% dashboard-half-panel %}
{% panel-heading %}Top Left heading{% panel-heading %}
{% panel-content %}
Top Left content
{% panel-content %}
{% dashboard-half-panel %}
{% left-column %}
{% right-column %}
{% dashboard-half-panel %}
{% panel-heading %}Top Right heading{% panel-heading %}
{% panel-content %}
Top Right content
{% panel-content %}
{% dashboard-half-panel %}
{% right-column %}
{% two-columns %}
{% two-columns %}
{% left-column %}
{% dashboard-half-panel %}
{% panel-heading %}Second Left heading{% panel-heading %}
{% panel-content %}
Second Left content
{% panel-content %}
{% dashboard-half-panel %}
{% left-column %}
{% two-columns %}
Preview
Section line
Creates a section line separating sections of text
Section one
---
Section two
Preview
