If you’ve come to my blog before, you may have noticed there’s now a new site design. While Octopress is still awesome, my previous Octopress-based blog theme wasn’t a good match for the new design of my main site. This updated design, using Bootstrap with some customizations, pays homage to the original Octopress layout, but provides a more modern look and feel.

I’m a desktop first kind of guy, and even I love the new theme on my mobile devices. I think you will too. Continue reading to see a side-by-side comparison of the old and new styles, and to see some of the other new tricks of the upgraded theme.

The theme replaces nearly all of the original SCSS, and a good chunk of the original templates had to be modified. I also improved some of the Octopress plugins for my personal use, such as supporting multiple GitHub accounts in the sidebar and wrapping image tags in a container with their captions to simplify layouts.

But my favorite enhancement is the unification of embedded code styles. GitHub Gists and backtick-quoted code blocks use nearly identical styles, with the only major difference being the syntax highlighting colors. Horizontal and vertical scrolling of code blocks also improved.

1
2
3
4
5
6
7

# This is an ordinary embedded code block.  It should look stylistically
# consistent with the Gist embedded above.
class Colors
  def self.colorful?
    true
  end
end

So, hopefully you like what you see. Overall the code’s not perfect, but I’m pleased with the result. Have a look around the archives, and let me know if anything looks wrong. I’ll be posting more in the future, so come back soon!