[0.15.x] How to change heading font-size?

  • The headings h1…h4 are a way to big in my opinion. How or there should I change them?

  • use p and set font-size instead ?

  • Is there no possibility to decrease font size of h1…h3 globally?
    I don’t want to use <p class=“h1”> everythere and add font size, weight and margin like it should be on heading.

    How can I overwrite this basic stylus settings for font-size of headings?

  • I read in the source code and I think now it’s not possible easily.
    in the quasar-framework/src/css/core.variables.styl there’s a variable $headings with the style for each (display-4, display-3, …, caption)
    But there’s no stylus variable for the size.

    Maybe in the future we can have stylus variables like that : $display-1-size, etc…
    @rstoenescu : What do you think about adding these stylus variables ?

  • Is it possible to do this in v1? I tried this in quasar.variables.styl but it threw build errors. How would I achieve this?

    $headings.h2 = {
        size: 2rem,
        line-height: 2rem,
        weight: 300,
        letter-spacing: -.01562em

  • Looks like you can do this in /src/css/app.style. I’m using Quasar 1.0.

    h1 { font-size: 3em; }

Log in to reply