Update-navbar

[plang-psm]

Overview

We need to update the nav bar to the new layout displayed in #1236.

Action Items

• Update the nav bar to the new design.
• Check off the issue in the epic.

Proposed design:

Resources/Instructions

#1236

[trillium]

This comment was meant to be added to #1308

---

Pretty sure we're still on the 'working out the kinks' phase of integrating MUI, but MUI has a button type 'outlined' that fits the style guide without having to specifiy a new variant. Needs similar updating for border pixel thickness:

variants: [
  {
    props: { variant: 'outlined' },
    style: {
      border: '2px solid',
      "&:hover": {
      border: '2px solid'
      },
    },
  },
],

<Button color="secondary" variant="outlined">

[MattPereira]

Hey @spiteless

I hear what you are saying and am open to discussing use of the outlined variant

The reason I named the custom button variant "secondary" was to match the style guide from the Figma

https://www.figma.com/file/pIxFTL62Nx2XyQdZy1fR6f/VRMS-v.4?node-id=803-788

[trillium]

My bad, I added this comment to the wrong issue. Meant to comment on Pull Request #1308. Moving disuccion there.