From b6eec85f28cae0993ac595941447662d26c80278 Mon Sep 17 00:00:00 2001
From: Markus Birth <mbirth@gmail.com>
Date: Sun, 22 Feb 2015 17:13:04 +0100
Subject: [PATCH] Use SASS instead of plain CSS.

---
 css/custom.css  | 109 ------------------------------------------------
 css/custom.sass |  95 +++++++++++++++++++++++++++++++++++++++++
 2 files changed, 95 insertions(+), 109 deletions(-)
 delete mode 100644 css/custom.css
 create mode 100644 css/custom.sass

diff --git a/css/custom.css b/css/custom.css
deleted file mode 100644
index e5278fe..0000000
--- a/css/custom.css
+++ /dev/null
@@ -1,109 +0,0 @@
-abbr, acronym {
-    border-bottom: 1px dotted #888;
-    cursor: help;
-}
-
-#main_content li {
-    margin-bottom: 0.5em;
-}
-
-#headerleft, #headerright {
-  display: inline-block;
-}
-
-#headerright {
-  width: 400px;
-  vertical-align: top;
-  padding-left: 100px;
-}
-
-.footnote {
-    font-size: 8pt;
-}
-
-.footnotes {
-    padding-top: 1em;
-    font-size: 8pt;
-}
-
-#related {
-    overflow: visible;
-    white-space: nowrap;
-}
-
-#nextpost {
-    float: left;
-}
-
-#prevpost {
-    float: right;
-}
-
-#comments {
-    clear: both;
-}
-
-.noteclassic, .noteimportant, .notewarning, .notetip {
-  margin: 2em;
-  margin-left: auto;
-  margin-right: auto;
-  width: 70% !important;
-  min-height: 40px;
-  clear: both;
-  text-align: justify;
-  vertical-align: middle;
-  border-collapse: collapse;
-  padding: 15px 20px 15px 80px;
-  background-position: 20px 50%;
-  background-repeat: no-repeat;
-  -moz-border-radius: 20px;
-  -khtml-border-radius: 20px;
-  border-radius: 20px;
-}
-
-.noteclassic {
-  border: 2px solid #99d;
-  background-color: rgba(153, 153, 221, 0.1);
-  /*background-color: #eef;*/
-  background-image: url(../images/note.png);
-}
-
-.noteimportant {
-  border: 2px solid #ff0;
-  background-color: rgba(255, 255, 0, 0.1);
-  /*background-color: #ffc;*/
-  background-image: url(../images/important.png);
-}
-
-.notewarning {
-  border: 2px solid #d99;
-  background-color: rgba(221, 153, 153, 0.1);
-  /*background-color: #fdd;*/
-  background-image: url(../images/warning.png);
-}
-
-.notetip {
-  border: 2px solid #9d9;
-  background-color: rgba(153, 221, 153, 0.1);
-  /*background-color: #dfd;*/
-  background-image: url(../images/tip.png);
-}
-
-kbd {
-    color: #333;
-    background-color: white;
-    text-align: center;
-    border-left: 1px solid #cfcfcf;
-    border-top: 1px solid #cfcfcf;
-    border-right: 2px solid #666;
-    border-bottom: 2px solid #666;
-    -moz-border-radius: 4px 4px 4px 4px;
-    padding-left: 1px;
-    padding-top: 0px;
-    padding-right: 2px;
-    padding-bottom: 0px;
-    margin-left: 2px;
-    margin-right: 2px;
-    vertical-align: top;
-    font-family: sans-serif;
-}
diff --git a/css/custom.sass b/css/custom.sass
new file mode 100644
index 0000000..2586aaf
--- /dev/null
+++ b/css/custom.sass
@@ -0,0 +1,95 @@
+---
+---
+abbr, acronym
+    border-bottom: 1px dotted #888
+    cursor: help
+
+#main_content li
+    margin-bottom: 0.5em
+
+#headerleft, #headerright
+    display: inline-block
+
+#headerright
+    width: 400px
+    vertical-align: top
+    padding-left: 100px
+
+.footnote
+    font-size: 8pt
+
+.footnotes
+    padding-top: 1em
+    font-size: 8pt
+
+#related
+    overflow: visible
+    white-space: nowrap
+
+#nextpost
+    float: left
+
+#prevpost
+    float: right
+
+#comments
+    clear: both
+
+.noteclassic, .noteimportant, .notewarning, .notetip
+    margin: 2em
+    margin-left: auto
+    margin-right: auto
+    width: 70% !important
+    min-height: 40px
+    clear: both
+    text-align: justify
+    vertical-align: middle
+    border-collapse: collapse
+    padding: 15px 20px 15px 80px
+    background-position: 20px 50%
+    background-repeat: no-repeat
+    -moz-border-radius: 20px
+    -khtml-border-radius: 20px
+    border-radius: 20px
+
+.noteclassic
+    border: 2px solid #99d
+    background-color: rgba(153, 153, 221, 0.1)
+//    background-color: #eef
+    background-image: url(../images/note.png)
+
+.noteimportant
+    border: 2px solid #ff0
+    background-color: rgba(255, 255, 0, 0.1)
+//    background-color: #ffc
+    background-image: url(../images/important.png)
+
+.notewarning
+    border: 2px solid #d99
+    background-color: rgba(221, 153, 153, 0.1)
+//    background-color: #fdd
+    background-image: url(../images/warning.png)
+
+.notetip
+    border: 2px solid #9d9
+    background-color: rgba(153, 221, 153, 0.1)
+//    background-color: #dfd
+    background-image: url(../images/tip.png)
+
+kbd
+    color: #333
+    background-color: white
+    text-align: center
+    border-left: 1px solid #cfcfcf
+    border-top: 1px solid #cfcfcf
+    border-right: 2px solid #666
+    border-bottom: 2px solid #666
+    -moz-border-radius: 4px 4px 4px 4px
+    padding-left: 1px
+    padding-top: 0px
+    padding-right: 2px
+    padding-bottom: 0px
+    margin-left: 2px
+    margin-right: 2px
+    vertical-align: top
+    font-family: sans-serif