In a Blueriq theme, working with presentation styles is a common activity. This chapter describes the tools that are provided by the framework.
Each Blueriq element has a set of presentation styles that is available using Element.styles
as an instance of PresentationStyles
. This class has some useful utilities to work with presentation styles.
Similarly to ngClass
, the framework provides the bqClasses
directive that will apply a set of presentation styles to the DOM element.
Optionally, you may provide a local mapping of presentation style to classname:
By default, bqClasses
will use the presentation styles of the currently rendered Blueriq element. You may specify a different element using bqClassesElement
:
Alternatively, if you just have a set of presentation styles, use bqClassesStyles
instead:
Instead of providing a mapping from presentation style to classname locally, you may also register common translations globally in an Angular module:
If the static mapping as shown above is not capable enough of declaring your presentation style mapping, you may chose to implement a custom StyleTranslator
instead. The following example shows how a column system may be implemented: