Change layout/style to adapt on Ocean theme

[mhitza]

As the suggestion in the reddit chat, inside are the changes necessary to have the Ocean theme on Hoogle as well.

[ndmitchell]

Sadly the file src/Web/Page.hs is autogenerated, so you can't modify it directly. The right place to modify is datadir/resources/template.html. Once you modify there if you run hoogle server --dynamic --template=datadir/resources/template.html it will show you Hoogle using the template, and if you run ghci in the root (so you pick up the Hoogle .ghci file) you can type :template to rebuild the template including the changes.

It's my fault that the file Page.hs doesn't have an auto-generated marker on it, so I've just committed code to add that. I hope that syncing the changes back to template.html will be pretty easy, sorry for the hassle.

I also noticed a few visual things that need tweaking:

• The new top-bar means that the Hoogle logo and search bar ends up about 20 pixels further down the page - can't we get the old layout but with new styling? Not sure I like giving up 20 px of valuable screen estate. Perhaps it should just be styling that way for the links on the left, not going consistently across the whole top of the screen? Maybe a rounded corner would let it keep the same style without the loss of vertical space?
• If you search for something like 'a' (with lots of results) then the (-) package (+) links should be colored green, not reddish, since they indicate a continuation of the (+) action.
• If you search for 'a' again then the "Show more results" is reddish, but it should be blue, to match the expander (or you can restyle the expander - but it seems that making it similar to all the results isn't a good idea - more visual contrast)
• I'd welcome a logo redesign to fit with everything, although that is more "design" work and more subjective.

Thanks for your work so far, looks good!

[mhitza]

Regarding to your first point (and last, as they both are subjective), it does look out of place if the top bar doesn't span across the screen, yet again from my perspective 20px doesn't seem much (maybe using a mobile device would).

And as far as the logo goes, I don't think it is that much of an issue.

:thumbsup:

[ndmitchell]

On a mobile device the top bar takes the entire top of the screen anyway, so you don't lose anything. I'm still reluctant to lose those 20px, but will have a play and see - thanks for the updates.

[ndmitchell]

I played around some more, and it didn't seem too bad. I'm going to squish some of the margins around each entry (they take up a bit too much space to my eye), but overall looks good. I probably won't deploy until the weekend.