Dog Ear Card
Web Style Guide
Contents
- Home
- Text
- Images
-
Blocks
- Layout Blocks
- Static Blocks
- Repeating Blocks
- Widgets
The Dog Ear Card content layout, named for the folded corner on the top-right of the block, is useful for calling attention to important information.
Example
Earn a Master’s Degree at the Same Time
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer scelerisque massa porttitor dolor dictum ultrices. Fusce rutrum et purus eu porttitor.
The icon in the card can be changed, but there is no user interface for doing so. To change the icon, find the .dog-ear__icon element in the source code and edit the Font Awesome classes on the nested <span> . All Font Awesome 5 Free icons are available.
Note
Here is another example with the icon changed from <span class="fa fa-check-double"></span> to <span class="fa fa-info-circle"></span> .