From f31eec17b915e90bb7d0d44843b543e0a0f4085e Mon Sep 17 00:00:00 2001
From: Harald Eilertsen <haraldei@anduin.net>
Date: Mon, 3 Aug 2015 20:56:44 +0200
Subject: Add styling.

This is mainly the stylesheets from the RefineryCMS based site, but I've stripped away
bootstrap and simplified it a bit. Probably more suff that can be tossed out later.
---
 blog/_sass/_common.scss           |   5 ++
 blog/_sass/_config.scss           |  12 +++
 blog/assets/images/background.jpg | Bin 0 -> 134714 bytes
 blog/assets/images/header.png     | Bin 0 -> 14844 bytes
 blog/css/main.scss                | 153 ++++++++++++++++++++++++++++++++++++++
 5 files changed, 170 insertions(+)
 create mode 100644 blog/_sass/_common.scss
 create mode 100644 blog/_sass/_config.scss
 create mode 100644 blog/assets/images/background.jpg
 create mode 100644 blog/assets/images/header.png
 create mode 100644 blog/css/main.scss

diff --git a/blog/_sass/_common.scss b/blog/_sass/_common.scss
new file mode 100644
index 0000000..a392022
--- /dev/null
+++ b/blog/_sass/_common.scss
@@ -0,0 +1,5 @@
+@mixin round-corners {
+    border: {
+        radius: 5px;
+    }
+}
diff --git a/blog/_sass/_config.scss b/blog/_sass/_config.scss
new file mode 100644
index 0000000..4054059
--- /dev/null
+++ b/blog/_sass/_config.scss
@@ -0,0 +1,12 @@
+$body-bg: black;
+$text-color: #aaa;
+$link-color: #666;
+$side-bar-background: rgba(20, 20, 20, 0.7);
+$menu-bar-background: $side-bar-background;
+
+
+$nav-link-padding: 5px 10px;
+$nav-link-hover-bg: rgba(40, 70, 80, 0.7);
+$nav-link-hover-color: #ccf;
+$nav-pills-active-link-hover-bg: $nav-link-hover-bg;
+$nav-pills-active-link-hover-color: $nav-link-hover-color;
diff --git a/blog/assets/images/background.jpg b/blog/assets/images/background.jpg
new file mode 100644
index 0000000..c650208
Binary files /dev/null and b/blog/assets/images/background.jpg differ
diff --git a/blog/assets/images/header.png b/blog/assets/images/header.png
new file mode 100644
index 0000000..649999a
Binary files /dev/null and b/blog/assets/images/header.png differ
diff --git a/blog/css/main.scss b/blog/css/main.scss
new file mode 100644
index 0000000..8180956
--- /dev/null
+++ b/blog/css/main.scss
@@ -0,0 +1,153 @@
+---
+# Only the main Sass file needs front matter (the dashes are enough)
+---
+@import "config";
+@import "common";
+
+body {
+    background-color: black;
+    color: $text-color;
+    line-height: 135%;
+
+    background: {
+        image: url({{ "/assets/images/background.jpg" | prepend: site.baseurl_root }});
+        repeat: no-repeat;
+        position: center top;
+        color: black;
+    }
+}
+
+a {
+    color: #686;
+    &:hover {
+        color: lighten(#686, 5%);
+    }
+}
+
+#page-container {
+    position: relative;
+    width: 28cm;
+    margin: {
+        top: 10mm;
+        left: auto;
+        right: auto;
+    }
+    footer {
+        clear: both;
+    }
+}
+
+#body-content {
+    position: relative;
+    min-height: 700px;
+
+    padding: 1em;
+    @include round-corners;
+
+    #body {
+        padding-right: 20em;
+    }
+
+    #side_body {
+        position: absolute;
+        width: 244px;
+        bottom: 1em;
+        right: 1em;
+        top: 1em;
+        overflow: auto;
+        .inner {
+            padding: 10px;
+        }
+        background: {
+            color: $side-bar-background
+        }
+        @include round-corners;
+
+        h1 {
+            font: {
+                size: 20px;
+                weight: bold;
+            }
+        }
+
+        h2 {
+            font: {
+                size: 16px;
+                weight: bold;
+            }
+        }
+
+        h3 {
+            font: {
+                size: 12px;
+                weight: bold;
+            }
+        }
+    }
+
+    #news, #links {
+        width: 8.55cm;
+        float: left;
+        margin-right: 5mm;
+
+        header {
+            date {
+                font-size: 10pt;
+            }
+            h1 {
+                font: {
+                    size: 13pt;
+                    weight: bold;
+                }
+                margin: {
+                    bottom: 5mm;
+                    top: 0;
+                }
+                a {
+                    text-decoration: none;
+                }
+            }
+        }
+
+        &.wide {
+            width: 100%;
+        }
+    }
+}
+
+#logo {
+    position: relative;
+    font-size: 110%;
+    font-weight: 600;
+    width: 479px;
+    text-align: center;
+}
+
+#menu-bar, #next_prev_article {
+    margin-bottom: 1em;
+    background: {
+        color: $menu-bar-background;
+    }
+    font-size: 110%;
+    font-weight: 600;
+    @include round-corners;
+    ul {
+        li {
+            a {
+                color: $link-color;
+            }
+        }
+        .selected {
+            background-color: $nav-pills-active-link-hover-bg;
+        }
+        &.menu-flags {
+            float: right;
+        }
+    }
+}
+
+#banner-pos-1 {
+    position: absolute;
+    top: 1.5em;
+    right: 0;
+}
-- 
cgit v1.2.3