Brand-level masks that can be applied to the top, bottom or top and bottom edges of a content-block, using ONE of these classes (not combinations):
content-block--top-mask--*,
content-block--bottom-mask--*,
or content-block--mask--*
where * is the variant of the mask style (a,b,c etc.)
Masks will overlap other content-blocks unless prevented with the 'no-top-mask-overlap' and/or 'no-bottom-mask-overlap' modifier classes.
When masked content-blocks overlap, a top-mask of the latter content-block overrides any bottom mask of the former.
Masks are defined in the bend SASS variables and will be picked via the CMS (similar to how themes work).
NB: Applying masking to a content-block will hide any overflowing content, such as pop-up menus.
content-block--mask--a' class applied:Phasellus gravida ipsum nec mauris ornare suscipit. Morbi id gravida eros, quis dignissim augue. Mauris vehicula, tortor ut facilisis interdum, mauris est rutrum est, in maximus felis dolor hendrerit massa.
content-block--top-mask--a' class applied:Phasellus gravida ipsum nec mauris ornare suscipit. Morbi id gravida eros, quis dignissim augue. Mauris vehicula, tortor ut facilisis interdum, mauris est rutrum est, in maximus felis dolor hendrerit massa.
content-block--bottom-mask--a' class applied:Phasellus gravida ipsum nec mauris ornare suscipit. Morbi id gravida eros, quis dignissim augue. Mauris vehicula, tortor ut facilisis interdum, mauris est rutrum est, in maximus felis dolor hendrerit massa.
content-block--mask--b' class applied:Phasellus gravida ipsum nec mauris ornare suscipit. Morbi id gravida eros, quis dignissim augue. Mauris vehicula, tortor ut facilisis interdum, mauris est rutrum est, in maximus felis dolor hendrerit massa.
Phasellus gravida ipsum nec mauris ornare suscipit. Morbi id gravida eros, quis dignissim augue. Mauris vehicula, tortor ut facilisis interdum, mauris est rutrum est, in maximus felis dolor hendrerit massa.