Implement design changes to blog.torproject.org

We've taken the time to redesign blog.torproject.org. We think the new design is easier to read, uses the space better, and looks more Tor!

tor-blogpage-before.png,300px

tor-blogpage-comments.png,300px

Before: too much whitespace, confusing comments, too white.

tor-blogpage-after.png,300px

After: more space used for content, intuitive comments, tor colors.

Since we're finished with the design, the next step is to incorporate all these changes and ship them. These include:

  • #22392 (moved): removing the left column
  • #22395 (moved): more intuitive comment threading
  • #22510 (moved): increasing brand presence
  • changes in font hierarchy, specifically h2 not being bold and in all caps.
  • changes in color and styling
  • including an onion icon next to tor people's comments (people who are registered on the blog) so that people can see which answers are more tor-official--see the attached image. Notice that the color of the onion depends on the color of the comment. For that, I suggest looking at: https://css-tricks.com/cascading-svg-fill-color/

The assets for the new design can be found here: https://projects.invisionapp.com/d/main#/console/11254922/239848960/inspect (look at the top navigation bar, and it has assets)