react-datepicker2 icon indicating copy to clipboard operation
react-datepicker2 copied to clipboard

mobile-friendly css

Open alidehghan opened this issue 5 years ago • 5 comments

css used is not quite mobile-friendly, and positioning doesn't work properly. please take a look at this ScreenShot.

alidehghan avatar Dec 10 '19 07:12 alidehghan

I guess it is related to tether config

alidehghan avatar Dec 10 '19 08:12 alidehghan

@alidehghan I think so. I think managing the keyboard display on mobile screens is the first step.

mberneti avatar Dec 10 '19 13:12 mberneti

I think it would be so good if you can provide a prop on size (e.g. xs, md, lg based on bootstrap standards, or even exact size: 12, 24, 36, etc.) to provide a better look at mobiles, or when this control placed at top of the page and calendar drops up (and part of control hides. like at screenshot). this issue occurs even in screens (not only mobiles).

Many thanks

alidehghan avatar Dec 25 '19 07:12 alidehghan

@alidehghan It is a good idea, I'll work on it over the weekend.

mberneti avatar Dec 28 '19 15:12 mberneti

Hi, I still face some issue with the tether element falls out of the window even in desktop mode. https://pasteboard.co/JCBXGQF.png I look at some of the code and tether document and I check out the constraint property of tether component with attachment defined as together

Constraints allow you to control what happens when the tethered element would have to fall outside of a defined region to maintain the attachment.

You might want to allow the element to change its attachment, if doing so would keep more of it within its assigned region

By adding the pin option as true we can have the element more visible than going off-screen like this, I see this problem a lot in my new project cause I have many date inputs, at least I suggest adding this as an option. bitwise I can add this as a pull request.

mashouf avatar Nov 29 '20 14:11 mashouf