From 1b249463d0f4a81d930d12435932b7416c0b546a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?J=C3=B6rg=20Thalheim?= <joerg@higgsboson.tk>
Date: Sun, 26 Aug 2012 16:59:55 +0200
Subject: [PATCH] more susy related stuff

---
 source/joerg/index.slim          | 10 +++++-----
 source/stylesheets/site.css.scss | 21 +++++++++++++++++++++
 2 files changed, 26 insertions(+), 5 deletions(-)

diff --git a/source/joerg/index.slim b/source/joerg/index.slim
index 7e44601..b42b443 100644
--- a/source/joerg/index.slim
+++ b/source/joerg/index.slim
@@ -2,7 +2,7 @@
 head_profile: http://gmpg.org/xfn/11
 ---
 h1 Jörg Thalheim / Mic92
-div class="grid_4"
+div.span3
   h2 Contact
   dl
     dt Email:
@@ -14,7 +14,8 @@ div class="grid_4"
     dt IRC:
     dd.icon-comment-alt
       a rel="me" href="irc://irc.freenode.net/" Mic92
-div class="grid_4"
+
+div.span3
   h2 Content
   dl
     dt Microblogging:
@@ -31,7 +32,7 @@ div class="grid_4"
     dd.icon-google-plus
       a rel="me" href="https://plus.google.com/107837103594826869647/posts" jthalheim@gmail.com
 
-div class="grid_4"
+div.span3_omega
   h2 Rest
   dl
     dt Github Achievements:
@@ -39,5 +40,4 @@ div class="grid_4"
       a rel="me" href="http://coderwall.com/mic92" coderwall.com/mic92
     dt Stackoverflow:
     dd.icon-user
-      a rel="me" href="http://stackoverflow.com/users/1061240/mic92" stackoverflow.com/users/1061240/mic92
-
+      a rel="me" href="http://stackoverflow.com/users/1061240/mic92" stackoverflow.com/users/1061240
diff --git a/source/stylesheets/site.css.scss b/source/stylesheets/site.css.scss
index 340f4a4..cd2d419 100644
--- a/source/stylesheets/site.css.scss
+++ b/source/stylesheets/site.css.scss
@@ -54,6 +54,7 @@ footer {
 
   #main {
     margin-top: 50px;
+    @include clearfix;
   }
   a:hover {
     color: darken($yellow, 10%);
@@ -69,6 +70,10 @@ footer {
   @include transition-timing-function(ease-in);
 }
 
+.span3 { @include span-columns(3,9); }
+.span3_omega { @include span-columns(3 omega,9); }
+.clear { clear: both; }
+
 #sitelink {
   float: left;
   font-size: 1.1em;
@@ -83,6 +88,22 @@ footer {
   @include text-shadow(0px, -1px, 1px, rgb(255,255,255), 0px, 1px, 1px, rgb(102,102,102));
 }
 
+@media screen and (max-width: 900) {
+  dd { margin-left: 2em;}
+}
+@media screen and (max-width: 770) {
+  dd { margin-left: 1em;}
+}
+@media screen and (max-width: 770) {
+  dd { margin-left: 1em;}
+}
+@media screen and (max-width: 740) {
+  dd { margin-left: 0;}
+}
+@media screen and (max-width: 600) {
+  .span3 { @include reset-columns}
+  .span3_omega { @include reset-columns}
+}
 
 #overview {
   font-size: 2em;