Update style, fonts, layout, all the things

Gemfile

@@ -1,6 +1,7 @@
 source 'https://rubygems.org'
 
 gem 'nanoc'
+gem 'guard-nanoc'
 
 gem 'haml'
 gem 'rdiscount'

Gemfile.lock

@@ -4,7 +4,13 @@ GEM
     adsf (1.2.0)
       rack (>= 1.0.0)
     builder (3.2.2)
+    celluloid (0.15.2)
+      timers (~> 1.1.0)
+    celluloid-io (0.15.0)
+      celluloid (>= 0.15.0)
+      nio4r (>= 0.5.0)
     chunky_png (1.3.0)
+    coderay (1.1.0)
     coffee-script (2.2.0)
       coffee-script-source
       execjs
@@ -17,11 +23,29 @@ GEM
     cri (2.5.0)
       colored (~> 1.2)
     execjs (2.0.2)
+    ffi (1.9.3)
+    formatador (0.2.4)
     fssm (0.2.10)
+    guard (2.6.0)
+      formatador (>= 0.2.4)
+      listen (~> 2.7)
+      lumberjack (~> 1.0)
+      pry (>= 0.9.12)
+      thor (>= 0.18.1)
+    guard-nanoc (1.0.2)
+      guard (>= 1.8.0)
+      nanoc (>= 3.6.3)
     haml (4.0.5)
       tilt
     i18n (0.6.9)
     json (1.8.1)
+    listen (2.7.1)
+      celluloid (>= 0.15.2)
+      celluloid-io (>= 0.15.0)
+      rb-fsevent (>= 0.9.3)
+      rb-inotify (>= 0.9)
+    lumberjack (1.0.5)
+    method_source (0.8.2)
     mime-types (2.2)
     mini_portile (0.5.3)
     multi_json (1.9.2)
@@ -31,19 +55,30 @@ GEM
       nanoc (>= 3.3.0)
     nanoc-javascript-concatenator (0.0.2)
       nanoc (>= 3.3.0)
+    nio4r (1.0.0)
     nokogiri (1.6.1)
       mini_portile (~> 0.5.0)
     posix-spawn (0.3.8)
+    pry (0.9.12.6)
+      coderay (~> 1.0)
+      method_source (~> 0.8)
+      slop (~> 3.4)
     pygments.rb (0.5.4)
       posix-spawn (~> 0.3.6)
       yajl-ruby (~> 1.1.0)
     rack (1.5.2)
     rake (10.2.2)
+    rb-fsevent (0.9.4)
+    rb-inotify (0.9.3)
+      ffi (>= 0.5.0)
     rdiscount (2.1.7)
     rubypants (0.2.0)
     sass (3.2.18)
+    slop (3.5.0)
     systemu (2.6.4)
+    thor (0.19.1)
     tilt (2.0.1)
+    timers (1.1.0)
     typogruby (1.0.16)
       rubypants
     uglifier (2.5.0)
@@ -62,6 +97,7 @@ DEPENDENCIES
   builder
   coffee-script
   compass
+  guard-nanoc
   haml
   i18n
   mime-types

Guardfile

@@ -0,0 +1,8 @@
+# A sample Guardfile
+# More info at https://github.com/guard/guard#readme
+
+guard 'nanoc' do
+  watch('nanoc.yaml') # Change this to config.yaml if you use the old config file name
+  watch('Rules')
+  watch(%r{^(content|layouts|lib)/.*$})
+end

Rules

@@ -16,10 +16,6 @@ preprocess do
   end
 end
 
-compile %r{/keybase/} do
-  # Nothing.
-end
-
 compile %r{^/(google|robots|assets)} do
 end
 
@@ -144,10 +140,6 @@ route %r{/_.+/$} do
   nil # don't route partials
 end
 
-route %r{/keybase/} do
-  '/.well-known/keybase.txt'
-end
-
 route %r{^/(assets/.*|sitemap|robots|atom)/$} do
   ext = item[:extension]
   ext = 'js' if ext == 'coffee'

content/about.haml

@@ -0,0 +1,29 @@
+---
+title: About Ariejan
+---
+:markdown
+  <img class="right round bordered" src="https://0.gravatar.com/avatar/a9bfdd0cc75c857b669c37548b8bfdf9?s=192" />
+
+  Hi! I'm Ariejan de Vroom, a thirty-three year old Ruby on Rails developer and Software
+  Craftsman. I live in [Breugel, the Netherlands][1] with my wife [Laura][2]
+  and work full-time at [Kabisa][3].
+
+  I am available for consulting, talks and training.
+
+  ### Find out more about me
+
+  Check me out on [Twitter][4], [Github][6] or [LinkedIn][5] to get to know me a bit better.
+
+  ### Get in touch
+
+  If you want to contact me, [tweet something][4] or [send me an email][8] you
+  can find my [GPG key here][9].
+
+  [1]: http://maps.google.nl/maps?f=q&source=s_q&hl=nl&geocode=&q=eindhoven&sll=52.469397,5.509644&sspn=4.692139,10.942383&ie=UTF8&hq=&hnear=Breugel,+Noord-Brabant&ll=51.440313,5.482178&spn=4.800964,10.942383&t=h&z=7
+  [2]: http://laura-oerlemans.net/
+  [3]: http://kabisa.nl/
+  [4]: http://twitter.com/ariejan
+  [5]: http://www.linkedin.com/in/ariejan
+  [6]: https://github.com/ariejan
+  [8]: mailto:ariejan@ariejan.net
+  [9]: http://ariejan.net/gpg/

content/bitcoin-awesome.haml

@@ -0,0 +1,17 @@
+---
+title: Thanks for your Bitcoin donation
+---
+:markdown
+  **You, sir, are awesome!**
+
+  Let me tell you that I greatly appreciate you taking the time and effort
+  to donate me some Bitcoin for an article I have written. It's a huge 
+  morale boost to keep writing down the result of my own technical 
+  struggle and help others learn and discover just a bit easier.
+
+  Also, thank you for believing in Bitcoin and _actually using_ it for 
+  something else than hoarding or buying a Lamborghini.
+
+  What am I going to do with the Bitcoin you just donated? I haven't decided
+  yet, but probably save up and buy a nice pint of Guinness.
+ 

content/css/screen.sass

@@ -2,30 +2,67 @@
 @import "bootstrap"
 @import "pygments"
 
-@import url(http://fonts.googleapis.com/css?family=Roboto:400,400italic,700,700italic)
+@font-face
+  font-family: 'Titillium'
+  src: url('/fonts/titillium-regular-eot.eot')
+  src: url('/fonts/titillium-regular-eot.eot?#iefix') format('embedded-opentype'), url('/fonts/titillium-regular-woff.woff') format('woff'), url('/fonts/titillium-regular-ttf.ttf') format('truetype'), url('/fonts/titillium-regular-svg.svg#webfont') format('svg')
+  font-weight: 400
+  font-style: normal
+
+@font-face
+  font-family: 'Titillium'
+  src: url('/fonts/titillium-regularitalic-eot.eot')
+  src: url('/fonts/titillium-regularitalic-eot.eot?#iefix') format('embedded-opentype'), url('/fonts/titillium-regularitalic-woff.woff') format('woff'), url('/fonts/titillium-regularitalic-ttf.ttf') format('truetype'), url('/fonts/titillium-regularitalic-svg.svg#webfont') format('svg')
+  font-weight: 400
+  font-style: italic
+
+@font-face
+  font-family: 'Titillium'
+  src: url('/fonts/titillium-bold-eot.eot')
+  src: url('/fonts/titillium-bold-eot.eot?#iefix') format('embedded-opentype'), url('/fonts/titillium-bold-woff.woff') format('woff'), url('/fonts/titillium-bold-ttf.ttf') format('truetype'), url('/fonts/titillium-bold-svg.svg#webfont') format('svg')
+  font-weight: 700
+  font-style: normal
+
+@font-face
+  font-family: 'Titillium'
+  src: url('/fonts/titillium-bolditalic-eot.eot')
+  src: url('/fonts/titillium-bolditalic-eot.eot?#iefix') format('embedded-opentype'), url('/fonts/titillium-bolditalic-woff.woff') format('woff'), url('/fonts/titillium-bolditalic-ttf.ttf') format('truetype'), url('/fonts/titillium-bolditalic-svg.svg#webfont') format('svg')
+  font-weight: 700
+  font-style: italic
+
+$text-color: #191919
+$code-color: #690000
+$footer-color: #999999
 
-$text-color: #696969
 $focus-color: $peterriver
 
 body
   color: $text-color
-  // font-family: "Helvetica Neue", Helvetica, Arial, sans-serif
+  font-family: "Titillium", "Helvetica Neue", Helvetica, Arial, sans-serif
-  font-family: 'Roboto', sans-serif
   font-weight: 400
-  line-height: 1.6em
+  font-size: 2em
+  line-height: 2em
   -webkit-font-smoothing: antialiased
 
 a, a:hover, a:active, a:visited
   color: $focus-color
+  text-decoration: none
 
 h1, h2, h3, h4, h5, h6
-  // font-family: "Helvetica Neue", Helvetica, Arial, sans-serif
+  font-family: "Titillium", "Helvetica Neue", Helvetica, Arial, sans-serif
-  font-family: 'Roboto', sans-serif
   font-weight: 400
   -webkit-font-smoothing: antialiased
 
 code
-  font-size: 12px
+  font-size: 0.8em
+  color: $code-color
+  background: none
+  padding: 0
+  border-radius: 0
+
+pre
+  font-size: 0.8em !important
+  color: $code-color
 
 #header
   border-top: 3px solid $focus-color
@@ -34,7 +71,7 @@ code
     color: $text-color
 
   h1, ol
-    font-size: 1.2em
+    font-size: 1em
     display: inline-block
 
   h1
@@ -44,7 +81,7 @@ code
       color: darken($text-color, 15%)
       span
         color: darken($text-color, 30%)
-        font-weight: 800
+        font-weight: 700
 
   ol
     padding-left: 0
@@ -57,7 +94,8 @@ code
     text-align: right
 
   ol.social
-    margin-top: 15px
+    font-size: 1.2em
+    margin-top: 16px
 
     li
       padding-right: 0
@@ -68,41 +106,12 @@ code
         color: $focus-color
 
 #main
-  #digital-ocean
+  #welcome
-    margin-top: 1em
+    font-weight: normal
-    font-size: 0.8em
+    background-color: #F7F7F7
-    line-height: 1.4em
+    border-radius: 4px
-
+    border: 1px solid #d9d9d9
-  #adpacks
+    padding: 10px 20px
-    width: 130px
-    font-size: 0.8em
-    line-height: 1.4em
-
-    .bsa_it_i
-      float: right
-      display: block
-      width: 130px
-      margin-bottom: 10px
-
-    .bsa_it_t,
-    .bsa_it_d
-      display: inline-block
-      clear: right
-      width: 130px
-      margin-bottom: 10px
-
-    .bsa_it_t
-      color: darken($text-color, 30%)
-
-    .bsa_it_d
-      color: $text-color
-
-    .bsa_it_p
-      display: none
-
-    a#bsap_aplink,
-      display: inline
-      color: lighten($text-color, 30%)
 
   #posts
     .post
@@ -110,38 +119,45 @@ code
 			
       h2.title
         margin-bottom: 0
-        padding-bottom: 0
+
+      p
+        text-align: justify
         
       p.meta
-        margin-top: 0
-        padding-top: 0
-        margin-bottom: 0
         font-style: italic
-        color: lighten($text-color, 30%)
+        color: lighten($text-color, 10%)
 
   #older-posts
     h2.title
       margin-top: 0
       margin-bottom: 10px
-      margin-left: 80px
+      margin-left: 122px
       font-size: 1.2em
 
       span.meta
-        margin-left: -80px
+        color: lighten($text-color, 10%)
+        margin-left: -122px
         color: $text-color
         font-size: 0.82em
-        padding-top: 0.2em
+        padding-top: 0.1em
         display: inline-block
         float: left
 
   .post,
   .page
     h1.title
+      font-size: 3em
       margin-bottom: 0
       padding-bottom: 0
 
       a
-        color: darken($text-color, 15%)
+        text-decoration: none
+
+        &:hover
+          text-decoration: none
+
+    p
+      text-align: justify
 
     p.meta
       margin-top: 0
@@ -149,23 +165,39 @@ code
       font-style: italic
       color: lighten($text-color, 30%)
 
+    img
+      border: 0
+      margin: 8px
+
+      &.right
+        float: right
+
+      &.left
+        float: left
+
+      &.round
+        border-radius: 50%
+
+      &.bordered
+        border: 1px solid #696969
+        padding: 2px
+
     #recent-posts
       h4.title
         clear: left
         margin-top: 0
         margin-bottom: 10px
-        margin-left: 64px
+        margin-left: 92px
         font-size: 1em
 
         span.meta
-          margin-left: -64px
+          margin-left: -92px
           color: $text-color
           font-size: 0.8em
           padding-top: 0.2em
           display: inline-block
           float: left
 
-
     #comments
       margin-top: 20px
 
@@ -183,32 +215,22 @@ code
 
 #footer
   margin-top: 20px
+  margin-bottom: 60px
 
-  ul.tla
+  .copyright
-    padding-left: 0
     font-size: 0.8em
+    line-height: 1.4em
+    color: $footer-color
+    text-align: center
 
-    li
+#appreciation
-      display: inline-block
-
-      a
-        color: $text-color
-
-#coinwidget
   margin-top: 1em
   border: 1px solid #e0e0e0
   background-color: #fffff7
   border-radius: 4px
-  padding: 4px 8px
+  padding: 10px 20px 0 20px
 
-  span.title
+  #donate-button
-    display: block
+    margin-left: 8px
-    width: 75px
-    float: left
-    margin-right: 5px
-
-  span.links
-    display: block
-    margin-left: 80px
 
 

content/gpg.haml

@@ -0,0 +1,45 @@
+---
+title: GPG Public Key
+---
+:markdown
+  Yes, I use GPG.
+
+  More info about my public key: <a href="http://keys.gnupg.net/pks/lookup?search=0xF713697B&op=vindex">0xF713697B</a>
+
+  ## Proof of identity
+
+  As far as you can trust this website, this is a proof of my identity. 
+
+      -----BEGIN PGP SIGNED MESSAGE-----
+      Hash: SHA512
+
+      Yes, I use GPG. This message is here to prove my identity to you.
+
+      -----BEGIN PGP SIGNATURE-----
+      Version: GnuPG/MacGPG2 v2.0.22 (Darwin)
+      Comment: GPGTools - https://gpgtools.org
+
+      iQQcBAEBCgAGBQJTPUABAAoJEK1zkVT3E2l7CyEf/iFXQ+hl8As1oNpHoNKLnIie
+      wpyWBbhOj0YAuxoYA1fmFn3IASq3+st+VZEX82M3FedBLXozxFdFRE6OzLIKlx5i
+      ulbTtjq9gpiPcTO6n9P8hAdn672LAc0Hgo2CDZLg+SGkeseMzrFE5Pki9j7PHUP8
+      3SEk7j/iPQumfoJtPKRqzsnamViFonHorJGY9pso7hHPIaQlw7hQARkU5/OkADKM
+      BjlfqTxcgId9da9Y+yro3MnVWtAR8j1GWZDF90t/xipOQ9Bdj86jPiF16HEtM539
+      VPOsayxry24gEmVMsk4cERgysxUIp2js2v/ETL0udxk+7mP2EILVtUipYGR3jSYJ
+      2ByhPag9LgbqSttXzyrFs3aGl/mp65xZhOuWE/RJexcSa+opB2lQX1YEY3FmgTua
+      cL13rALwd4oa4WSh6nSXlQX6886tV6QQLLUp76Kdss/zBIzTdfmJy51nMhV0dBx9
+      hN8eCAZCGBXS9fBww4Se7xPJppJvSLQbIfpmrTgL3hLaaI0P/B9vlQ0/T+bU/rxX
+      TGukCrM3AQ0viYjw8UvYqvYX86rf0LWzMTKeIJqvId8T4MPceWpxAkUlR64W9J/X
+      /B19rrn+QhOwm/yu0vo7c+LmEpdhvX/6B1Gl7B2FTtzZc1fXTLVPuWSz9s/9K+XX
+      wxbCX4xrNocAfM+ZjR5CpDOPYAhCSlgiTsZBFQ2InN96TjgfgtsBD0oscrFLun6b
+      qKCFScWGRy6ieYkpYi33Rs+UdIGyzf6MezoMmdGTJFlMdCWP8RPBZvvzA7qSfYth
+      HycPonFXnuRm8kjzgQWw7XTYenaaZIe/Cl9w2KtCzXF1dMpBD5SPCqejP7fPLOoW
+      wU3qyiHvDFwsY8dZyi1DqSMHDO0GmYc4g9vJ5jgn/j5PBPEYVnzvjwgiFHT1vTaC
+      rMhKZb5fVq1uLtNxpHLGDPfYIE+XwcKq/wTg7Sq4tPOiM8Hpfa3Ard5z19K9ONJK
+      Ks2k3YHZY/EWSQV6iPMXXogY9chc9wnJaNSMMAvrMMFkQRm1Dqbl8DQXNVn4Qe9G
+      3ZMS5vudACrQgr+oRuvN6sK2T7ezXrZoYorM/1Q4U24to6zk7zJJMJ7Yb1YTISck
+      rpveLzor1PGa9VPxVs1eNGfLwd2zWs15HG/uLNxs0oC8yC+1Hh/7kzunlFd3bLrX
+      MGDDfW/BBqCc5MrxXUMnG+SnKJ56juv8G5VTMe2bKtalbNPinp5BnmWC0QRf9ThN
+      MjIP9n/N7bdLddQjel8x3yFvma2etB+fKLvmsbSYJ3khKCO7858qWQEnur84QrCW
+      letzIrjldL6419I5z6CtOe8JzWwEn5j2uq7i3xy4Ss5qsNG9RM0nWqzJx6o+/mU=
+      =x5b0
+      -----END PGP SIGNATURE-----

content/index.haml

@@ -3,48 +3,31 @@ title: blog
 ---
 .row
   .col-sm-12
-    %h3 Recent blog entries
+    #welcome
+      :markdown
+        _Welcome to Ariejan.net and thanks for checking out the frontpage ;-)_
+
+        This is my personal tech blog (see below) where I record and share my 
+        development and other activities. You can [read more about me][1], 
+        checkout [my past talks][2] or [open source projects][3]. 
+
+        [1]: http://ariejan.net/about/
+        [2]: http://ariejan.net/talks/
+        [3]: http://ariejan.net/projects/
+
+.row
+  .col-sm-12
     #posts
-      - sorted_articles[0..2].each do |article|
+      - sorted_articles[0..4].each do |article|
         .post
           %h2.title= link_to article[:title], article.path, title: article[:title]
           %p.meta= get_pretty_date(article)
           %p.summary= article[:summary]
 
 .row
-  .col-sm-6.col-sm-push-6
+  .col-sm-12
-    #about
-      %h3 About me
-      :markdown
-        ![Ariejan](https://0.gravatar.com/avatar/a9bfdd0cc75c857b669c37548b8bfdf9?s=192)
-
-        Hi! I'm Ariejan de Vroom, a thirty-three year old Ruby on Rails developer and Software
-        Craftsman. I live in [Breugel, the Netherlands][1] with my wife [Laura][2]
-        and work full-time at [Kabisa][3].
-
-        I am available for consulting, talks and training.
-
-        ### Find out more about me
-
-        Check me out on [Twitter][4], [Github][6] or [LinkedIn][5] to get to know me a bit better.
-
-        ### Get in touch
-
-        If you want to contact me, [tweet something][4] or [send me an email][8].
-
-        [1]: http://maps.google.nl/maps?f=q&source=s_q&hl=nl&geocode=&q=eindhoven&sll=52.469397,5.509644&sspn=4.692139,10.942383&ie=UTF8&hq=&hnear=Breugel,+Noord-Brabant&ll=51.440313,5.482178&spn=4.800964,10.942383&t=h&z=7
-        [2]: http://laura-oerlemans.net/
-        [3]: http://kabisa.nl/
-        [4]: http://twitter.com/ariejan
-        [5]: http://www.linkedin.com/in/ariejan
-        [6]: https://github.com/ariejan
-        [8]: mailto:ariejan@ariejan.net
-
-  .col-sm-6.col-sm-pull-6
-    %h3 Older posts
-
     #older-posts
-      - sorted_articles[3..-1].each do |article|
+      - sorted_articles[5..-1].each do |article|
         .post
           %h2.title
             %a{href: article.path, title: article[:title]}

content/keybase.txt

@@ -1,70 +0,0 @@
-==================================================================
-https://keybase.io/ariejan
---------------------------------------------------------------------
-
-I hereby claim:
-
-  * I am an admin of https://ariejan.net
-  * I am ariejan (https://keybase.io/ariejan) on keybase.
-  * I have a public key with fingerprint 9733 0ED9 9A77 2FBB 866E  C69C 2E3D 97A2 EBCA CF9A
-
-To claim this, I am signing this object:
-
-{
-    "body": {
-        "key": {
-            "fingerprint": "97330ed99a772fbb866ec69c2e3d97a2ebcacf9a",
-            "host": "keybase.io",
-            "key_id": "2E3D97A2EBCACF9A",
-            "uid": "7e179591db552c1981682d9968c3d900",
-            "username": "ariejan"
-        },
-        "service": {
-            "hostname": "ariejan.net",
-            "protocol": "https:"
-        },
-        "type": "web_service_binding",
-        "version": 1
-    },
-    "ctime": 1395905132,
-    "expire_in": 157680000,
-    "prev": "468b08e7da5362423ffdc0b5993a536892ecd8fe46810cb0483c2d56f62b8325",
-    "seqno": 4,
-    "tag": "signature"
-}
-
-with the aforementioned key, yielding the PGP signature:
-
------BEGIN PGP MESSAGE-----
-Version: GnuPG/MacGPG2 v2.0.20 (Darwin)
-Comment: GPGTools - https://gpgtools.org
-
-owGbwMvMwMWoZzt90etT52cxnj7wIYkh2PhSTrVSUn5KpZJVtVJ2KphKy8xLTy0q
-KMrMK1GyUrI0NzY2SE2xtEw0NzdKS0qyMDNLTTazTDZKNU6xNE80Sk1KTkxOs0xU
-0lHKyC8G6QAak5RYnKqXmQ8UA3LiM1OAokauxi6W5o5Grk7Ojs5ulo5AuVKwhHmq
-obmlqaVhSpKpqVGyoaWFoZmFEdA+M4tkoA0GBiCFxalFeYm5qUDViUWZqVmJeUq1
-OkpAwbLM5FSQk0E2oyrQy0stAeosKMovyU/OzwFKZJSUFBRbgTSWVBaAVJanJsVD
-zYhPysxLAXobqKMstag4Mz9PycoQqDK5JBNkqKEx0IEGpobGRjpKqRUFmUWp8Zkg
-FabmZhYGQACyJ7UMaKSJmUWSgUWqeUqiqbGZkYmRcVpaSrJBkqmlpTFIxMLSKDU5
-xSItFajO0CA5ycDEwjjZKMXULM3MKMnC2MhUCeSrwrx8JSsToDMT04FGFmem5yWW
-lBalKtV2MsmwMDByMbCxMoEijoGLUwAWnezz+f9XXo/TWhuy7cWXiZov7//3nLvq
-wftSDpWwo2F8Vc5XXzjaT/TeX/7hmsyBmxdFTEM+uxauNfn6O7VB/cHGgK9ljj1f
-HpzZl3zMsZ3x8oaXG1c9vvJnyvuD9SIOzAWCC5bKrN52Nvy1EFMV11HWrJDDZyyU
-HIV8tv1lOKx29KnXzN9n7RsVVR4tX6K5ZrI4a/T09UVu9/16pfbfZdSaPTf5ZF/A
-k+MirhNKtmxkfPsg8+kHK44Uh1/BVWw3Taatn3b0z2Q2jihxvklxy38kSxY3Bwm9
-zdj7mKv7/aT+CMZDv0/Y/HptIxBrPJ1t9b7II6zzb9qpaxTuEGy0TdLZt+711fn8
-9m2yz3OWHrzA12DxevJCfanQwOPqL6vnJodUlTPvkxL7UhVxM7MhWTxpzYnQoKl1
-GhUe3022sB2dzHJNofzqty/pLVNlWJ3WLkkUXNfzYeGJ3MsijjftjKOykuWTDe9F
-ablYPKht8N+3nWufyzFP4/JUkZK1l7+oHq7ZvCx8fdX2FUfvFvonN5/VZeiTvPSl
-kTVrx4F0VS1B7+gUnvioGwXF9yZuVVstLCVkftY8V4pV8efsrKpipj0TbjKa+C09
-EfY0OPpvxbagB5pzrdft/sneNPkyc9eMfiPuytYfU9y6LwV7f+RLDqpgUmydtKmL
-cVtcQnfJhd+B0c57XVxljOQvPv2yv6rrkaPt95ta9z42XTaOtpB8ugMA
-=Ukws
------END PGP MESSAGE-----
-
-And finally, I am proving ownership of this host by posting or
-appending to this document.
-
-View my publicly-auditable identity here: https://keybase.io/ariejan
-
-==================================================================

content/posts/2007-01-12-rails-group-results-by-week-using-group_by.md

@@ -15,36 +15,41 @@ The Enumerable class in Rails contains a method named 'group_by'. This method is
 Let's say you have a table 'posts' containing blog posts. Now, you normally show these chronologically a few at a time. Nothing special there. For some special overview page, you want to group your posts by week.
 
 With normal ActiveRecord operations this would be quite an elaborate task. But with group_by from Enumerable, it becomes child's play.
-<!--more-->
 
 First of all, in the controller, just get all the posts you need. In this case, all of them:
 
 Controller:
-<pre lang="ruby">def list
+
-  @posts = Post.find :all
+    :::ruby
-end</pre>
+    def list
+      @posts = Post.find :all
+    end
 
 As you can see, I perform no ordering or whatsoever here.
 
 Now, in your view you normally would iterate over all posts like this:
 
-<pre lang="html">< %= render :partial => 'post', :collection => @posts %></pre>
+    :::html
+    <%= render :partial => 'post', :collection => @posts %>
 
 But, as I said, we want to group the posts by week. To make life easy, I add a method to the Post class that returns the week number in which a post was written:
 
 Model Post:
-<pre lang="ruby">def week
+
-  self.created_at.strftime('%W')
+    :::ruby
-end</pre>
+    def week
+      self.created_at.strftime('%W')
+    end
 
 Now, the magic will happen in our view:
 
-<pre lang="html">< % @posts.group_by(&:week).each do |week, posts| %>
+    :::html
-  <div id="week">
+    <% @posts.group_by(&:week).each do |week, posts| %>
-    <h2>Week < %= week %></h2>
+      <div id="week">
-    < %= render :partial => 'post', :collection => @posts %>
+        <h2>Week < %= week %></h2>
-  </div>
+        < %= render :partial => 'post', :collection => @posts %>
-< % end %></pre>
+      </div>
+    <% end %>
 
 Let me explain the above. We specify that we want to call group_by for @posts. But we need to say how we want to group these posts. By specifying &:week we tell group_by that we want to group by the result of the week attribute of every post. This is the attribute we specified earlier in the model.
 
@@ -52,10 +57,11 @@ Well, when the grouping is done we create a block that will handle every group o
 
 As normal, we can now show the week number and iterate over the posts.
 
-<h2>Sorting groups</h2>
+## Sorting groups
 
 The result of group_by is not guaranteed to be ordered in any way. Simply call 'sort' before each and you're set:
 
-<pre lang="ruby">@posts.group_by(&:week).sort.each do |week, posts|</pre>
+    :::ruby
+    @posts.group_by(&:week).sort.each do |week, posts|
 
-Mostly, you'll find that the posts for every group are not sorted either. With the example above I think it's easy to figure out how to do that now. (hint: .sort)
+Mostly, you'll find that the posts for every group are not sorted either. With the example above I think it's easy to figure out how to do that now. (hint: .sort)

content/projects.haml

@@ -7,7 +7,13 @@ title: Open Source Projects
   There are several projects that I've worked on, but long since abandoned because
   they became obsolete and were superseded by other alternatives.
 
-  ### Focal
+  ## PostcodeAPI
+
+  A simple ruby wrapper around the [Postcode API service](http://www.postcodeapi.nu/).
+
+  * [Github](https://github.com/ariejan/postcodeapi)
+
+  ## Focal
 
   Focal is a utility web application that creates sexy and informative burndowns
   for you and your team.
@@ -20,14 +26,14 @@ title: Open Source Projects
 
   * [Github](https://github.com/kabisaict/focal)
 
-  ### IMDB
+  ## IMDB
 
   The IMDB gem allows you to programatically access IMDB. Although IMDB does not
   officially expose an API you are able to look at what's on their public pages.
 
   * [Github](https://github.com/ariejan/imdb)
 
-  ### Firefly
+  ## Firefly
 
   At the height of 140 character limited tweets, URL shortners where the hippest
   thing around.
@@ -38,13 +44,7 @@ title: Open Source Projects
   * [Website](http://fireflyrb.com)
   * [Github](https://github.com/ariejan/firefly)
 
-  ### PostcodeAPI
+  ## elfproef
-
-  A simple ruby wrapper around the [Postcode API service](http://www.postcodeapi.nu/).
-
-  * [Github](https://github.com/ariejan/postcodeapi)
-
-  ### elfproef
 
   The 11-check is a checksum algorithm used to validate Dutch bank account numbers and
   social security numbers.
@@ -53,7 +53,7 @@ title: Open Source Projects
 
   * [Github](https://github.com/sytzeloor/elfproef)
 
-  ## Open Source contributions
+  ## Other open source contributions
 
   Besides doing my own projects, I've also contributed to a wide variety of open
   source projects. Mostly to scratch my own itch with that project.

content/talks.haml

@@ -11,14 +11,14 @@ title: Talks by Ariejan
 
   Since 2012 I'm keeping track of the talks I've given. You can find the slides to them below.
 
+  ## Objective-C Awesomesuace
+
+  <script async class="speakerdeck-embed" data-slide="10" data-id="ecdbe4b09d4a0131aad12620211842eb" data-ratio="1.77777777777778" src="//speakerdeck.com/assets/embed.js"></script>
+
   ## Software Craftsmanship
   
-  June 2012
-
   <script async class="speakerdeck-embed" data-slide="16" data-id="4fcf866a4aab160369000dd1" data-ratio="1.77777777777778" src="//speakerdeck.com/assets/embed.js"></script>
 
   ## Introducting Gitlab
-  
-  Lightning Talk for Eindhoven.rb, april 2012
 
   <script async class="speakerdeck-embed" data-id="4f7da2d94156d9001f032da4" data-ratio="1.77777777777778" src="//speakerdeck.com/assets/embed.js"></script>

layouts/default.haml

@@ -32,6 +32,8 @@
           %ol
             %li= link_to "projects", "/projects/"
             %li= link_to "talks", "/talks/"
+            %li= link_to "gpg", "/gpg/"
+            %li= link_to "about", "/about/"
 
         .col-sm-3.align-right.hidden-xs
           %ol.social
@@ -59,7 +61,11 @@
         .col-sm-12
           .copyright
             %p
-              Copyright © 1999 - #{Time.now.year} Ariejan de Vroom
+              Content & Design Copyright © 1999 - #{Time.now.year} Ariejan de Vroom
+              %br
+              Powered by <a href="https://www.ruby-lang.org/en/">Ruby</a> and <a href="http://nanoc.ws/">Nanoc</a>
+              %br
+              %a(href="https://www.digitalocean.com/?refcode=04a9230a84e6" rel="nofollow") Powered by Digital Ocean
 
     :javascript
       (function(){

layouts/page.haml

@@ -4,12 +4,7 @@
       %h1.title= item[:title]
 
 .row
-  .col-sm-9
+  .col-sm-12
     .page
       .body
         = yield
-
-  .col-sm-3.hidden-xs
-    #adpacks
-      .bsarocks.bsap_a40a34b3f2d124df05e7c20ddaa79bd8#bsap_1287881
-      %a(href="http://adpacks.com" id="bsap_aplink") via Ad Packs

layouts/post.haml

@@ -6,31 +6,18 @@
       %p.meta= get_pretty_date(item)
 
 .row
-  .col-sm-9
+  .col-sm-12
     .post
       .body
         = yield
 
-      #coinwidget
+      #appreciation
         %small
-          %strong
+          Did you enjoy this post? Your generosity is mucy appreciated.
-            Your generosity is much appreciated!
           %br
-          Bitcoin:
+          %span#donate-button
-          :plain
+            :plain
-            <a href="bitcoin:1BgLftR3ucRDjCysYdRJxMAAt5PPBYGW5f"
+              <a class="coinbase-button" data-code="95beb1cb8404aa9476f24d13be4e6d16" data-button-style="custom_small" data-custom="ARIEJANNET-DONATION" href="https://coinbase.com/checkouts/95beb1cb8404aa9476f24d13be4e6d16">Donate Bitcoins</a><script src="https://coinbase.com/assets/button.js" type="text/javascript"></script> 
-               onmouseover="document.getElementById('btc-qr-image').src='/img/btc-qr.png';"
-               onmouseout="document.getElementById('btc-qr-image').src='/img/trans.gif';"
-            
-            >
-              1BgLftR3ucRDjCysYdRJxMAAt5PPBYGW5f
-              <img src="/img/trans.gif" id="btc-qr-image" style="z-index: 100; position: absolute" />
-            </a>
-            
-          (<a href="http://www.weusecoins.com/en/">learn more</a> or <a href="https://coinbase.com/?r=50750fd9cd9ad80200000197&utm_campaign=user-referral&src=referral-link">get started</a>)
-          %br
-          DOGE: DKXCwMRX3T4sSNUxXEYvF6AfGsue2EqyAw (<a href="http://dogecoin.com/get-started">learn more</a>)
-
       #recent-posts
         %h3 Recent posts on <strong>ariejan.net</strong>
         - sorted_articles[0..4].each do |article|
@@ -49,11 +36,3 @@
             dsq.src = '//ariejannet.disqus.com/embed.js';
             (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
         })();
-
-  .col-sm-3.hidden-xs
-    #adpacks
-      .bsarocks.bsap_a40a34b3f2d124df05e7c20ddaa79bd8#bsap_1287881
-      %a(href="http://adpacks.com" rel="nofollow" id="bsap_aplink") via Ad Packs
-
-    #digital-ocean
-      %a(href="https://www.digitalocean.com/?refcode=04a9230a84e6" rel="nofollow") Powered by Digital Ocean