Preview
Minititle
The (opinionated) concept of “minititle” makes reference to a small heading, normally used for sectioning. Read more on the minititle()
mixin docs.
The helper .minititle
class applies the mixin defaults: reduces the text size and then augments its visual weight by using a combination of a bold weight, an uppercase text-transform and a greater letter-spacing.
If you need to tweak the values, use the minititle()
mixin instead.
Example
<section>
<p class="minititle">This is the minititle of this section</p>
<p>A normal text. As we said before, the minititle gives visual weight while using a small font-size</p>
</section>
<section class="card half-gutter" style="width:450px">
<h3 class="minititle">An h3 reduced!</h3>
<p class="m0">You can use your <em>minititle</em> on <code>heading</code> elements and maintain the semantics while reducing the font-size</p>
</section>
Assets
- Filesystem Path: src/components/typography/minititle/_minititle.scss
- Size: 37 Bytes
-
Content:
.minititle { @include minititle(); }