[DOCS]: Update homepage header to different shade of red in dark mode

[brandonroberts]

Update the color for the header to match on lite/dark modes. The red should be the one used in the light mode on both.

That being said, the red has been brightened in dark mode for accessibility WCAG-AA contrast concerns when used with black as recommended by Docusaurus.

Originally posted by @LayZeeDK in https://github.com/analogjs/analog/issues/38#issuecomment-1219769649

[LayZeeDK]

Use this Docusaurus tool to generate shades and tints of red for dark mode.

The Infima color variables used by Docusaurus are defined in https://github.com/analogjs/analog/blob/main/apps/docs-app/src/css/custom.css.

[umairhm]

@brandonroberts I will like to give this a try, please assign it to me.

[umairhm]

@brandonroberts @LayZeeDK What if we keep the same banner color in both dark and light modes, including the copy and buttons? The rest of the page changes anyways, and the banner can stay as-is.

Or we can do what the official Angular website is doing, it's a gradient that starts from the same color on both light and dark, and ends differently to create a slight visual difference.

[LayZeeDK]

The banner is probably where the color variation is currently the most apparent. How about the opposite of what you're suggesting? Banner uses the real red while everything else uses the brighter palette in dark mode.

[brandonroberts]

@LayZeeDK @umairhm the other color choices are fine in my opinion. I'd have to see a preview of the proposed changes

[brandonroberts]

Resolved in https://github.com/analogjs/analog/pull/251