Some styled Origami components come with a ‘silent mode’ Sass variable, which is used to control when the component outputs CSS. However, this is now deprecated in favour of including a Sass mixin to control CSS output.
$o-component-silent-mode
defaults to ON. You do not need to explicitly set it to be on, but you do need to be aware of this default.
If we consider a small snippet of SCSS, as the one below, we can illustrate how silent mode works.
$o-message-is-silent: true !default;
@mixin oMessage() {
.o-message {
display: block;
}
.o-message--closed {
display: none;
}
};
@if ($o-message-is-silent == false) {
@include oMessage();
// Set to silent again to avoid being output twice
$o-message-is-silent: true !global;
}
When a component’s silent mode is set to true
or ‘on’: $o-component-is-silent: true
, the SCSS mixins and variables will be made available, but they will not be included or built.
What will be available to you in this case is:
@mixin oMessage() {
...
}
When a component’s silent mode is false
or, ‘off’: $o-component-is-silent: false
, the SCSS in the example above will be included automatically and will build all of its styles.
The following will be available for you to use in your project:
.o-message {
display: block;
}
.o-message--closed {
display: none;
}