numpy / numpy.org

The NumPy home page
http://numpy.org/
BSD 3-Clause "New" or "Revised" License
112 stars 108 forks source link

Uniformity in Hugo and Sphinx template design #48

Open InessaPawson opened 5 years ago

InessaPawson commented 5 years ago

Uniformity in the Hugo and Sphinx template design of numpy.org is desired. At the very least the same fonts and color scheme (https://user-images.githubusercontent.com/98330/63642399-51f41480-c673-11e9-8d22-20315b71c83e.jpg) must be used.

joelachance commented 4 years ago

@Shekharrajak , hoping we can pair on this one.

Here's what I've been using for the website, which I'll admit is probably different than what Inessa linked in the description and probably what you're using in the updated Sphinx theme.

Some of the colors and fonts I've been using (mostly coming from http://www.flatuicolorpicker.com/)

013243 (dark blue)

ffc553 (gold/yellow)

ececec, #eee (off-white)

fff (white)

6c7a89 (gray)

Screen Shot 2020-03-20 at 8 10 55 AM

Fonts: Lato https://fonts.googleapis.com/css?family=Lato:400,900&display=swap Source Code Pro (for shell) https://fonts.googleapis.com/css?family=Source+Code+Pro&display=swap

I know we discussed Ubuntu in the past, and felt Lato looked a touch sharper when going back and forth. What's being used for the docs?

InessaPawson commented 4 years ago

@joelachance #ffc553 (gold/yellow) is spot on, it's one of the NumPy official branding colors. I like the use of the various shades of gray too.

Regarding the choice of font, an elegant and modern font, Ubuntu doesn't seem to enhance the UI of numpy.org. I like the use of Lato better.

joelachance commented 4 years ago

@InessaPawson agreed, I feel the same.

Regarding the colors, I do think some of the 'less bright' colors modernize things a bit while keeping the color scheme. I'm happy to do whatever here. Curious what was used for the Sphinx refresh @Shekharrajak!

Shekharrajak commented 4 years ago

Hi,

While choosing color scheme, I looked at previous site and took the one which suits the most (in my opinion, since it was not discussed that time). I used : #4dabcf , white, #404040 (in some background), #d9f4ff (for code highlight background color).

Need to do changes accordingly. Tracking it here: https://github.com/scipy/scipy-sphinx-theme-v2/issues/30

joelachance commented 4 years ago

@InessaPawson, would you like to make an executive decision here? @Shekharrajak & myself can triage and make sure things are uniform.

@Shekharrajak, I hope it's ok if I volunteer you for a moment of work ;) I'm happy to put the PR's in if it's easiest.

Shekharrajak commented 4 years ago

Yeah, sure! Go ahead.

InessaPawson commented 4 years ago

UPDATE: For the website color scheme refer to https://github.com/numpy/numpy.org/issues/48#issuecomment-605937338.

Shekharrajak commented 4 years ago

So no blue type colors ? Which is used to be in old sites ? It is in logo also.

InessaPawson commented 4 years ago

So no blue type colors ? Which is used to be in old sites ? It is in logo also.

@Shekharrajak This is the color scheme for the website design.

InessaPawson commented 4 years ago

@joelachance Please help us to make a list of the font colors that have been used for numpy.org.

joelachance commented 4 years ago

I'm looking, and there's a couple we can probably combine. Let me PR those so we have a white, black, and maybe 1-2 grays.

Stay Tuned...

InessaPawson commented 4 years ago

I'm looking, and there's a couple we can probably combine. Let me PR those so we have a white, black, and maybe 1-2 grays.

@joelachance Please remember to include the red color used for the code.

InessaPawson commented 4 years ago

I’ve given further thought to the color scheme of numpy.org. On the second look, the one I proposed before veers off too far from the NumPy branding colors (https://user-images.githubusercontent.com/98330/63642399-51f41480-c673-11e9-8d22-20315b71c83e.jpg). However, using all of them is overkill. Let’s adopt the color scheme that I used for the presentation slides.

PRIMARY COLORS

ffc553

4dabcf

4d77cf

SECONDARY COLORS

ffffff

013243

eeeeee

6c7a89

I’ll update the earlier comment to avoid confusion.

joelachance commented 4 years ago

@InessaPawson Looks good! Is there anything specific on the website you'd like updated? I would use the top three for main logos & accents, and the bottom 4 for text mainly. Thoughts?

rgommers commented 4 years ago

Very nice, and I also like the names of the colors:)

Would be useful to put this in the README of this repo perhaps, or somewhere else more discoverable.

MarsBarLee commented 4 years ago

I like these colors as well! And the cool blue-leaning secondary colors tie nicely with the primary blues.

InessaPawson commented 4 years ago

I would use the top three for main logos & accents, and the bottom 4 for text mainly. Thoughts?

I'd say, everything is a fair game as long as a designer stays within this color scheme. :)