Fractal Starter
Project version : 0.1.2

Heading

<h1>This is a title</h1>
<h1>{{ title.text }}</h1>
{
  "title": {
    "text": "This is a title"
  }
}
  • Content:
    h1, h2, h3, h4, h5, h6{
        font-family: $font-primary;
        font-size: 1.1em;
        line-height: 1.1;
        font-weight: 400;
        margin: 0;
        margin-bottom: $margin-m;
    
        strong, em, b {
            font-weight: 400;
            font-style: normal;
        }
    }
    
    h1, .h1 { font-size: 2.6em }
    h2, .h2 { font-size: 2.2em }
    h3, .h3 { font-size: 1.8em }
    h4, .h4 { font-size: 1.6em }
    h5, .h5 { font-size: 1.4em }
    
    // @include mediaWQuery($media-query-s) {
    //     h1, .h1 { font-size: 2.6em }
    //     h2, .h2 { font-size: 2.2em }
    //     h3, .h3 { font-size: 1.6em }
    //     h4, .h4 { font-size: 1.4em }
    //     h5, .h5 { font-size: 1.2em }
    // }
    
    @include mediaWQuery($media-query-m) {
        h1, .h1 { font-size: 3em }
        h2, .h2 { font-size: 2.6em }
        h3, .h3 { font-size: 2em }
        h4, .h4 { font-size: 1.7em }
        h5, .h5 { font-size: 1.5em }
    }
    
    
    p + *, address + *, blockquote + *, ul + * { 
        margin-top: 1.5rem;
    }
    
    h1 + *, h2 + *, h3 + *, h4 + *, h5 + *, h6 + * {
        margin-top: 2rem;
    }
    
    h1 + p, 
    h2 + p, 
    h3 + p, 
    h4 + p, 
    h5 + p, 
    h6 + p { 
        margin-top: 0;
    }
  • URL: /components/raw/heading/_heading.scss
  • Filesystem Path: components/04-elements/01-typography/01-heading/_heading.scss
  • Size: 1.1 KB

There are no notes for this item.