Callout
This is a callout.
Lorem ipsum dolor sit amet consectetur adipisicing elit. Voluptatem velit, dolorem sapiente incidunt illum vitae at aut repudiandae perspiciatis, dignissimos quod totam molestias veniam consectetur quis ipsum, suscipit molestiae quos!Nihil odio voluptatibus assumenda, repellendus est, ipsa cupiditate quod molestiae at recusandae quam ducimus itaque illo sequi cum? Iusto, fugiat facilis? Dicta non animi praesentium. Quae cumque dolorum aperiam quis?Voluptates reprehenderit eos laboriosam optio nobis explicabo! Consequatur quas illo a nam eligendi excepturi non harum at ratione itaque minima adipisci perspiciatis corrupti assumenda repudiandae expedita, voluptatem rem, accusamus officia.Libero sequi at, quas velit dicta doloremque explicabo molestiae aut deserunt quisquam sint, ducimus ex amet. Magni exercitationem autem, esse earum neque incidunt non facere commodi odit nesciunt eum magnam.Cum veniam sapiente, dolorem voluptatum, totam iure eaque qui eos officia, voluptate praesentium molestias incidunt architecto assumenda nulla quos temporibus autem minus asperiores nam reprehenderit unde accusamus voluptates? Cupiditate, eligendi?
Basics
The callout element allows you to create a block of text that stands out from the rest of the content. It is a floated, block-level element, with no customizations beyond which way it floats and the interior content that you provide.
The content should go inside of a block-level container (probably a <div>) with a slot attribute value of content.
By default, the callout will be floated to the left of whatever you put it next to.
html<ap-callout>
<div slot="content">
<p>This is a callout, left floated.</p>
</div>
</ap-callout>
To float it right, just add the class="right" attribute to the callout element.
html<ap-callout class="right">
<div slot="content">
<p>This is a callout, floated to the right.</p>
</div>
</ap-callout>