Colors & Fonts to align with new website

[kmomar]

Please let me know which of these are not possible:

Font: I'm not sure what fonts are available in Sphinx or if we have the availability to upload a font but for all text we should be using mulish.

Body Text: Mulish semibold at around 16 pt

H1: Mulish Semibold at 42 pt H2: Mulish Semibold at 38 pt H3: Mulish Semibold at 32

Colors: We have quite a few colours available to us from the brand guidelines. These are my recommendations on usage.

Top bar that says "[The Carpentries Test Handbook 0.0.1 documentation..." Please use the new general carpentries blue (#081457)

Left side bar with search box: Please use either #FFF7F1 or #E6F1FF

Main background of page: Please use #E5E5E5

Text colors:

H1 and body text: #383838 H2: #001483 H3: #719EFF

If we are able to edit the lines on the page, I'd like to use #FF4955

For the footer, please use #383838

Please let me know if we need to manually select the colors for when links are clicked or hovered over.

[maneesha]

Parts of this have been implemented.

@kmomar I want to get your feedback to be sure what's done so far looks ok:

• The horizontal line on the front page is #FF4955. This is kind of a salmon color, which looks odd to me (but as I've noted before I always defer to others on design questions)
• On a page like this H1 renders in a dark gray while H2 renders in a medium blue. This also looks odd to me, but as above...
• On the front page, you can click on any of the options under "What would you like to do today?" and you can see the default style and the style when you hover. Do you want to change those options?
• The background color for the header and footer is Carpentries blue. What color should the text be (default text and hover text)? Currently it's the template default which does not work with the dark blue.

Omar, please let me know if you have any other comments/suggestions as you look at the rendered site

[maneesha]

Other than following up on the questions above, I still need to implement left and right side menu panels and style them consistent with the main page.

[kmomar]

- The horizontal line on the front page is #FF4955. This is kind of a salmon color, which looks odd to me (but as I've noted before I always defer to others on design questions)

This color is correct I think - you can see it on the beta of the site for the testimonials, and it's used elsewhere as well but I think we should change to another color that we have which is #FFC700 or golden

- On a page like this H1 renders in a dark gray while H2 renders in a medium blue. This also looks odd to me, but as above...

hmm I agree - we don't really have precedent in the beta for changing colors depending on the heading level, but I wanted to make it so size wasn't the only distinguishing factor

- On the front page, you can click on any of the options under "What would you like to do today?" and you can see the default style and the style when you hover. Do you want to change those options?

These look fine to me!

- The background color for the header and footer is Carpentries blue. What color should the text be (default text and hover text)? Currently it's the template default which does not work with the dark blue.**

I think the text could be white, the hover option orange is fine with me - it doesn't look too out of place

In general, maybe it's a setting I have but the body text on the site is showing up very light on my screen, Do we need to change that color to help readability?

[maneesha]

@OscarSiba Can you let me know if we need to change any colors or fonts? See https://carpentries-beta-handbook-preview.netlify.app/