Skip to content

rafactor from html4 to html5#4655

Merged
walterbender merged 5 commits intosugarlabs:masterfrom
TanmayBansa1:port-from-htmlv4-to-v5
Apr 28, 2025
Merged

rafactor from html4 to html5#4655
walterbender merged 5 commits intosugarlabs:masterfrom
TanmayBansa1:port-from-htmlv4-to-v5

Conversation

@TanmayBansa1
Copy link
Contributor

name: refactor from html v4 to v5

about: issue #4641

Description

This PR refactors the project's outdated html v4 to html v5 with all the correct semantic tags, removes duplicate entries for links, title, meta tags and ids previously present.

After

image

Related Issue

fixes #4641

Changes Made

  • added relevant semantic tags, like header, nav, footer
  • removed duplicate ids from the codebase, specifically "save" and "audio"
  • removed duplicate title, meta, and link tags
  • moved all the scripts to the bottom of the file as standard for HTML5

Checklist

  • I have tested these changes locally and they work as expected.
  • I have followed the project's coding style guidelines.
  • I have addressed the code review feedback from previous PRs raised for this, if applicable.
  • Verified with W3TC HTML5 validator
  • Ran all tests using npm run test'

Thank you for contributing to our project! We appreciate your help in improving it.

📚 See contributing instructions.

🙋🏾🙋🏼 Questions: Community Matrix Server.

@github-actions
Copy link
Contributor

✅ All Jest tests passed! This PR is ready to merge.

@walterbender
Copy link
Member

This looks good. I just see one issue -- haven't looked into the root cause -- in that the piemenu is appearing on the bottom-left corner of the screen. It should be hidden.

Screenshot From 2025-04-27 13-26-14

@github-actions
Copy link
Contributor

✅ All Jest tests passed! This PR is ready to merge.

@github-actions
Copy link
Contributor

✅ All Jest tests passed! This PR is ready to merge.

@TanmayBansa1
Copy link
Contributor Author

@walterbender fixed it

@walterbender
Copy link
Member

walterbender commented Apr 27, 2025

Noticed one other issue. When you open-then-close the aux menu, the canvas is not sized properly.
Screenshot From 2025-04-27 15-22-52

@TanmayBansa1
Copy link
Contributor Author

@walterbender this seems to be some weird issue, where there is a slight difference in how the tag is handled in html4 vs html5. I am working on a fix tho, will update as soon as possible.

@github-actions
Copy link
Contributor

✅ All Jest tests passed! This PR is ready to merge.

@TanmayBansa1
Copy link
Contributor Author

restructured a bit, the aux menu works fine now.

@Ubayed-Bin-Sufian
Copy link
Contributor

@FirePheonix ive raised a PR, yes it does improve performance, the loading times are much lesser now.

Glad to see improvement in performance and loading times. Please provide a comparison between the loading times of the current master branch and the branch created by you.

@TanmayBansa1
Copy link
Contributor Author

Since this is a very lightweight web app, there is not a significant improvement in usual performance, but on the initial load time, there is a 1-1.5 second difference for a first time user, visible from the naked eye.

@walterbender
Copy link
Member

Works well. Thx.

@walterbender walterbender merged commit d93fa9c into sugarlabs:master Apr 28, 2025
5 checks passed
@TanmayBansa1
Copy link
Contributor Author

Works well. Thx.

My pleasure

sa-fw-an pushed a commit to sa-fw-an/musicblocks that referenced this pull request Apr 29, 2025
* rafactor from html4 to html5

* fixed wheelDiv's visibility

* fixed the auxillary menu problem
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.

Refactor index.html from HTML4 to HTML5

3 participants