Make App Responsive to work on Mobile Phones.

[yashchaudhari008]

Make App Responsive to work on Mobile Phones.

[Kyaw-Min-lwin]

Ok, thanks this makes it quite clear.

[yashchaudhari008]

Check https://www.w3schools.com/howto/howto_js_topnav_responsive.asp , can you make all buttons appear in dropdown when user click the button?

[yashchaudhari008]

Only for buttons

[yashchaudhari008]

No need to worry.

Few Changes Required:-

1. Options button should hide on desktop.
2. Hovering over submenu should change background color (like buttons).
3. Window should fully fit on mobile screen(without any scrollbars).

[yashchaudhari008]

Okay, if first two changes are done you can send a PR so i can investigate further.

[Kyaw-Min-lwin]

Can I work on this?

[yashchaudhari008]

Can I work on this?

Sure, keep me updated.

[Kyaw-Min-lwin]

I am not sure, I am finished yet, but it looks quite responsive. Can I have your feedback on the design? Should I host the branch I am working on, so it is easier for you to review the changes?

[yashchaudhari008]

@Kyaw-Min-lwin Share the screenshot here. I will follow up👍
Also i will check your forked repository from your profile if you want, no need to host.

[Kyaw-Min-lwin]

Ok @yashchaudhari008

Would like your feedback.

[yashchaudhari008]

I am expecting something like this.
Also you can hide that instructions "q and a to change pen size" as they are mean only for PC users.

[Kyaw-Min-lwin]

Hey, how is this? @yashchaudhari008

[Kyaw-Min-lwin]

@yashchaudhari008 Should I make it so that all of the buttons, color selection box, and the pen size only show up when the user clicks a dropdown, or is it only for the buttons.

[yashchaudhari008]

Also make sure that footer is visible and canvas is properly scaled on mobile displays.

[Kyaw-Min-lwin]

@yashchaudhari008

Also make sure that footer is visible and canvas is properly scaled on mobile displays.

The user needs to scroll down a little for them to see the footer.


What do you think of the dropdown? Also, can you help me with the color changer.? I would like the input to be in the related p tag so it looks nicer. Should I change the canvas height so that it fits in the screen and the user doesn't have to scroll.

[Kyaw-Min-lwin]

@yashchaudhari008 is there anyone working on this other than me. Should I be worried about the other issues(others r working on) will it affect me. Sry this is my first time contributing to open source.

[Kyaw-Min-lwin]

I have hidden the options button on desktop. I also added the hover(U need to either resize the browser or the inspect bar, using the toggle inspect toolbar doesn't show you the hover even on the color select thing.) I will need help with the third one. I can't use css because the browser is automatically applying the height n width to the canvas tag. This is probably due to the js.

[Kyaw-Min-lwin]

@yashchaudhari008 I have made some changes, what do you think?