fix date picker localizations #968
Conversation
|
Looking cool |
| const monthAbbrs = getMonthNames(languageData); | ||
| const dayAbbrs = getDayAbbrvs(languageData); | ||
| $.datepicker.regional[`${language}`] = { | ||
| monthNames: monthAbbrs, |
There was a problem hiding this comment.
I like the "showOtherMonths: true" option, which makes it similar to the older one
There was a problem hiding this comment.
Size is a little odd on the month names
September got cut
Also, when we switch to a month with more days, it covers the input we were going to choose
Wonder if there's a setting for this
There was a problem hiding this comment.
Some people suggest having a fixed height, but that can leave an empty row in some months.
The native datepicker solves that by having the days from the other months fill up even new rows to always have the 6 rows
There was a problem hiding this comment.
There is no property exposed to set the constant rows (6 in our case)
As you mentioned, people suggesting to have a fixed height
What you say? can we go with fixed height?
There was a problem hiding this comment.
I think the fixed height is ok. There might be a way to adjust the other height proportions so it doesn't look too bad.
Also, have you seen https://www.npmjs.com/package/js-datepicker?
I was looking at alternatives, and I think it looks nicer visually that jquery's 😅
The native datepicker is very slick and nice, but the jquery one looks a bit dated, like older web stuff.
There was a problem hiding this comment.
Okay, So can we switch to this suggested npm package, did you had a check whether it covers all our requirement ? If yes and all good, I am fine to move to this npm package instead of jquery-ui datepicker
There was a problem hiding this comment.
Yes, it can be translated and looks simple enough to replace the colors afterwards.
|
Some customization tips for the style of the datepicker to get it to fit more into the tool: Consider using the preferences font in the date picker as well Very bad mockup I reduced the width of the year, added a left margin, then increased the width of the month. If there's a way to make the column sizes consistent, it'd be good. The left and right buttons are also moving up a little when we hover them, which is a little weird. Reducing the width of the preferences page broke the page. I think the width of the date field is much bigger than it needs to be The behavior of the feature is great, just tested changing the languages and it switches the datepicker even without saving. |
thamara
added
the
needs-adjustments
Related issue
Closes #949
Context / Background
The date picker isn't localized, always sticking with language English.
What change is being introduced by this PR?
This PR will introduce localized date picker in preferences window alone - Later this change will be incorporated to other date picker available across in the tool.
I'm using the existing translations available for Month names and week days name, so no new translations are needed, and also it cuts off our dependency on dealing with jquery-ui translation library.
Changing the language preference to Espanol
Before change
After change
How will this be tested?
The language change in preference window should load their locale specific date picker.