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

[ipad] Fix unreachable content on scroll #10199

Open
wants to merge 1 commit into
base: master
Choose a base branch
from
Open

Conversation

kimprice
Copy link
Contributor

Fixes microsoft/pxt-microbit#5706

Upload target: https://makecode.microbit.org/app/85162957a6b556f452ce00deebb0d4425fb22de7-7f0c9fae0c--eval

Note: the behavior is different when using the dev tools to simulate an ipad. To see the true behavior, try the upload target on an actual ipad.

@kimprice kimprice requested a review from a team September 23, 2024 18:24
@riknoll
Copy link
Member

riknoll commented Sep 23, 2024

@kimprice if you have access to a mac, you can also use the xcode ipad simulator to test bugs like this! works well if you don't happen to have an ipad (as i do not)

}

/* Styles for iPads (portrait mode) */
@media (min-width: 768px) and (max-width: 1024px) and (orientation: portrait) {
Copy link
Member

Choose a reason for hiding this comment

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

where did these numbers come from? is this something that couldn't be done using the breakpoints in react-common-breakpoints.less?

Copy link
Contributor

Choose a reason for hiding this comment

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

Teacher tool defines a set of breakpoints that mirrors react-common's, with a few added. Please use them:

/**** BREAKPOINT QUERIES *****/

Teacher tool doesn't have orientation breaks defined. Does react-common have these available? If not that would something useful to add (either in react-common or here in teacher tool). Something like:

.landscape-only {
    display: initial;
}
.portrait-only {
    display: initial;
}
@media (orentation: landscape) {
    .portrait-only {
        display: none !important;
    }
}
@media (orientation: portrait) {
    .landscape-only {
        display: none !important;
    }
}

Copy link
Contributor Author

Choose a reason for hiding this comment

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

I found the numbers on a stack overflow post although I can't find the exact post now... I think I could use the breakpoints in react-common-breakpoints.less for portrait view but I don't see the same dimensions for landscape. Should I add them?

Copy link
Contributor

Choose a reason for hiding this comment

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

@kimprice in case it got missed... I made a suggestion for integrating the orientation breakpoints.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

[iPad] Teacher Tools: Cannot show complete bottom content on iPad
3 participants