Block objects. less/components/ExternalPage.less provides a number of predefined block styles, which are documented below, for most use cases.This is the default style of a Block object.
It sets the padding-top and padding-bottom to 64px and the background-color to $white.
To use it, give a div node a class of Block.
This modifier sets the background-color of a Block to $aqua-haze. To use it, give a div node an additional class of Block--type-alternative.
This modifier sets the text-align of a Block to center and its background-color to $outer-space.
It sets the margin-bottom of children h2 and h3 nodes to 0
It changes the color of a child h2 node to $white, the color of a child h3 node to 0.8 of $white, and the color of a child p node to 0.6 of $white.
It sets the margin-top of a child Button node to 32px.
To use it, give a div node an additional class of Block--type-dark.
This modifier sets the margin-top of children h5 and p nodes to 0 and their margin-bottom to 16px and the margin of children ul nodes to 0 0 32px 0.
To use it, give a div node an additional class of Block--type-footer.
This element sets the margin-top of the node to 32px and the margin-bottom of h2 and h3 nodes contained within it to 0.
This element sets the color of a nodes contained within it to $shuttle-gray.
This modifier sets the text-align of the node to center and the margin of img nodes contained within it to 0 auto.
This modifier sets the margin-bottom of h1, h2, h3, h4, h5, and h6 nodes to 0.
This modifier sets the text-align of the node to left.
This modifier sets the margin-top of the node to 0.
Add this class to a Block object to reduce the width of a GridContainer within it to 640px on a desktop and 100% on tablets and smartphones.
Add this class to a Block object to set the margin-bottom of a p node contained within it to 0.
It sets the margin-top of a ProfilePicture object contained within it to 16px.
This is the default style of a BlockHero object. It sets the padding-top and padding-bottom to 128px, text-align to center, background-position to top, background-size to cover, and its background-repeat to no-repeat.
It sets the margin-bottom of h2, h3 and p nodes to 0, the color of h2 nodes to $white, and the color of h3 nodes to 0.5 of $white.
It sets the margin-top of a Button object contained within it to 32px.