Custom sizing of qDate component

  • Hello,

    First of all - the qDate feature with range-selector is awesome and arrived just as I’m about to do a release of my project.

    One thing though that has been bugging me, is the size of the qDate-element. The default is too big for my project.

    I’ve tried :
    Putting it as a child of a parent div with a set width and height.
    Adding a style to the qDate element itself
    Played around in chrome devtools to change style of the quasar elements

    My code looks like this, nothing fancy :
    <div class=“q-pb-sm”>
    {{ $t(‘reportsPageMessages.reportsPageDateRangePicker’) }}

              <div style="width:300px;height:400px;">

    And the end-result looks like this :

    Screenshot 2020-08-25 at 16.27.21.png

    Feels like I’m missing something simple here, but spent enough time already on it. So I’m turning towards someone more experienced with this framework.

    Thanks in advance

  • I would like to have an option :width="" and :heigh="" too

Log in to reply