Adding new content and template pages

7 files changed, 184 insertions, 108 deletions

diff --git a/crumbs/static/css/cr_gay_override.css b/crumbs/static/css/cr_gay_override.css
new file mode 100644
index 0000000..b28cb50
--- /dev/null
+++ b/crumbs/static/css/cr_gay_override.css
@@ -0,0 +1,16 @@
+/* This is the block container */
+.gay {
+    width: 0 auto;
+    height: 12px;
+    margin: 0 auto;
+    display: flex;
+    padding-bottom: 25px;
+}
+
+/* This is a block */
+.colour {
+    display: flex;
+    flex-direction: column;
+    height: 12px;
+    width: 75px;
+}
diff --git a/crumbs/static/css/cr_title.css b/crumbs/static/css/cr_title.css
index 742a535..3eb3466 100644
--- a/crumbs/static/css/cr_title.css
+++ b/crumbs/static/css/cr_title.css
@@ -4,13 +4,18 @@ This file contains all definitions are are EXCLUSIVE for the title
 
 */
 
+div.navigation {
+    padding-top: 12px;
+    padding-bottom: 75px;
+    padding-right: 32px;
+    height: 75px;
+    line-height: 75px;
+  }
+  
+
 .title {
     padding-top: 20px;
     padding-bottom: 50px;
-}
-
-.title h1 {
-    font-family: 'Inconsolata', monospace;
     font-size: 58px;
 }
 
@@ -30,17 +35,16 @@ This file contains all definitions are are EXCLUSIVE for the title
 #t-color-ylw { color: #fdcb71; }
 #t-color-grn { color: #99cb9b; }
 
-
 /* This is the block container */
-.colours {
+.gay {
     width: 0 auto;
     height: 50px;
     margin: 0 auto;
     display: flex;
     padding-bottom: 150px;
 }
-  
-  /* This is a block */
+
+/* This is a block */
 .colour {
     display: flex;
     flex-direction: column;
@@ -48,24 +52,6 @@ This file contains all definitions are are EXCLUSIVE for the title
     width: 75px;
 }
 
-/* Colour defitions */
-.colour1  { background-color: #3c3c3c; }
-.colour2  { background-color: #525252; }
-.colour3  { background-color: #74736a; }
-.colour4  { background-color: #9f9e93; }
-.colour5  { background-color: #d2cfc7; }
-.colour6  { background-color: #e7e5df; }
-.colour7  { background-color: #f1f0ec; }
-.colour8  { background-color: #ef787b; }
-.colour9  { background-color: #f6915f; }
-.colour10 { background-color: #fdcb71; }
-.colour11 { background-color: #99cb9b; }
-.colour12 { background-color: #6ccaca; }
-.colour13 { background-color: #6997c8; }
-.colour14 { background-color: #ca98c9; }
-.colour15 { background-color: #ce7b59; }
-  
-
 .span {
     display: inline-block;
 }
diff --git a/crumbs/static/css/crumbs.css b/crumbs/static/css/crumbs.css
index 3ec495a..7f276c6 100644
--- a/crumbs/static/css/crumbs.css
+++ b/crumbs/static/css/crumbs.css
@@ -21,13 +21,16 @@ p {
   font-weight: 300;
 }
 
+h1, h2, h3, h4 {
+  font-family: 'Inconsolata', monospace;
+}
 
 div.navigation {
   padding-top: 12px;
-  padding-bottom: 75px;
+  padding-bottom: 25px;
   padding-right: 32px;
-  height: 75px;
-  line-height: 75px;
+  height: 50px;
+  line-height: 50px;
 }
 
 div.navigation a {
@@ -42,6 +45,26 @@ div.navigation a {
   /* transition: all 0.2s ease-out; */
 }
 
-div.navigation a:hover {
+/*
+
+    ✨ COLOUR DEFINITIONS ✨
+
+  These colours are re-used in many parts of the website
+
+*/
 
-}
\ No newline at end of file
+.colour1  { background-color: #3c3c3c; }
+.colour2  { background-color: #525252; }
+.colour3  { background-color: #74736a; }
+.colour4  { background-color: #9f9e93; }
+.colour5  { background-color: #d2cfc7; }
+.colour6  { background-color: #e7e5df; }
+.colour7  { background-color: #f1f0ec; }
+.colour8  { background-color: #ef787b; } /* Red */
+.colour9  { background-color: #f6915f; } /* Orange */
+.colour10 { background-color: #fdcb71; } /* Yellow */
+.colour11 { background-color: #99cb9b; } /* Green */
+.colour12 { background-color: #6ccaca; } /* Cyan */
+.colour13 { background-color: #6997c8; } /* Blue */
+.colour14 { background-color: #ca98c9; } /* Purple */
+.colour15 { background-color: #ce7b59; } /* Brown */
diff --git a/crumbs/static/css/nest.css b/crumbs/static/css/nest.css
index f822494..596bb02 100755
--- a/crumbs/static/css/nest.css
+++ b/crumbs/static/css/nest.css
@@ -113,7 +113,7 @@ code { padding: 3px 3px; }
 	padding-bottom:20px;
 	padding-left:20px;
 	padding-right:0px;
-	background: #BBBBBB <!--#333-->;
+	background: #BBBBBB;
 	font-size:14px;
 	font-weight:400;
 	font-family:Consolas,monaco,monospace;
@@ -199,7 +199,7 @@ h5 {
     float:right;
 }
 .header-nav .nav a {
-   font-weight:300;
+  font-weight:300;
   font-size: 18px;
   color:#fff;
   text-decoration:none;
diff --git a/crumbs/templates/base.html b/crumbs/templates/base.html
index 17866d2..bccf49d 100755
--- a/crumbs/templates/base.html
+++ b/crumbs/templates/base.html
@@ -1,41 +1,90 @@
 <!DOCTYPE html>
-<!-- TEMPLATE: BASE -->
-
 <html lang="{{ DEFAULT_LANG }}">
     <head>
-    {% block head %}
+        <meta charset="utf-8">
+        <!-- <title>{% block title %}{{ SITENAME }}{% endblock title %}</title> -->
+
+        <!-- Load Montserrat, Inconsolata and font-awesome -->
+        <link href="https://fonts.googleapis.com/css?family=Montserrat:200,300,400,500;subset=cyrillic,latin-ext" rel="stylesheet"> 
+        <link href="https://fonts.googleapis.com/css?family=Inconsolata" rel="stylesheet"> 
+        <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
+
+        <!-- Load bootstrap, then my own CSS -->
+        <link href="{{ SITEURL }}/theme/css/bootstrap.min.css" rel="stylesheet">
+        <link href="{{ SITEURL }}/theme/css/crumbs.css" rel="stylesheet">
+        <link href="{{ SITEURL }}/theme/css/cr_gay_override.css" rel="stylesheet">
+
+    </head>
+    <body>
+        <div class="container">
+
+            <!-- HEADER FOR EVERY PAGE -->
+            <div>
+                <div class="navigation">
+                    <div class="nav pull-right">
+        
+                        <!-- Loop through all pages -->
+                        {% for title, link in MENUITEMS %}
+                            <!-- Do magic with http/https -->
+                            {% if 'http://' in link or 'https://' in link %}
+                                <a class="naughty" href="{{ link }}">{{ title }} </a>
+                            {% else %}
+                                <a class="naughty" href="{{ SITEURL }}{{ link }}">{{ title }} </a>
+                            {% endif %}
+                        {% endfor %}
+                    </div>
+                </div>
+
+                <br/>
+
+                <!-- We draw a flattened version of the colour bar navigation -->
+                {% include "super_gay.html" %}
+            </div>
+            <!-- END HEADER FOR EVERY PAGE -->
+
+
+        </div>
+
+    </body>
+</html>
+
 
-    <meta charset="utf-8">
+<!-- <!DOCTYPE html> -->
+<!-- TEMPLATE: BASE -->
+
+<!-- <html lang="{{ DEFAULT_LANG }}"> -->
+    <!-- <head> -->
+    <!-- {% block head %} -->
+
+    <!-- <meta charset="utf-8">
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
     <meta name="viewport" content="width=device-width, initial-scale=1">
     <meta name="description" content="{% block description %}{% endblock description %}">
     <meta name="keywords" content="{% block keywords %}{% endblock keywords %}">
-    <link rel="icon" href="{{ SITEURL }}/favicon.ico">
-
-    <title>{% block title %}{{ SITENAME }}{% endblock title %}</title>
+    <link rel="icon" href="{{ SITEURL }}/favicon.ico"> -->
 
     <!-- Stylesheets -->
-    <link href="https://fonts.googleapis.com/css?family=Inconsolata|Quicksand:300,400|Roboto:300,400&amp;subset=cyrillic,cyrillic-ext" rel="stylesheet">
+    <!-- <link href="https://fonts.googleapis.com/css?family=Inconsolata|Quicksand:300,400|Roboto:300,400&amp;subset=cyrillic,cyrillic-ext" rel="stylesheet">
     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
     <link href="{{ SITEURL }}/theme/css/bootstrap.min.css" rel="stylesheet">
     <link href="{{ SITEURL }}/theme/css/fonts.css" rel="stylesheet">
     <link href="{{ SITEURL }}/theme/css/nest.css" rel="stylesheet">
-    <link href="{{ SITEURL }}/theme/css/pygment.css" rel="stylesheet">
+    <link href="{{ SITEURL }}/theme/css/pygment.css" rel="stylesheet"> -->
 
     <!-- <link href="{{ SITEURL }}/theme/css/home.css" rel="stylesheet"> -->
     <!-- /Stylesheets -->
 
-    {% endblock head %}
+    <!-- {% endblock head %}
     </head>
 
-    <body>
+    <body> -->
 
       <!-- Header -->
-      {% block headerstyle %}
-      {% endblock headerstyle %}
+      <!-- {% block headerstyle %}
+      {% endblock headerstyle %} -->
 
       <!-- Static navbar -->
-      <div class="container">
+      <!-- <div class="container">
         <div class="header-nav">
           <div class="header-logo">
             <a class="pull-left" href="{{ SITEURL }}/"><img class="mr20" width=192px height=64px src="{{ SITEURL }}{{NEST_HEADER_LOGO or "/images/logo3.png" }}" alt="logo"></a>
@@ -56,26 +105,26 @@
             {% endif %}
           </div>
         </div>
-      </div>
+      </div> -->
       <!-- /Static navbar -->
 
       <!-- Header -->
-      {% block header %}
-      {% endblock header %}
+      <!-- {% block header %}
+      {% endblock header %} -->
       <!-- /Header -->
 
-    </div>
+    <!-- </div> -->
     <!-- /Header -->
 
 
         <!-- Content -->
 
-        <div class="container">
-          <div class="row">
+        <!-- <div class="container">
+          <div class="row"> -->
 
             <!-- This is our content container in all it's glory -->
-            {% block content %}
-            {% endblock %}
+            <!-- {% block content %}
+            {% endblock %} -->
 
             <!-- Append the navigation box -->
 <!--             <div class="col-lg-3 content archive">
@@ -98,11 +147,11 @@
                 <img src="{{ SITEURL }}/theme/img/cat.png">
 
             </div> -->
-        </div>
+        <!-- </div> -->
         <!-- /Content --> 
 
         <!-- Footer -->
-        <div class="footer gradient-2">
+        <!-- <div class="footer gradient-2">
             <div class="container footer-container">
                 <div class="row">
                     <div class="col-xs-4 col-sm-4 col-md-4 col-lg-4">
@@ -141,9 +190,11 @@
                     </div> 
                 </div>
             </div>
-        </div>
+        </div> -->
         <!-- /Footer -->
-    </body>
+    <!-- </body> -->
 
-    <script src="{{ SITEURL }}/theme/js/random_colour.js"></script>
-</html>
+
+
+    <!-- <script src="{{ SITEURL }}/theme/js/random_colour.js"></script> -->
+<!-- </html> -->
diff --git a/crumbs/templates/home.html b/crumbs/templates/home.html
index 3199d9c..50991e6 100755
--- a/crumbs/templates/home.html
+++ b/crumbs/templates/home.html
@@ -26,56 +26,38 @@
     <!-- Outer bootstrap container -->
     <div class="container">
 
-      <!-- Add dynamic header -->
-      <div class="navigation">
-        <div class="nav pull-right">
-
-          <!-- Loop through all pages -->
-          {% for title, link in MENUITEMS %}
-
-            <!-- Do magic with http/https -->
-            {% if 'http://' in link or 'https://' in link %}
-              <a class="naughty" href="{{ link }}">{{ title }} </a>
-            {% else %}
-              <a class="naughty" href="{{ SITEURL }}{{ link }}">{{ title }} </a>
-            {% endif %}
-
-          {% endfor %}
+        <!-- Add dynamic header -->
+        <div class="navigation">
+            <div class="nav pull-right">
+
+                <!-- Loop through all pages -->
+                {% for title, link in MENUITEMS %}
+                    <!-- Do magic with http/https -->
+                    {% if 'http://' in link or 'https://' in link %}
+                        <a class="naughty" href="{{ link }}">{{ title }} </a>
+                    {% else %}
+                        <a class="naughty" href="{{ SITEURL }}{{ link }}">{{ title }} </a>
+                    {% endif %}
+                {% endfor %}
+            </div>
+        </div>
+        <!-- /Static navbar -->
+
+        <hr/>
+
+        <!-- The page title -->
+        <div class="title" title="Inconsolata is my favourite monospace font, after all...">
+            <h1>
+                <span id="t-color-red"><b># ~ </b></span>
+                <span id="t-color-org">Fun</span>
+                <span id="t-color-ylw">Memory</span>
+                <span id="t-color-grn">Violations</span>
+                <span class="cursor" id="cursor">▁</span>
+            </h1>
         </div>
-      </div>
-      <!-- /Static navbar -->
-
-      <hr/>
-
-      <!-- The page title -->
-      <div class="title" title="Inconsolata is my favourite monospace font">
-        <h1>
-          <span id="t-color-red"><b># ~ </b></span>
-          <span id="t-color-org">Fun</span>
-          <span id="t-color-ylw">Memory</span>
-          <span id="t-color-grn">Violations</span>
-          <span class="cursor" id="cursor">▁</span>
-        </h1>
-      </div>
 
       <!-- Cool colour bar, yo -->
-      <div class="colours">
-        <div class="colour colour1"></div>
-        <div class="colour colour2"></div>
-        <div class="colour colour3"></div>
-        <div class="colour colour4"></div>
-        <div class="colour colour5"></div>
-        <div class="colour colour6"></div>
-        <div class="colour colour7"></div>
-        <div class="colour colour8"></div>
-        <div class="colour colour9"></div>
-        <div class="colour colour10"></div>
-        <div class="colour colour11"></div>
-        <div class="colour colour12"></div>
-        <div class="colour colour13"></div>
-        <div class="colour colour14"></div>
-        <div class="colour colour15"></div>
-      </div>
+      {% include "super_gay.html" %}
 
       <p>
         <b>Hi – </b>Welcome to my dusty internet hangout place.
@@ -92,6 +74,7 @@
       </div>
 
       <p>To get in touch with me, you can also send an e-mail to <a href="mailto:kookie@spacekookie.de" id="email"><b>kookie@spacekookie.de</b></a></p>
+      <!-- <p>(My RFC2549 complient Prime MTU is currently out of comission)</p> -->
 
     </div>
 
diff --git a/crumbs/templates/super_gay.html b/crumbs/templates/super_gay.html
new file mode 100644
index 0000000..6089ec4
--- /dev/null
+++ b/crumbs/templates/super_gay.html
@@ -0,0 +1,17 @@
+<div class="gay">
+    <div class="colour colour1"></div>
+    <div class="colour colour2"></div>
+    <div class="colour colour3"></div>
+    <div class="colour colour4"></div>
+    <div class="colour colour5"></div>
+    <div class="colour colour6"></div>
+    <div class="colour colour7"></div>
+    <div class="colour colour8"></div>
+    <div class="colour colour9"></div>
+    <div class="colour colour10"></div>
+    <div class="colour colour11"></div>
+    <div class="colour colour12"></div>
+    <div class="colour colour13"></div>
+    <div class="colour colour14"></div>
+    <div class="colour colour15"></div>
+</div>