Materialize: FeatureDiscovery doesn't align to the bottom on mobile devices (v0.98.1)

[ghost]

Description

The FeatureDiscovery function does algin on Desktop/Laptop but not on mobile devices.

Repro Steps

Open http://materializecss.com/feature-discovery.html and click on OPEN TAP TARGET
Now try again on Android phone (Not sure about iPhones bahh)

Screenshots / Codepen

PC:

Android:

[ghost]

Landscape mode seems to align it correctly except for the title and the text.

[DanielRuf]

related, fixed width and height for all views under 600px

[myrp-leonardo]

@DanielRuf @CodeSurfing145 @fega

Fixed here https://github.com/Dogfalo/materialize/issues/4378

[DanielRuf]

This does not fix it, still the same since the last build https://github.com/Dogfalo/materialize/commit/0407ee5352271de822cade662353319f6eebe5c8

Also the 600px value seems problematic.

[DanielRuf]

Open it in desktop and resize the window to a lower screen width

[DanielRuf]

Directly opened in small view

[DanielRuf]

Different behaviour if you start opened or closed.

[acburst]

It looks like you are viewing the current site right? This issue has been fixed but is not in the current release. It won't show up in the actual site until we release a new version.

[DanielRuf]

It looks like you are viewing the current site right? This issue has been fixed but is not in the current release. It won't show up in the actual site until we release a new version

Steps to reproduce:

• open the website in normal desktop / full width
• click the open button
• resize the window
  and
• open the website in small mobile view
• click the open button
• resize the window

[acburst]

The website version is hosted on a different branch (gh-pages). So those compiled files will still be the old versions.

[tomscholz]

@DanielRuf We use the gh-pages branch for github pages hosting. With every version bump, we merge the master into the gh-pages branch. Prove here

[myrp-leonardo]

@acburst is right

@DanielRuf I agree that 600px maybe be problematic, but works for now :(

@DanielRuf if you want to test the fix, you can use the chrome emulation for devices, please include this css before:

@media only screen and (max-width: 600px) {
  .tap-target, .tap-target-wrapper {
    width: 600px;
    height: 600px;
  }

[DanielRuf]

The website version is hosted on a different branch (gh-pages). So those compiled files will still be the old versions.

Ok but why not switch to the master branch for the page like @tomscholz recommended?

I agree that 600px maybe be problematic, but works for now :(

At least still issues on smaller screens? Ok.

[DanielRuf]

Switching portrait / landscape

And the code is applied =)

It happens when you switch from a view width <= 600px to a view width > 600px and vice versa ;-)

Many iPhone users can reproduce this http://viewportsizes.com/?filter=iPhone

[tomscholz]

Ok but why not switch to the master branch for the page like @tomscholz recommended?

@DanielRuf No, I never said that. I just meant, that the fix is working when you have a look at the master branch and to illustrate that, I used rawgit.com. That isn't a good idea at all, because then everyone would see the docs that are incomplete. Do you understand where I'm getting with this?

[DanielRuf]

Ok but why not switch to the master branch for the page like @tomscholz recommended?
@DanielRuf No, I never said that. I just meant, that the fix is working when you have a look at the master branch and to illustrate that, I used rawgit.com. That isn't a good idea at all, because then everyone would see the docs that are incomplete. Do you understand where I'm getting with this?

Ok, understood.
Right but there is still the illustrated issue, even on the master branch.
It was just a CSS fix.

[acburst]

You always want some separation between code commits and the production site. Otherwise the site would break all the time.

[myrp-leonardo]

@acburst I fixed the issue reported by @DanielRuf above

Thanks for catching

[DanielRuf]

@acburst I fixed the issue reported by @DanielRuf above

Thanks for catching

Yep, fixed. Thanks.
You are welcome.

At the beginning I thought you fixed this and then saw that it was an extra bug that I found and I might have been a bit unclear (could have communicated it better) and we talked past each other :D

[acburst]

Merged