Responsive Typography



  • I was just testing a screen that contained several QList components in a grid.

    As I reduced the size of the screen, the QLists resized accordingly … but none of the text resized at all … even when I reduced the screen width from about 1600 down to about 600.

    Are there no media queries built into the various CSS text classes such as text-h6? I specifically used the Quasar classes thinking that resizing based on media queries would be a built-in … and that it would just work “out of the box”.

    Is there some step I’ve missed during my setup? Or, is it expected that we handle this via our own CSS classes?



  • @digiproduct there is a relevant topic here:

    https://forum.quasar-framework.org/topic/3483/fluid-typography-solved

    Unfortunately Quasar CSS is not a Boostrap CSS. As for now, you’re on your own with specific CSS classes. Well, who knows what the future brings? Maybe there will be a decision to integrate with some part of Boostrap CSS and rename existing parts of Quasars CSS which conflicts with Boostrap CSS? It would allow to automatically convert thousands of Boostrap snippets and themes directly into Quasar?

    I’m glad BTW, that you are digging deeper into CSS in Quasar 🙂



  • Thanks for the link @qyloxe I’ll go and review it right now.

    The Bootstrap team have MANY years experience built-up to draw on … whereas the Quasar team is very small by comparison … so I am amazed and excited by what they have achieved already.

    By comparison, look at the time it took Bootstrap to get from 3 to 4 … in fact, the time it took Bootstrap 4 Alpha to get to release!

    The Quasar team are to be highly commended for their efforts.

    BUT … if I go all-in with Quasar then it’s got to be capable of producing “weapons-grade” real-life web applications to be useful to me … so I’m checking out all the real sort of issues that I’ll have to cope with in real web apps … BEFORE I invest too much time and effort into developing proper systems.

    It’s very easy to be seduce by demos of simple systems … and forget about the more complex edge-cases that are going to suck up your time and effort if they can’t be addressed easily.

    What I’ve seen so far is very, very encouraging … only a few small issues … most of which I can probably easily find a workaround for …

    At the moment, I believe I’m going to become heavily invested in Quasar technology.



  • There are plans afoot for a comprehensive overhaul of Quasar’s responsiveness … and the team are looking for feedback about their plans …

    Head across to the Github page and leave your comments about their plans …

    https://github.com/quasarframework/quasar/issues/4274

    It certainly sounds as though the team are giving this matter very serious consideration and trying to provide us with the best possible solution …

    Others more knowledgeable than me should pitch in a give their feedback to assist the team on finalizing their plans …


Log in to reply