Swap website colours of the Home page

[ShravaniAK]

Fixes #6028

Proposed Changes

• swapped the main 2 primary light and primary dark colours
• changed the nav-item-color to #494848
• added consistent corner rounding and spacing between buttons.

[netlify]

✅ Deploy Preview for knative ready!

Built without sensitive environment variables

Name	Link
🔨 Latest commit	92f338e
🔍 Latest deploy log	https://app.netlify.com/sites/knative/deploys/667ce87728926a000887a7d3
😎 Deploy Preview	https://deploy-preview-6029--knative.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site configuration.

[ShravaniAK]

/cc @Cali0707 @aliok

[Cali0707]

/hold until UX WG approves colour changes
/cc @mmejia02 @zainabhusain227
do these new colours match the design system or should we change them at all?

[mmejia02]

@ShravaniAK, these are already really great changes!! It looks like you got all of the hex codes right, but weirdly it seems to be rendering the dark blue much lighter than it should. I'm unsure how to solve that problem. As you know, the dark blue hex code is #0D4984, which you have in your sourcecode. However, if you put the pre-release side by side, you see this dark blue is much lighter.

Also it would be great if the text colour on the first block of the homescreen were black/the off black colour we've been using. The light blue and greys look great!! Thank you for all of your work!

[ShravaniAK]

@mmejia02 thankyou very much for your feedback , the dark blue color problem is not there in my browser and also i checked with the latest deploy preview link , also I have already replaced the text color of first container of homescreen with black color , do you want be to replace it with some different shade of black ?

[mmejia02]

@ShravaniAK , in your browser it looks amazing and I have no other feedback!! Exciting stuff :) I still have no idea why my rendering is being weird but it's fine

[Cali0707]

Okay let's merge this for now, and then @ShravaniAK can you try testing this on some other browsers?

[Cali0707]

/unhold
/lgtm
/approve

[knative-prow]

[APPROVALNOTIFIER] This PR is APPROVED

This pull-request has been approved by: Cali0707, ShravaniAK

The full list of commands accepted by this bot can be found here.

The pull request process is described here

Needs approval from an approver in each of these files:

• OWNERS [Cali0707]

Approvers can indicate their approval by writing /approve in a comment
Approvers can cancel approval by writing /approve cancel in a comment