citizen428.blog()

Try to learn something about everything

Octopress Customizations

I finally found some time to give this blog a less generic look, which was really easy thanks to Octopress’s great theme and customization support.

First I changed some colors in sass/custom/_colors.scss:

1
2
3
4
5
$header-bg: #000;
$subtitle-color: lighten($header-bg, 58);
$nav-bg: desaturate(lighten(#FF7100, 18), 5)
$link-color: #FF7100;
$footer-bg: #CCC;

Then I reduced the width of the body, the size of the dates and article titles as well as the codeblocks (all of this can be done in sass/custom/_styles.scss):

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
body {
  max-width: 1100px;
}
time {
  font-size: 14px;
}
h1 {
  font-size: 2.2em;
}
section {
  > h1 {
    font-size: 1.5em;
  }
}
codeblock {
    font-size: 1.1em;
}

Last but not least I found some excellent free social media icons for the sidebar.

I hope you like the changes, I do and I was also pleasantly surprised how easy it is to change the look of an Octopress blog.

Comments