Page History
A content style describes the function of a component
Page
under constructionPage element Content Styles
Library | Content style name | Description | Extra |
---|---|---|---|
Dashboard | dashboard_body | This content style indicates the body of the dashboard. (note that this is used in combination with dashboard_header, dashboard_menu and dashboard_footer) | |
Dashboard | dashboard_footer | This content style indicates the footer of the dashboard. (note that this is used in combination with dashboard_header, dashboard_menu and dashboard_body) | |
Dashboard | dashboard_header | This content style indicates the header of the dashboard. (note that this is used in combination with dashboard_menu, dashboard_body and dashboard_footer) | |
Dashboard | dashboard_menu | This content style indicates the menu of the dashboard. (note that this is used in combination with dashboard_header, dashboard_body and dashboard_footer, and requires a sub container with Content style menubar) | |
timeline | This content style show a time line of events. | ||
Dashboard | dashboard_row | This content style indicates a row. | |
Dashboard | dashboard_column1..12 | Dashboard column weight 1-12. This is supported as legacy, it is preferable to use the dashboard_column Content Style and the Weight<N> Presentation Style. | |
Dashboard | dashboard_column | This content style indicates a column in a dashboard_row. Use the Weight<N> Presentation Style to indicate the width relative to the other columns. | |
Dashboard | dashboard_widget | Renders the content of a widget as a tile. | |
Default | breadcrumbcontainer | Default content style connected to the container AQ_BreadCrumb. | |
AquimaLibrary | menubar | Content styling to be used to style a container as a menubar. Should be used within a container with Content Style dashboard_menu. The content style works for buttons and containers containing buttons. | |
AquimaLibrary | tabs | This style renders the direct child containers as tabs where the tab caption is the displayName of the container. It is advised to use this style only for readonly content as validation errors are only shown of the currently active tab. Also, be aware that the fields on all tabs are submitted when the page is submitted, even though the fields are not visible. |
Using column weights
Consider a dashboard structure like at the right.
The MVC layout defined a 12 column grid where dashboard columns could be mapped to. When the column widths added up to less than 12, empty space would be rendered. When it added up to more than 12, the column would be wrapped to a new line. The new Blueriq Theme uses a different model and it will render all columns inside of a dashboard row horizontally. It uses a weight system to determine the width of the columns. A column of weight 2 will be twice as wide as a column of width 1. if you need blank space, you can add an empty column with the specified width. Note that if your weights add up to 12, the same behaviour as in MVC will occur.
In the new theme, another way is supported. The columns container can be assigned the content style 'dashboard_column'. Additionally, a presentation style of 'WeightX' can be assigned to indicate the weight. Weights can be any number, as they are relative to each other. A column with weight 70 will be rendered twice as wide as a column with weight 35. |
For backwards compatibility we support both methods, but note that the number will be interpreted as a weight instead of a width.
Page Content Styles
In the MVC dashboards were always displayed on full screen. This has been changed to be responsive by default. If you desire to have the same behavior you must add the following content style to your page: Full
For completeness, these are all the possibilities:
Library | Content Style | Description |
---|---|---|
BlueriqTheme | Responsive | The width of the content on the page is dependent on the width of the window (default). |
BlueriqTheme | Small | The content on the page is narrow (maximum width is 512 pixels). |
BlueriqTheme | Medium | The content on the page is medium (maximum width is 768 pixels). |
BlueriqTheme | Large | The content on the page is large (maximum width is 1024 pixels). |
BlueriqTheme | Full | Content on the page should take the full width. |