Page MenuHomePhabricator

Add GitHub Repository Link
Closed, ResolvedPublic

Description

Title: Add GitHub Link to WebApp

Description: Insert link to GitHub repo in header or footer.

Domain: Design (Frontend)

Difficulty: Beginner

Steps:

  1. Add GitHub icon.
  2. Link to repo URL.
  3. Test link.

Expected outcome: Users can access the project repo easily.

Event Timeline

Before/After Comparison

Before (No GitHub Link)

jsx
<div className="nav-right">
  <div className="country-selector">
    <select className="country-select">
      {/* Country options */}
    </select>
  </div>
  {!showBackButton && (
    <Link to="/about" className="nav-link">
      About Us
    </Link>
  )}
  {showBackButton && (
    <button className="back-button">
      <i className="fas fa-arrow-left"></i>
      <span>Back to Search</span>
    </button>
  )}
</div>

After (With GitHub Link)

jsx
<div className="nav-right">
  <div className="country-selector">
    <select className="country-select">
      {/* Country options */}
    </select>
  </div>
  {!showBackButton && (
    <>
      <Link to="/about" onClick={handleAboutClick} className="nav-link" title="About this project">
        About Us
      </Link>
      <a 
        href="https://github.com/Sunkanmi1/SCC-WEBAPP.git" 
        target="_blank" 
        rel="noopener noreferrer" 
        className="nav-link github-link"
        title="View on GitHub"
      >
        <Github size={20} />
      </a>
    </>
  )}
  {showBackButton && (
    <button onClick={handleBackClick} className="back-button" title="Back to home search">
      <i className="fas fa-arrow-left"></i>
      <span>Back to Search</span>
    </button>
  )}
</div>

Github PR:
https://github.com/Sunkanmi1/SCC-WEBAPP/pull/30/commits/3bda62fa4db64b795f23dd1b33e99600b963e668

h1.png (487×1 px, 396 KB)

SincerelySaeed5000 subscribed.

Thank you for your contribution.
I have reviewed the submitted work and confirmed the following:
✔️ Task requirements have been addressed
✔️ Work aligns with the current project scope
✔️ Evidence (links/screenshots/PR) is sufficient for audit purposes
✔️ No overlap or conflict with other assigned tasks
✔️ Contribution follows the agreed workflow and guidelines
This task is now approved and resolved.
📌 Next step for contributor:
Please proceed to fill the official contribution submission form using this task ID to complete your participation record.
Thank you for your effort and collaboration 🙌
Task resolved.
— Ali (SCC Mentor / Reviewer)