Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Broken DatePicker #1722

Closed
yulric opened this issue Sep 25, 2015 · 8 comments
Closed

Broken DatePicker #1722

yulric opened this issue Sep 25, 2015 · 8 comments
Labels
component: date picker This is the name of the generic UI component, not the React module! component: pickers This is the name of the generic UI component, not the React module!

Comments

@yulric
Copy link
Contributor

yulric commented Sep 25, 2015

Hi there,

I'm currently having an issue with the DatePicker. I have a simple layout with a DatePicker nested within a div and when I click on the the TextField, although the DatePicker show up it is missing the Calendar and is not set up right. Here's a screenshot of the issue.

screen shot 2015-09-25 at 11 47 44 am

The version I am running are:
material-ui: 0.11.1
react: 0.14.0-rc1
react-tap-event-plugin: 0.2.0

This is on chrome by the way. Thanks.

@yulric
Copy link
Contributor Author

yulric commented Sep 25, 2015

So taking a closer look at it, the DateDisplay component in the Calendar had a height set to 100% which was pushing the remainder of the calendar to the bottom. I'm not sure why it's happening but I'll update if I find the source of the problem.

@yulric
Copy link
Contributor Author

yulric commented Sep 25, 2015

Line 98 in calendar.jsx. 100% should be replaced by 64. So the dateDisplay style object should be,

dateDisplay: {
  width: isLandscape ? 120 : '',
  height: isLandscape ?
    weekCount === 5 ? 238 :
    weekCount === 6 ? 278 : 
    198 : 64,
  float: isLandscape ? 'left' : 'none',
}

@CuthbertJungle
Copy link

I'm seeing the same effect in the timepicker

@shaurya947
Copy link
Contributor

PRs welcome :-)

@yulric
Copy link
Contributor Author

yulric commented Sep 25, 2015

Cool, I'll try to get one in during the weekend.

yulric added a commit to yulric/material-ui that referenced this issue Sep 25, 2015
@yulric
Copy link
Contributor Author

yulric commented Sep 27, 2015

Fixed in PR #1726. This PR also fixes the TimePicker issue that CuthbertJungle was having.

yulric added a commit to yulric/material-ui that referenced this issue Oct 3, 2015
yulric added a commit to yulric/material-ui that referenced this issue Oct 5, 2015
yulric added a commit to yulric/material-ui that referenced this issue Oct 7, 2015
yulric added a commit to yulric/material-ui that referenced this issue Oct 7, 2015
@yulric
Copy link
Contributor Author

yulric commented Oct 7, 2015

@shaurya947 This can be merged also I think

chrismcv pushed a commit to chrismcv/material-ui that referenced this issue Oct 13, 2015
chrismcv pushed a commit to chrismcv/material-ui that referenced this issue Oct 13, 2015
yulric added a commit to yulric/material-ui that referenced this issue Oct 22, 2015
@oliviertassinari
Copy link
Member

@yulric You are not the only one to have this issue.
It was fixed by adding the missing <!DOCTYPE html>.
I'm closing the issue.

@zannager zannager added component: date picker This is the name of the generic UI component, not the React module! component: pickers This is the name of the generic UI component, not the React module! labels Dec 22, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
component: date picker This is the name of the generic UI component, not the React module! component: pickers This is the name of the generic UI component, not the React module!
Projects
None yet
Development

No branches or pull requests

5 participants