No More Posting New Topics!

If you have a question or an issue, please start a thread in our Github Discussions Forum.
This forum is closed for new threads/ topics.

Navigation

    Quasar Framework

    • Login
    • Search
    • Categories
    • Recent
    • Tags
    • Popular
    • Users
    • Groups
    • Search

    Global base font size stylus variable

    Framework
    1
    1
    715
    Loading More Posts
    • Oldest to Newest
    • Newest to Oldest
    • Most Votes
    Reply
    • Reply as topic
    Log in to reply
    This topic has been deleted. Only users with topic management privileges can see it.
    • labs20
      labs20 last edited by labs20

      Hi.

      While working on our project here, it came up the need to test it with different font sizes to check witch we’ll choose to deploy with.

      I’ve looked up for some $base_font_factor = 1 stylus variable and could not found anything like that.

      Then I’ve came out with this @quasar.variables.styl:

      $percent_increase = 0.15
      calc(size)
        size + (size*$percent_increase)
      
      // Classes afetadas
      $body-font-size          = calc(14px)
      $button-font-size        = calc(14px)
      $toolbar-title-font-size = calc(21px)
      $tooltip-fontsize        = calc(10px)
      $input-font-size         = calc(14px)
      ...
      

      It’s working ok and I can change (almost) all of my font sizes by some percent factor.

      The only catch here is the “almost”, because there are some classes that are not changed by stylus variables, like:

      .q-table tbody td {
        font-size: 13px;
      }
      

      So… how can I apply the same percent factor on those missing classes?

      And… wouldn’t be a nice thing implement this kind of feature right into quasar?

      Thanks for any help, and for this great framework.

      1 Reply Last reply Reply Quote 1
      • First post
        Last post