Vebego Component Library

Title 

<div class="mol-title title-underline">
    <span class="atm-heading h-subtitle">The quick brown fox jumps over the lazy dog</span>

    <span class="atm-heading h1">The quick brown fox jumps over the lazy dog</span>

</div>
 
<div class="mol-title {{#if underline}}title-underline{{/if}}">
    {{#if subtitle}}
    {{ render '@heading--subtitle' subtitle merge=true }}
    {{/if}}
    {{ render '@heading' heading merge=true }}
</div>
 
{
  "heading": {
    "tag": "span",
    "modifier": "h1"
  },
  "subtitle": {},
  "underline": true
}
  • Content: 
    .mol-title {
    @apply relative;
    @apply mb-2;

    &.title-underline {
        &:after {
            content: '';
            @apply absolute;
            @apply -bottom-2;
            @apply left-0;
            @apply block;
            @apply w-16 h-0.5;
            @apply bg-cta;
        }
    }
}
  • URL: /components/raw/title/title.css
  • Filesystem Path: src\components\03-molecules\title\title.css
  • Size: 323 Bytes

No notes defined.