#478 Added icon button and title for competency page

[Prabhj33t]

Proposed changes

Resolves issue #478 by having an Icon button for the Competency page and also added the titles for other icons as well.

Checklist

• [x] Are the issues being addressed linked to this PR?
• [x] Do all commit messages start with the issue number?
• [x] Are all code changes sufficiently tested?
• [x] Are there screenshots for UI changes?

[seidior]

Before we can move forward with the pull request, you'll need to:

git pull origin main
git commit --amend -m "#478 Merge latest from `main`"
cd webapp
yarn delint
cd ..
git add webapp
git commit -m "#478 Yarn delint"
git push

That way your branch is brought up to date, the code is linted, all your commits are prepended with the issue number, and the automated checks should pass.

You may also want to edit the pull request description from "Closes the issue" to "Closes issue #478" so that we further know which issue this PR closes, and the closing keywords requirement is still met.

[seidior]

While you're doing an interactive rebase (or git commit --amend, as I'm seeing the offending files were from your most recent commit, so maybe the interactive rebase process is a bit heavy for this...), I'd like you to modify your last commit message which is currently #478 merge to main but that doesn't accurately describe the content of this commit which should instead be #478 Run yarn delint.

[seidior]

Swapped out the tooltips for MUI's Tooltip element as proposed by @veranika-karpava. Here's a screenshot of how that looks:

Also, swapped out the href's for react-router-dom's <Link> element, as we use in the logo. Tested and verified functionality on my machine.

With those changes, I'm switching my review to approval.