Skip to content

Code quality improvements: fix HTML validation, enhance accessibility, refactor JavaScript #7

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.

Sign up for GitHub

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

Draft
Copilot wants to merge 5 commits into
base: main
Choose a base branch
from
Draft

Code quality improvements: fix HTML validation, enhance accessibility, refactor JavaScript #7

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
490a7d0
Initial plan
Copilot Oct 31, 2025
8f0be83
Fix HTML validation errors and improve accessibility
Copilot Oct 31, 2025
f640620
Refactor JavaScript: eliminate duplication, add JSDoc, improve code q…
Copilot Oct 31, 2025
3d1567b
Fix CSS redundancy and add button reset styles for mobile menu
Copilot Oct 31, 2025
bf592eb
Improve function naming based on code review feedback
Copilot Oct 31, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
25 changes: 25 additions & 0 deletions .gitignore
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,25 @@
# Operating System Files
.DS_Store
Thumbs.db

# Editor Files
.vscode/
.idea/
*.swp
*.swo
*~

# Temporary Files
*.tmp
*.temp
.cache/

# Logs
*.log
npm-debug.log*
yarn-debug.log*
yarn-error.log*

# Build outputs (if any build process is added later)
dist/
build/
66 changes: 30 additions & 36 deletions index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -20,28 +20,28 @@
<div class="main-header__logo-img-cont">
<img
src="https://d33wubrfki0l68.cloudfront.net/32c48e23e828c42a99a37db81e2a91d7c8eed4de/d134a/assets/png/ram-maheshwari.png"
alt="logo Image" class="main-header__logo-img" />
alt="John Anderson Profile" class="main-header__logo-img" />
</div>
<h4 class="main-header__logo-text">John Anderson</h4>
</div>
<nav class="main-header__navigation">
<nav class="main-header__navigation" aria-label="Main navigation">
<ul class="main-header__navigation-links">
<li class="main-header__navigation-link"><a href="./index.html"> Home </a></li>
<li class="main-header__navigation-link"><a href="./index.html#about"> About </a></li>
<li class="main-header__navigation-link">
<a href="./index.html#projects"> Projects </a>
</li>
<li class="main-header__navigation-link"><a href="./index.html#contact" href=""> Contact </a></li>
<li class="main-header__navigation-link"><a href="./index.html#contact"> Contact </a></li>
</ul>
</nav>
<div class="main-header__sm-scr-nav-btn">
<button class="main-header__sm-scr-nav-btn" aria-label="Open mobile menu" aria-expanded="false">
<div class="main-header__sm-scr-nav-btn-line"></div>
<div class="main-header__sm-scr-nav-btn-line"></div>
</div>
<div class="main-header__sm-menu">
<div class="main-header__sm-menu-close">

</div>
</button>
<div class="main-header__sm-menu" role="dialog" aria-label="Mobile navigation menu">
<button class="main-header__sm-menu-close" aria-label="Close mobile menu">
✕
</button>
<ul class="main-header__sm-menu-links">
<li>
<a class="main-header__sm-menu-link main-header__sm-menu-link--1" name="home-hero">Home</a>
Expand Down Expand Up @@ -89,6 +89,7 @@ <h2 class="heading-secondary projects__heading-secondary">
<span class="heading-secondary__sm"> About 🦄</span>
<span class="heading-secondary__main">
Here you will find more information about me, what I do, and list of my current skills in programming
</span>
</h2>
<div class="main-section__content">
<div class="about__info">
Expand Down Expand Up @@ -134,13 +135,6 @@ <h3 class="heading-quaternary about__heading-quaternary">
<li class="about__skill">git</li>
<li class="about__skill">vscode</li>
<li class="about__skill">linux</li>
<li class="about__skill">react</li>
<li class="about__skill">node</li>
<li class="about__skill">git</li>
<li class="about__skill">vscode</li>
<li class="about__skill">linux</li>
<li class="about__skill">javascript</li>
<li class="about__skill">react</li>
</ul>
</div>
</div>
Expand Down Expand Up @@ -197,7 +191,7 @@ <h2 class="heading-secondary projects__heading-secondary">
</div>
<div class="projects__list-item-details">
<div class="projects__list-item-img-cont">
<img src="./assets/mock.png" alt="Project Image" class="projects__list-item-img" />
<img src="./assets/mock.png" alt="Project screenshot" class="projects__list-item-img" />
</div>
<h3 class="heading-tertiary projects__list-item-heading-tertiary">
Project Name
Expand Down Expand Up @@ -227,7 +221,7 @@ <h3 class="heading-tertiary projects__list-item-heading-tertiary">
<div class="projects__list-item projects__list-item--inv">
<div class="projects__list-item-details">
<div class="projects__list-item-img-cont">
<img src="./assets/mock.png" alt="Project Image" class="projects__list-item-img" />
<img src="./assets/mock.png" alt="Project screenshot" class="projects__list-item-img" />
</div>
<h3 class="heading-tertiary projects__list-item-heading-tertiary">
Project Name
Expand Down Expand Up @@ -267,7 +261,7 @@ <h3 class="heading-tertiary projects__list-item-heading-tertiary">
</div>
<div class="projects__list-item-details">
<div class="projects__list-item-img-cont">
<img src="./assets/mock.png" alt="Project Image" class="projects__list-item-img" />
<img src="./assets/mock.png" alt="Project screenshot" class="projects__list-item-img" />
</div>
<h3 class="heading-tertiary projects__list-item-heading-tertiary">
Project Name
Expand Down Expand Up @@ -297,7 +291,7 @@ <h3 class="heading-tertiary projects__list-item-heading-tertiary">
<div class="projects__list-item projects__list-item--inv">
<div class="projects__list-item-details">
<div class="projects__list-item-img-cont">
<img src="./assets/mock.png" alt="Project Image" class="projects__list-item-img" />
<img src="./assets/mock.png" alt="Project screenshot" class="projects__list-item-img" />
</div>
<h3 class="heading-tertiary projects__list-item-heading-tertiary">
Project Name
Expand Down Expand Up @@ -346,16 +340,16 @@ <h2 class="heading-secondary">
<form class="contact__form">
<div class="contact__form-field">
<label for="name" class="contact__form-field-label">Name</label>
<input placeholder="Enter Your Name" type="text" class="contact__form-field-input" />
<input id="name" name="name" placeholder="Enter Your Name" type="text" class="contact__form-field-input" required />
</div>
<div class="contact__form-field">
<label for="name" class="contact__form-field-label">Email</label>
<input placeholder="Enter Your Email" type="text" class="contact__form-field-input" />
<label for="email" class="contact__form-field-label">Email</label>
<input id="email" name="email" placeholder="Enter Your Email" type="email" class="contact__form-field-input" required />
</div>
<div class="contact__form-field">
<label for="name" class="contact__form-field-label">Message</label>
<textarea placeholder="Enter Your Message" name="message" id="" cols="30" rows="10"
class="contact__form-field-input"></textarea>
<label for="message" class="contact__form-field-label">Message</label>
<textarea id="message" placeholder="Enter Your Message" name="message" cols="30" rows="10"
class="contact__form-field-input" required></textarea>
</div>
<button type="submit" class="contact__form-submit">Submit</button>
</form>
Expand Down Expand Up @@ -383,24 +377,24 @@ <h2 class="heading-secondary">
</ul>
<div class="main-footer__mid-line"></div>
<div class="main-footer__socials">
<a href="#" class="main-footer__social-link">
<a href="#" class="main-footer__social-link" aria-label="GitHub profile">
<img
src="https://d33wubrfki0l68.cloudfront.net/5557d5a11584d7201a38ee1a95200f57a4cc0f88/15085/assets/png/github-ico.png"
alt="" class="main-footer__social-link-icon" />
alt="GitHub" class="main-footer__social-link-icon" />
</a>
<a href="#" class="main-footer__social-link">
<img src="./assets/icons8-instagram-48.png" alt="" class="main-footer__social-link-icon" />
<a href="#" class="main-footer__social-link" aria-label="Instagram profile">
<img src="./assets/icons8-instagram-48.png" alt="Instagram" class="main-footer__social-link-icon" />
</a>
<a href="#" class="main-footer__social-link">
<img src="./assets/icons8-twitter-50.png" alt="" class="main-footer__social-link-icon" />
<a href="#" class="main-footer__social-link" aria-label="Twitter profile">
<img src="./assets/icons8-twitter-50.png" alt="Twitter" class="main-footer__social-link-icon" />
</a>
<a href="#" class="main-footer__social-link">
<a href="#" class="main-footer__social-link" aria-label="LinkedIn profile">
<img
src="https://d33wubrfki0l68.cloudfront.net/7f29579dde49e02480372aa49f7189c5536b0118/34b92/assets/png/linkedin-ico.png"
alt="" class="main-footer__social-link-icon" />
alt="LinkedIn" class="main-footer__social-link-icon" />
</a>
<a href="#" class="main-footer__social-link">
<img src="./assets/icons8-pinterest-64.png" alt="" class="main-footer__social-link-icon" />
<a href="#" class="main-footer__social-link" aria-label="Pinterest profile">
<img src="./assets/icons8-pinterest-64.png" alt="Pinterest" class="main-footer__social-link-icon" />
</a>
</div>
</div>
Expand Down
Loading