Calendar, show more than 3 months in different rows

[labby]

As I posted this in discussion, hoped to find a solution, I now link to this, image is included:
#3314

[labby]

No reaction yet?
Do I have to add something, answer additional questions or is it just a matter of time within Dev-Team?
Any answer appreciated.

[lubber-de]

The internally used grid responsiveness does not work, even if I remove the fixed 100% width . The grid is flex so it should wrap automatically.... Will try to look into that tonight.

[labby]

Thanks a lot. I really appreciate your work.

[labby]

I don't want to annoy you, but did you find anything wrong?

[lubber-de]

@labby Here is an example how to make the multimonth calendars wrap according to screenwidth. You just need to add a little CSS snippet to your existing code and add the "wrapping" class to your calendar node.
I need to optimize the whole example and do more testing to put it into the FUI Core as a new wrapping calendar variant. But i hope this already helps you out.

https://jsfiddle.net/lubber/xa4epqbm/5/

      .ui.wrapping.calendar .ui.popup {
          box-shadow: none;
          background: transparent;
      }

      .ui.wrapping.calendar .ui.popup > .ui.ui.grid {
          white-space: unset;
          margin-left: 0;
          padding-top: 1em;
      }

      .ui.wrapping.calendar .ui.popup > .ui.grid > .column:first-child .ui.table {
          margin-left: -1em;
      }
      .ui.wrapping.calendar .ui.popup > .ui.grid > .column {
          padding-top: 0;
          padding-bottom: 0;
      }

[labby]

Oh, thanks a lot.
I will try to use it, and hope for the best result :-)

Will it be part of the current svn and upcoming release?

[lubber-de]

Will it be part of the current svn and upcoming release?

I'll prepare a PR once i am satisfied 😉

[labby]

That's fine with me.
In the meantime I managed to get it work for me as I wanted :-)
Many thanks again.