Working on the complete re-design

author: Katharina Fey <kookie@spacekookie.de> 2018-01-21 21:56:53 +0100
committer: Katharina Fey <kookie@spacekookie.de> 2018-01-21 21:56:53 +0100
commit: fcd91ca44d2fd9c55164fb72810286f5d38d2c92 (patch)
tree: f5c68cafdeb777fb942c2a95a8b4a57031b474a5
parent: b2fb2f3028fcbd696de86a189919e48382dc0d81 (diff)
7 files changed, 135 insertions, 112 deletions
diff --git a/crumbs/LAYOUT.md b/crumbs/LAYOUT.md
new file mode 100644
index 0000000..a334353
--- /dev/null
+++ b/crumbs/LAYOUT.md
@@ -0,0 +1,9 @@
+# Crums layout
+
+The theme is structured as follows
+
+- Base (only extended)
+- Home (special)
+- Content (static)
+- Blog feed
+- Article
+\ No newline at end of file
diff --git a/crumbs/static/css/crums.css b/crumbs/static/css/crums.css
new file mode 100644
index 0000000..5220117
--- /dev/null
+++ b/crumbs/static/css/crums.css
@@ -0,0 +1,64 @@
+/**************************************
+
+   BASIC DEFINITIONS 
+
+**************************************/
+
+
+
+body {
+  font-family: 'Montserrat', sans-serif;
+  font-style: normal;
+  font-variant: normal;
+  /*font-size: 26px;*/
+  /*font-weight: 400;*/
+  color: #BEBEBE;
+  background-color: #222222;
+  background-image: none;
+  line-height: 32px;
+  -webkit-font-smoothing:antialiased;
+  text-rendering: optimizeLegibility;
+  margin: 0;
+}
+
+
+
+/**************************************
+
+   COLOUR BAR DEFINITIONS 
+
+**************************************/
+
+
+/* This is the block container */
+.colours {
+  width: 0 auto;
+  height: 50px;
+  margin: 0 auto;
+  display: flex;
+}
+
+/* This is a block */
+.colour {
+  display: flex;
+  flex-direction: column;
+  height: 75px;
+  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; }
diff --git a/crumbs/static/img/mastodon.png b/crumbs/static/img/mastodon.png
new file mode 100644
index 0000000..732afb8
--- /dev/null
+++ b/crumbs/static/img/mastodon.png
diff --git a/crumbs/static/img/mastodon.svg b/crumbs/static/img/mastodon.svg
new file mode 100644
index 0000000..4b72b3a
--- /dev/null
+++ b/crumbs/static/img/mastodon.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="61.076954mm" height="65.47831mm" viewBox="0 0 216.4144 232.00976"><path d="M211.80734 139.0875c-3.18125 16.36625-28.4925 34.2775-57.5625 37.74875-15.15875 1.80875-30.08375 3.47125-45.99875 2.74125-26.0275-1.1925-46.565-6.2125-46.565-6.2125 0 2.53375.15625 4.94625.46875 7.2025 3.38375 25.68625 25.47 27.225 46.39125 27.9425 21.11625.7225 39.91875-5.20625 39.91875-5.20625l.8675 19.09s-14.77 7.93125-41.08125 9.39c-14.50875.7975-32.52375-.365-53.50625-5.91875C9.23234 213.82 1.40609 165.31125.20859 116.09125c-.365-14.61375-.14-28.39375-.14-39.91875 0-50.33 32.97625-65.0825 32.97625-65.0825C49.67234 3.45375 78.20359.2425 107.86484 0h.72875c29.66125.2425 58.21125 3.45375 74.8375 11.09 0 0 32.975 14.7525 32.975 65.0825 0 0 .41375 37.13375-4.59875 62.915" fill="#3088d4"/><path d="M177.50984 80.077v60.94125h-24.14375v-59.15c0-12.46875-5.24625-18.7975-15.74-18.7975-11.6025 0-17.4175 7.5075-17.4175 22.3525v32.37625H96.20734V85.42325c0-14.845-5.81625-22.3525-17.41875-22.3525-10.49375 0-15.74 6.32875-15.74 18.7975v59.15H38.90484V80.077c0-12.455 3.17125-22.3525 9.54125-29.675 6.56875-7.3225 15.17125-11.07625 25.85-11.07625 12.355 0 21.71125 4.74875 27.8975 14.2475l6.01375 10.08125 6.015-10.08125c6.185-9.49875 15.54125-14.2475 27.8975-14.2475 10.6775 0 19.28 3.75375 25.85 11.07625 6.36875 7.3225 9.54 17.22 9.54 29.675" fill="#fff"/></svg>
diff --git a/crumbs/templates/home.html b/crumbs/templates/home.html
index 1dc43e8..503602b 100755
--- a/crumbs/templates/home.html
+++ b/crumbs/templates/home.html
@@ -1,128 +1,59 @@
 <!DOCTYPE html>
 <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">
+    {% block head %}
 
     <title>{% block title %}{{ SITENAME }}{% endblock title %}</title>
 
-    <!-- Stylesheets -->
-    {% if NEST_CSS_MINIFY %}
-    <link href="{{ SITEURL }}/theme/css/all.min.css" rel="stylesheet">
-    {% else %}
-    <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/home.css" rel="stylesheet">
-    {% endif %}
-    <!-- /Stylesheets -->
+    <!-- Inconsolata for code? -->
+    <!-- <link href="https://fonts.googleapis.com/css?family=Inconsolata|Quicksand:300,400|Roboto:300,400&amp;subset=cyrillic,cyrillic-ext" rel="stylesheet"> -->
 
-    <!-- RSS Feeds -->
-    {% if FEED_ALL_ATOM %}
-    <link href="{{ FEED_DOMAIN }}/{{ FEED_ALL_ATOM }}" type="application/atom+xml" rel="alternate" title="{{ SITENAME }} Full Atom Feed" />
-    {% endif %}
-    {% if FEED_ALL_RSS %}
-    <link href="{{ FEED_DOMAIN }}/{{ FEED_ALL_RSS }}" type="application/rss+xml" rel="alternate" title="{{ SITENAME }} Full RSS Feed" />
-    {% endif %}
-    {% if FEED_ATOM %}
-    <link href="{{ FEED_DOMAIN }}/{{ FEED_ATOM }}" type="application/atom+xml" rel="alternate" title="{{ SITENAME }} Atom Feed" />
-    {% endif %}
-    {% if FEED_RSS %}
-    <link href="{{ FEED_DOMAIN }}/{{ FEED_RSS }}" type="application/rss+xml" rel="alternate" title="{{ SITENAME }} RSS Feed" />
-    {% endif %}
-    {% if CATEGORY_FEED_ATOM and category %}
-    <link href="{{ FEED_DOMAIN }}/{{ CATEGORY_FEED_ATOM|format(category.slug) }}" type="application/atom+xml" rel="alternate" title="{{ SITENAME }} Categories Atom Feed" />
-    {% endif %}
-    {% if CATEGORY_FEED_RSS and category %}
-    <link href="{{ FEED_DOMAIN }}/{{ CATEGORY_FEED_RSS|format(category.slug) }}" type="application/rss+xml" rel="alternate" title="{{ SITENAME }} Categories RSS Feed" />
-    {% endif %}
-    {% if TAG_FEED_ATOM and tag %}
-    <link href="{{ FEED_DOMAIN }}/{{ TAG_FEED_ATOM|format(tag.slug) }}" type="application/atom+xml" rel="alternate" title="{{ SITENAME }} Tags Atom Feed" />
-    {% endif %}
-    {% if TAG_FEED_RSS and tag %}
-    <link href="{{ FEED_DOMAIN }}/{{ TAG_FEED_RSS|format(tag.slug) }}" type="application/rss+xml" rel="alternate" title="{{ SITENAME }} Tags RSS Feed" />
-    {% endif %}
-    <!-- /RSS Feeds -->
+    <!-- Fonts -->
+    <link href="https://fonts.googleapis.com/css?family=Montserrat:400,500|Raleway:200,200i,300,300i,400,400i,500" rel="stylesheet"> 
 
-    <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
-    <!--[if lt IE 9]>
-      <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
-      <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
-    <![endif]-->
-
-    {% if GOOGLE_ANALYTICS %}
-        <!-- Google Analytics -->
-        <script>
-          (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
-          (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
-          m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
-          })(window,document,'script','//www.google-analytics.com/analytics.js','ga');
+    <!-- Include font awesome -->
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
 
-          ga('create', '{{ GOOGLE_ANALYTICS }}', 'auto');
-          ga('send', 'pageview');
-        </script>
-        <!-- /Google Analytics -->
-    {% endif %}
+    <!-- Load bootstrap, then my own CSS -->
+    <link href="{{ SITEURL }}/theme/css/bootstrap.min.css" rel="stylesheet">
+    <link href="{{ SITEURL }}/theme/css/crums.css" rel="stylesheet">
+    <!-- /Stylesheets -->
 
-  {% endblock head %}
+    {% endblock head %}
   </head>
 
-  <body class="home">
-    <!-- <div class="hacky_bg nav"> -->
-
-      <!-- Header -->
-      <div class="header-container gradient">
-
-      <!-- Static nav bar and banner image and stuff -->
-      <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>
-          </div> <!-- header logo -->
-
-          <div class="nav pull-right">
-
-            {% for title, link in MENUITEMS %}
-              {% if 'http://' in link or 'https://' in link %}
-                <a class="nav" href="{{ link }}">{{ title }}</a>
-              {% else %}
-                <a class="nav" href="{{ SITEURL }}{{ link }}">{{ title }}</a>
-              {% endif %}
-            {% endfor %}
-      
-            {% if DISPLAY_PAGES_ON_MENU %}
-              {% for pg in PAGES %}
-                <a {% if pg == page %} class="active"{% endif %} href="{{ SITEURL }}/{{ pg.url }}">{{ pg.title }}</a>
-              {% endfor %}
-            {% endif %}
-
-          </div> <!-- end nav pull-right -->
-        </div> <!-- end header-nav -->
-
-        <h1>Fun memory violations</h1>
-
-        <p><b>Hi –</b> Welcome to my dusty internet hangout place.</p>
-
-        <p>My name is <b>Katharina Fey</b> and I'm a software developer from Berlin. I like taking photos, writing stories and starting way too many personal projects.</p>
-
-        <div class="icons">
-          <a href="https://twitter.com/spacekookie"><h1 id="twitter"><i class="fa fa-twitter"></i> Twitter</h1></a>
-          <a href="https://github.com/spacekookie"><h1 id="github"><i class="fa fa-github"></i> Github</h1></a>
-          <a href="https://spacekookie.de/kookie.txt"><h1 id="keys"><i class="fa fa-key"></i> Keys</h1></a>
-        </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>
-      </div> <!-- end container -->
+  <body>
+
+    <!-- Outer bootstrap container -->
+    <div class="container">
+
+      <h1>Fun Memory Violations</h1>
+
+      <div class="colours">
+        <div class="colour" id="colour1"></div>
+        <div class="colour" id="colour2"></div>
+        <div class="colour" id="colour3"></div>
+        <div class="colour" id="colour4"></div>
+        <div class="colour" id="colour5"></div>
+        <div class="colour" id="colour6"></div>
+        <div class="colour" id="colour7"></div>
+        <div class="colour" id="colour8"></div>
+        <div class="colour" id="colour9"></div>
+        <div class="colour" id="colour10"></div>
+        <div class="colour" id="colour11"></div>
+        <div class="colour" id="colour12"></div>
+        <div class="colour" id="colour13"></div>
+        <div class="colour" id="colour14"></div>
+        <div class="colour" id="colour15"></div>
+      </div>
+
+      <br/>
+   
+      <p>Hi – Welcome to my dusty internet hangout place.</p>
+
+      <p>I'm a software developer from Berlin. I like taking photos, writing stories and starting way too many personal projects.</p>
+    </div>
 
-    <!-- </div>  end hacky_bg -->
   </body>
 </html>
diff --git a/crumbs/templates/style.html b/crumbs/templates/style.html
new file mode 100644
index 0000000..756560c
--- /dev/null
+++ b/crumbs/templates/style.html
@@ -0,0 +1,7 @@
+<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/home.css" rel="stylesheet">
+\ No newline at end of file
diff --git a/crumbs/test.html b/crumbs/test.html
new file mode 100644
index 0000000..309b24d
--- /dev/null
+++ b/crumbs/test.html
@@ -0,0 +1,11 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <title>Test page</title>
+</head>
+<body>
+
+<b>Hi –</b> 
+
+</body>
+</html>
+\ No newline at end of file
author	Katharina Fey <kookie@spacekookie.de>	2018-01-21 21:56:53 +0100
committer	Katharina Fey <kookie@spacekookie.de>	2018-01-21 21:56:53 +0100
commit	fcd91ca44d2fd9c55164fb72810286f5d38d2c92 (patch)
tree	f5c68cafdeb777fb942c2a95a8b4a57031b474a5
parent	b2fb2f3028fcbd696de86a189919e48382dc0d81 (diff)