You are viewing the documentation for Blueriq 15. Documentation for other versions is available in our documentation directory.
It is possible to put presentations style on various elements, e.g. containers, buttons, attributes, etc. A presentation style changes the manner in which the content is presented to the user. It does not change the content itself, or the structure of the page (Content style). A good example is emphasizing a piece of text. For the the TextEmphasis presentation can be used. This presentation style shows the intent of the business engineer, and the styling can react to this by for example making the text bold. On a project you may decide to not only make the piece of text bold, but also change the font size and color for creating the emphasis. By using such presentation styles, a consistent way of presenting content through-out the application is achieved.
Type | Name | Can be applied to | Description | Legacy (MVC) | Library |
|---|---|---|---|---|---|
| Accent | Button | Displays buttons with a secondary chosen color | - | BlueriqTheme | |
| AlignRight | Container | Displays a container relative to its parent container on the right. | align_right | BlueriqTheme | |
| AllOptionsVisible | Attribute | Displays the options in a multivalued field with domain as checkboxes. | BlueriqTheme | ||
| Animation | Can be used to animate statistic charts (like pie, bar etc.) | animate | BlueriqTheme | ||
| Autocomplete | Attribute with value list | Can be used on a single-valued domain-list to have auto completion on a select. Can be used in combination with multi-valued attributes to have a auto completion on a chiplist | - | BlueriqTheme | |
| General | Button | Button document_link | Is used whenever something is displayed as a link and it must be displayed as button instead. (for instance: Document link) | - | BlueriqTheme |
| Danger | TextItem Inline text | AquimaLibrary | |||
| DatepickerMaterial | Date attribute | ||||
| Disabled | Button Attribute | AquimaLibrary | |||
| DoNotShowSearch | Lists | BlueriqTheme | |||
| FlatButton | Button | Is used to display buttons without having a border and a transparent background | button_link | BlueriqTheme | |
| Horizontal | Container Attribute with value list | Displays the content of a container horizontally. Display the domain as horizontal options. | options_horizontal | BlueriqTheme | |
| Info | TextItem Inline text | AquimaLibrary | |||
| Introduction | Container | Displays containers as transparent with a small image in the top left corner | - | BlueriqTheme | |
| LargeText | String attribute | Displays a input field as text-area | memo | BlueriqTheme | |
| Password | String attribute | Add the password style on a string field that you will use as a password field to obscure the text in the input box. | password | BlueriqTheme | |
| Primary | Button document_link (only in combination with Button) | AquimaLibrary | |||
| StatisticPie | For use with the AQ_Statistic* container types | Displays a pie chart | pie | BlueriqTheme | |
| StatisticBar | For use with the AQ_Statistic* container types | Displays a bar chart | bar | BlueriqTheme | |
| StatisticDoughnut | For use with the AQ_Statistic* container types | Displays a doughnut chart | doughnut | BlueriqTheme | |
| StatisticRadar | For use with the AQ_Statistic* container types | Displays a radar chart | radar | BlueriqTheme | |
| StatisticLine | For use with the AQ_Statistic* container types | Displays a line chart | line | BlueriqTheme | |
| StatisticPolar | For use with the AQ_Statistic* container types | Displays a polar chart | polar | BlueriqTheme | |
| Succes | TextItem Inline text | AquimaLibrary | |||
| Switch | Boolean attribute | Displays a checkbox as a slide toggle | toggle | BlueriqTheme | |
| Tertiary | Button document_link (only in combination with Button) | Displays buttons with a tertiary chosen color. | - | BlueriqTheme | |
| TextEmphasis | TextItem Inline text | With this presentation style you emphasize a piece of text. In the default styling this will render the text bold. | AquimaLibrary | ||
| TextEmphasisSubtle | TextItem Inline text | With this presentation style you subtly emphasize a piece of text. In the default styling this will render the text underlined. | AquimaLibrary | ||
| TextEmphasisIntense | TextItem Inline text | With this presentation style you intensely emphasize a piece of text. In the default styling this will render the text italic. | AquimaLibrary | ||
| Transparent | Container | Displays containers as transparent. | - | BlueriqTheme | |
| Warning | TextItem Inline text | BlueriqTheme | |||
| Weight<number> Example: Weight7 | Container that has a dashboard_column Content Style Elements in a container with Presentation Style Horizontal | Within a `Horizontal` container, children can have presentation styles like `Weight<number>` If you have a child with `Weight3` and another child with `Weight1`, the total weight number would be 4. The first child will take 3/4th of the available horizontal space and the second child would take 1/4th. | - | BlueriqTheme | |
| Icons | OnlyIcon | Button | Displays only a icon when used on a button. | only_icon | BlueriqTheme |
| icon_exclamation_circle *1 | A font Awesome icon; can be used in buttons and containers as prefix for display name | icon_exclamation_sign | AquimaPresentationStyles | ||
| icon_info_circle *1 | A font Awesome icon; can be used in buttons and containers as prefix for display name | icon_info_sign | AquimaPresentationStyles | ||
| icon_times *1 | A font Awesome icon; can be used in buttons and containers as prefix for display name | icon_remove | AquimaPresentationStyles | ||
| icon_times_circle *1 | A font Awesome icon; can be used in buttons and containers as prefix for display name | icon_remove_circle | AquimaPresentationStyles | ||
| icon_clock_o *1 | A font Awesome icon; can be used in buttons and containers as prefix for display name | icon_time | AquimaPresentationStyles | ||
| icon_exclamation_triangle *1 | A font Awesome icon; can be used in buttons and containers as prefix for display name | icon_warning_sign | AquimaPresentationStyles | ||
| icon_sign_out *1 | A font Awesome icon; can be used in buttons and containers as prefix for display name | icon_signout | AquimaPresentationStyles | ||
| icon_file_o *1 | A font Awesome icon; can be used in buttons and containers as prefix for display name | icon_file | AquimaPresentationStyles | ||
| icon_file_pdf_o *1 | A font Awesome icon; can be used in buttons and containers as prefix for display name | icon_file_pdf | AquimaPresentationStyles | ||
| icon_file_image_o *1 | A font Awesome icon; can be used in buttons and containers as prefix for display name | icon_file_image | AquimaPresentationStyles |
*1 : These icons represent font-awesome icons. This is without the prefix icon_ x and the lower-dash are upper-dash. Example:
- Fontawesome icon:
exclamation-signbecomes in Blueriq Studio:icon_exclamation_sign - To create a new presentation style for a Fontawesome icon in Blueriq Studio, copy the name of the icon you want and replace the Font awesome prefix 'fa fa-' with 'icon_' and replace all hyphens (-) with an underscore (_)
Fontawesome
The version of fontawesome that is bundled with Blueriq is 4.4.0. There is no separate documentation page for this version, see https://fontawesome.com/v4/icons/ for the documentation about 4.7.0.
When selecting an icon check to see if it is introduced in version 4.4.0 or lower.
Overview
Content Tools