DatePicker width and alignment about react-widgets

[jquense]

Hi there,

Thanks for taking the time to submit to submit this. I do need to come up with a better solution for the calendar width, but unfortunately making it the width of the popup is doesn't address of the issues. On pickers that are small the calendar would be unreadable. I am not sure why you are getting a scroll bar on the footer but I will look into that. If you can figure out the magic css combination to make width: auto work on the dropdown calendar, i'd be open to that change.

I am also happy with the way the numbers are aligned, Generally aligning numbers center doesn't read very well especially if you change the format of the numbers so they are not all the same size (digit wise).

In general the react-widgets styles are very minimal and not really meant to be used as a theme, but as a fairly neutral starting point to lay themes on top of. To that end you are definately encouraged to make whatever stylistic changes you want for your own projects :) The provided less files should make that really simple

[ferrannp]

Hello,

I understand your point. Thank you for your response! So at the end, in my code I did this:

  .rw-popup-container.rw-calendar-popup {
    min-width: 200px;
    width: auto;
    left: -11px; //-10px - @input-border-width; (from react-widgets less)
    right: -11px; //-10px - @input-border-width; (from react-widgets less)
  }

instead of:

  .rw-popup-container.rw-calendar-popup {
    right: auto;
    widht: 200px;
  }

I don't use @input-border-width; directly because I am using SASS.

[jquense]

I've changed the default width to be 18em which should give it more room, and made sure the footer will at least break to another line instead of overflowing. This doesn't necessarily affect you if you're happy with your tweaks, but just an FYI