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.

Sign up for GitHub

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

Jump to bottom

fix(datepicker): change overlay position strategy so the calendar is kept on-screen #11607

Merged
merged 2 commits into from
Oct 2, 2018
Merged

fix(datepicker): change overlay position strategy so the calendar is kept on-screen #11607

merged 2 commits into from
Oct 2, 2018

Conversation

julianobrasil
Copy link
Contributor

Fixes #6965.

@googlebot googlebot added the cla: yes PR author has agreed to Google's Contributor License Agreement label Jun 1, 2018
@julianobrasil julianobrasil changed the title fix(datepicker): change withPush strategy so the calendar is kept on-screen fix(datepicker): change overlay position strategy so the calendar is kept on-screen Jun 1, 2018
crisbeto
crisbeto reviewed Jun 1, 2018
View reviewed changes
src/lib/datepicker/datepicker.ts Outdated
@@ -445,7 +445,7 @@ export class MatDatepicker<D> implements OnDestroy, CanColor {
.withTransformOriginOn('.mat-datepicker-content')
.withFlexibleDimensions(false)
.withViewportMargin(8)
.withPush(false)
.withPush(true)
Copy link
Member

@crisbeto crisbeto Jun 1, 2018 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This line can be removed altogether since pushing is enabled by default. Also it will keep the datepicker in the viewport if the user tries to scroll away, which we probably don't want. You can enable pushing only for the first positioning by enabling locking using withLockedPosition().

@mmalerba is this something we want enabled on the datepicker?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

My fail. I was looking straight to #6965 and didn't take into account what withPush(true) would really do.

I'll take it away and add withLockedPostion(). It won't change the overall behavior, as the scrolling is locked while the panel is opened.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@crisbeto yep, it looks kinda broken on small screens without this.

@mmalerba mmalerba added pr: lgtm action: merge The PR is ready for merge by the caretaker target: patch This PR is targeted for the next patch release labels Jun 1, 2018
@crisbeto crisbeto added blocked This issue is blocked by some external factor, such as a prerequisite PR and removed action: merge The PR is ready for merge by the caretaker target: patch This PR is targeted for the next patch release labels Jun 4, 2018
@crisbeto
Copy link
Member

crisbeto commented Jun 4, 2018

Marking the PR as blocked for now. Since we had to revert #11421, it means that if we were to enable pushing for the datepicker, it would have the same issue as mat-menu if the user starts scrolling. It can be unblocked once #11628 gets in.

@ngbot
Copy link

ngbot bot commented Jun 7, 2018

Hi @julianobrasil! This PR has merge conflicts due to recent upstream merges.
Please help to unblock it by resolving these conflicts. Thanks!

@julianobrasil
Copy link
Contributor Author

julianobrasil commented Jun 19, 2018 •
edited
Loading

@crisbeto, can we unblock this one as #11365 has already been merged?

[Edited]: Oh, I was misled by #11365 text as it is the similar to #11628 description. Sorry.

@julianobrasil
Copy link
Contributor Author

@crisbeto, can we go on with this PR since #11628 was already merged?

@mmalerba mmalerba added action: merge The PR is ready for merge by the caretaker and removed blocked This issue is blocked by some external factor, such as a prerequisite PR labels Aug 29, 2018
@ngbot
Copy link

ngbot bot commented Aug 29, 2018

I see that you just added the pr: merge ready label, but the following checks are still failing:
    failure missing required label: "target: *"

If you want your PR to be merged, it has to pass all the CI checks.

If you can't get the PR to a green state due to flakes or broken master, please try rebasing to master and/or restarting the CI job. If that fails and you believe that the issue is not due to your change, please contact the caretaker and ask for help.

@mmalerba mmalerba added the target: patch This PR is targeted for the next patch release label Aug 29, 2018
@mmalerba
Copy link
Contributor

@julianobrasil yeah this should be good to go now

@julianobrasil julianobrasil mentioned this pull request Sep 20, 2018
Closed
@vivian-hu-zz vivian-hu-zz merged commit f44d6db into angular:master Oct 2, 2018
@julianobrasil julianobrasil mentioned this pull request Oct 12, 2018
Open
roboshoes pushed a commit to roboshoes/material2 that referenced this pull request Oct 23, 2018
@julianobrasil @roboshoes
fix(datepicker): change overlay position strategy so the calendar is …
bafca42 
…kept on-screen (angular#11607)

* change withPush strategy to true

* address @crisbeto's comment
@angular-automatic-lock-bot
Copy link

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

This action has been performed automatically by a bot.

@angular-automatic-lock-bot angular-automatic-lock-bot bot locked and limited conversation to collaborators Sep 9, 2019
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Reviewers

@crisbeto crisbeto crisbeto left review comments

@mmalerba mmalerba mmalerba approved these changes

@jelbourn jelbourn Awaiting requested review from jelbourn

Assignees
No one assigned
Labels
action: merge The PR is ready for merge by the caretaker cla: yes PR author has agreed to Google's Contributor License Agreement target: patch This PR is targeted for the next patch release
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.

bug(Datepicker): Calendar's position is being switched to upside even when there's no space to fit it
5 participants
@julianobrasil @crisbeto @mmalerba @googlebot @vivian-hu-zz