Request: Constant Calendar Height

[jherdman]

When using the nav to cycle through months, the height of the calendar changes depending on how long or short the month is — this can be seen using the nav demo and looking at the months of July and August, which I've pasted below for posterity:

When used in ember-power-datepicker, and the widget is above the trigger, this means the navigation buttons jump up and down as you cycle through months causing mis-clicks and frustration.

I'd like to request that a flag, or feature, be implemented such that the calendar's height never changes. Other date pickers, such as pickadate implement this by having a constant number of weeks displayed (i.e. 6).

[cibernox]

Interesting case. Sounds kind of reasonable, although that might mean that in some edge cases when February starts on a Monday you might have display two "empty" weeks of March.

Did I get this right?

[cibernox]

I might also consider fix this in the datepicker itself by making the dropdown that contains the calendar have a fixed height so the calendar is always on the top. Not sure yet what is better.

[jherdman]

Yup! That's exactly right.

[cibernox]

@jherdman btw, that second fix I mention you can do it yourself on your app, you don't have to wait for me. You can add those styles:

.ember-power-datepicker-content.ember-basic-dropdown-content--above {
  min-height: enough-height-for-6-weeks;
}

Let me know hot this "looks". I haven't tried it, perhaps it looks odd.

[jherdman]

It looks pretty okay:

It's definitely a good enough solution for now. Many thanks!

[jherdman]

It does seem to jump upon first click of the months:

[Skgtouch]

Facing exactly the same issue.

.ember-power-datepicker-content.ember-basic-dropdown-content--above { min-height: enough-height-for-6-weeks; }

The fix mentioned above worked well but if there are only 4 or 5 weeks then there is a gap at the bottom of the calendar which doesn't look good.

Please provide any cleaner approach or solution if possible.

Thanks