-
Notifications
You must be signed in to change notification settings - Fork 584
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
base: master
Are you sure you want to change the base?
Conversation
@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) { |
There was a problem hiding this comment.
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
?
There was a problem hiding this comment.
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:
pxt/teachertool/src/global.scss
Line 144 in 1e22ec7
/**** 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;
}
}
There was a problem hiding this comment.
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?
There was a problem hiding this comment.
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.
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.