Repository: srbhr/Resume-Matcher
File: webapp/app/_components/header/header.tsx (TypeScript)

Code before:
      <nav className="grow">
        <ul
          className="flex justify-center gap-6 text-[#e2e8f0] text-sm "
          role="list"
        >
          <li className="hover:text-[#94a3b8]">
            <a
              href="https://github.com/srbhr/Resume-Matcher/graphs/contributors"
              target="_blank"
            >
              Contributions
            </a>
          </li>
          <li className="hover:text-[#94a3b8]">
            <a
              href="https://github.com/srbhr/Resume-Matcher#readme"
              target="_blank"
            >
              Docs
            </a>
          </li>
          <li className="hover:text-[#94a3b8]">
            <a href="https://www.resumematcher.fyi/" target="_blank">
              Main Site
            </a>
          </li>
        </ul>
      </nav>
      <nav>
        <ul className="flex gap-4 text-xs">
          <li>
            <a
              href="https://github.com/srbhr/Resume-Matcher"
              target="_blank"
              rel="noopener noreferrer"
            >
              <Button className="bg-white text-black py-3 shadow-xl hover:bg-[#e5e7eb]">
                Star Us
                <Image
                  src="/icons/github.svg"
                  width={16}
                  height={16}
                  alt="GitHub Octocat Logo"
                />
              </Button>
            </a>
          </li>
          <li>
            <a
              href="https://dsc.gg/resume-matcher"
              target="_blank"

Review comment (security):
Could we also add the attribute `rel="noopener noreferrer"` to each anchor tag to improve security as was suggested in the initial comment?
 
```suggestion
          <li className="hover:text-[#94a3b8]">
            <a
              href="https://github.com/srbhr/Resume-Matcher/graphs/contributors"
              target="_blank"
              rel="noopener noreferrer"
            >
              Contributions
            </a>
          </li>
          <li className="hover:text-[#94a3b8]">
            <a
              href="https://github.com/srbhr/Resume-Matcher#readme"
              target="_blank"
              rel="noopener noreferrer"
            >
              Docs
            </a>
          </li>
          <li className="hover:text-[#94a3b8]">
            <a 
              href="https://www.resumematcher.fyi/"
              target="_blank"
              rel="noopener noreferrer"
            >
              Main Site
            </a>
          </li>
```
 
The `rel` attribute specifies the relationship between the current document and the linked document. In this case, the value `"noopener noreferrer"` is used to improve security by preventing the linked page from being able to access the window object of the current page. The `noopener` value ensures that the new page opened by the link does not have access to the `window.opener` property, which can be used for phishing attacks. The `noreferrer` value ensures that no referrer information is passed to the linked page, which can be used to track the user's browsing history.

Overall, the `rel="noopener noreferrer"` attribute is a security measure that helps protect users from potential security vulnerabilities when clicking on links.

Code after:
      <nav className="grow">
        <ul
          className="flex justify-center gap-6 text-[#e2e8f0] text-sm "
          role="list"
        >
          <li className="hover:text-[#94a3b8]">
            <a
              href="https://github.com/srbhr/Resume-Matcher/graphs/contributors"
              target="_blank"
              rel="noopener noreferrer"
            >
              Contributions
            </a>
          </li>
          <li className="hover:text-[#94a3b8]">
            <a
              href="https://github.com/srbhr/Resume-Matcher#readme"
              target="_blank"
              rel="noopener noreferrer"
            >
              Docs
            </a>
          </li>
          <li className="hover:text-[#94a3b8]">
            <a
              href="https://www.resumematcher.fyi/"
              target="_blank"
              rel="noopener noreferrer"
            >
              Main Site
            </a>
          </li>
        </ul>
      </nav>
      <nav>
        <ul className="flex gap-4 text-xs">
          <li>
            <a
              href="https://github.com/srbhr/Resume-Matcher"
              target="_blank"
              rel="noopener noreferrer"
            >
              <Button className="bg-white text-black py-3 shadow-xl hover:bg-[#e5e7eb]">
                Star Us
                <Image
                  src="/icons/github.svg"
                  width={16}
                  height={16}
                  alt="GitHub Octocat Logo"
                />
              </Button>