Initial commit

3 files changed, 115 insertions, 0 deletions

diff --git a/style/colors.less b/style/colors.less
new file mode 100644
index 0000000..2518b5c
--- /dev/null
+++ b/style/colors.less
@@ -0,0 +1,25 @@
+/* Color scheme from http://paletton.com/#uid=53v0u0k7UUa3cZA5wXlaiQ5cFL3 */
+
+@color-primary-0: #B5D6EB;	/* Main Primary color */
+@color-primary-1: #E3F2FB;
+@color-primary-2: #CDE5F5;
+@color-primary-3: #9CC5E0;
+@color-primary-4: #83B3D1;
+
+@color-secondary-1-0: #BCBFEE;	/* Main Secondary color (1) */
+@color-secondary-1-1: #E6E7FC;
+@color-secondary-1-2: #D2D4F6;
+@color-secondary-1-3: #A6A9E5;
+@color-secondary-1-4: #8F93D8;
+
+@color-secondary-2-0: #FFEFC0;	/* Main Secondary color (2) */
+@color-secondary-2-1: #FFF8E6;
+@color-secondary-2-2: #FFF4D3;
+@color-secondary-2-3: #FFEAAD;
+@color-secondary-2-4: #FFE59A;
+
+@color-complement-0: #FFE3C0;	/* Main Complement color */
+@color-complement-1: #FFF4E6;
+@color-complement-2: #FFECD3;
+@color-complement-3: #FFDBAD;
+@color-complement-4: #FFD29A;
diff --git a/style/main.less b/style/main.less
new file mode 100644
index 0000000..0ad9c47
--- /dev/null
+++ b/style/main.less
@@ -0,0 +1,62 @@
+/* main.less */
+@import "../node_modules/normalize.css/normalize.css";
+@import "colors.less";
+
+/* page layout */
+body {
+    text-align: center;
+    line-height: 2em;
+}
+
+@import "menu.less";
+
+/* main content */
+main {
+    background: @color-secondary-1-3;
+    margin: auto;
+    padding: 1em;
+    border-radius: 2px;
+
+    max-width: 800px;
+    text-align: left;
+}
+
+body[data-page="home"] {
+    .intro {
+        height: 300px;
+        padding: 1em;
+        margin: 1em;
+        background-color: @color-secondary-2-1;
+    }
+    .block {
+        background: no-repeat url(../images/filler.png);
+        height: 200px;
+        background-color: @color-secondary-2-1;
+        padding: 1em;
+        margin: 1em;
+
+        transition: background 0.2s; /* TODO floats over text */
+        &:hover {
+            background-color: @color-secondary-2-0;
+        }
+
+        p {
+            margin: 1em;
+        }
+
+        &:nth-child(2n+1) {
+            padding-left: 200px;
+        }
+        &:nth-child(2n) {
+            background-position: right;
+            padding-right: 200px;
+        }
+    }
+}
+
+/* footer */
+footer {
+    background: @color-secondary-1-4;
+}
+
+/* vim: set sw=4 et ts=4: */
diff --git a/style/menu.less b/style/menu.less
new file mode 100644
index 0000000..60d87ec
--- /dev/null
+++ b/style/menu.less
@@ -0,0 +1,28 @@
+/* menu */
+@import "colors.less";
+
+nav {
+    margin: 3em 0;
+
+    ul {
+        background: @color-primary-0;
+    }
+
+    li {
+        display: inline-block;
+    }
+    /* links */
+    a:link {
+        margin: 3px;
+        padding: 0.5em 1em;
+        background: @color-secondary-1-1;
+        border-radius: 5px;
+        box-shadow: @color-secondary-1-2 0 0 0px 1px;
+        display: inline-block;
+    }
+    a:link:hover {
+        background: @color-secondary-1-2;
+    }
+}
+
+/* vim: set sw=4 et ts=4: */