Deprecated Stack badges on Stack page (Requires deprecated stack at all times) #573
Conversation
KyeMaloy97
changed the title
There was a problem hiding this comment.
Currently, the way you are displaying the message (js alert) on mobile is not working on Firefox and Safari.
It looks good to me, just added some comments for small minor tweaks to make different devices warning message design similar and change the cursor on hover on warning icon in desktop view. It'll be a great addition.
|
|
||
| showDeprecationMessageMobile(e) { | ||
| if (this.isMobileBrowser()) { | ||
| alert(e); |
There was a problem hiding this comment.
I'd recommend not to use alert for the message.
To make the message similar to the desktop view, you can fake the title tooltip behaviour with Javascript. When you click on the icon, the title class can be added and when you'll click anywhere else, then that class should be removed.
You can have a look at this to get the idea: https://stackoverflow.com/questions/12539006/tooltips-for-mobile-browsers
You should implement this for mobile and Ipad screen size as Ipad doesn't have on hover as well.
I think currently you are doing this just for mobile view.
There was a problem hiding this comment.
Have tested on the iOS simulator and it works, not sure if it's an issue with the Safari desktop developer tools.
I think this PR is relatively urgent as there are deprecated stacks live now but no indicator on the website. @neeraj-laad are you happy to merge with the alert and we open a future PR to improve the alert to a tooltip on mobile? This is how the alert looks on mobile right now when you tap the triangle:
…e.deprecationremake
…97/appsody-website into issue.deprecationremake
Checklist
Description
Smaller PR than #548 as this can be merged without the Firefox issue. Will require one stack to be on the site at all times though (in the YAML files).
Functionally adds a badge to deprecated stacks, hovering on desktop shows the message and clicking on mobile opens an alert.
Related Issues
#issue-number