simplify css, add image gradient, fix rss path

14 files changed, 88 insertions, 27 deletions

diff --git a/static/bg.webp b/static/bg.webp
deleted file mode 100644
index 36ca46a..0000000
--- a/static/bg.webp
+++ /dev/null
diff --git a/static/code.webp b/static/code.webp
new file mode 100644
index 0000000..9cd5ef1
--- /dev/null
+++ b/static/code.webp
diff --git a/static/fineburlap.gif b/static/fineburlap.gif
deleted file mode 100644
index 100ccc5..0000000
--- a/static/fineburlap.gif
+++ /dev/null
diff --git a/static/mail.webp b/static/mail.webp
new file mode 100644
index 0000000..51c5016
--- /dev/null
+++ b/static/mail.webp
diff --git a/static/multi055.gif b/static/multi055.gif
new file mode 100644
index 0000000..11bea18
--- /dev/null
+++ b/static/multi055.gif
diff --git a/static/rss.webp b/static/rss.webp
new file mode 100644
index 0000000..e6c1707
--- /dev/null
+++ b/static/rss.webp
diff --git a/static/style.css b/static/style.css
index c2ca2ef..dc8c347 100644
--- a/static/style.css
+++ b/static/style.css
@@ -1,54 +1,91 @@
+/* Variable declaration */
 :root {
-   /*
-   --primary-bg-color: rgb(58, 169, 159);
-   --secondary-bg-color: rgb(36, 131, 123);
-   */
-   --primary-bg-color: black;
-   --secondary-bg-color: rgb(16, 15, 15);
+   --primary-header-color: black;
+   --secondary-header-color: rgb(232, 112, 95);
+   --bg-color: white;
+   
 }
 
 html {
 	/* overflow-y needed for chromium browsers to not shift */
 	overflow-y: scroll;
-   background-image: url("/wool3.gif");
-   background-repeat: repeat;
+   /*background-image: url("/misc021.jpg");*/
+   /*background-repeat: repeat;*/
+   background-color: white;
 }
 
 header {
    display: flex;
-   flex-direction: column;
+   flex-direction: row;
 }
 
-
+/* part of header w/ title and nav */
+#left-header {
+   display: flex;
+   flex-direction: column;
+   flex-grow: 4;}
 #site-title {
    margin: 0px;
    font-family: sans-serif;
    padding-left: 0.4rem;
-   background-color: var(--primary-bg-color);
-   color: white;
-}
-
+   background-color: var(--primary-header-color);
+   color: white;}
 nav {
+   display: flex;
    padding-left: 0.2rem;
    padding-bottom: 3px;
 	display: inline;
-   background-color: var(--secondary-bg-color);
-}
+   background-color: var(--primary-header-color);}
+
 
+
+/* The image portion of the header */
+#right-header {
+   background-image: url("/multi055.gif");
+   display: flex;
+   background-repeat: repeat;
+   min-width: 25rem;}
+#image-gradient {
+   flex-grow: 1;
+   min-height: 0.4rem;
+     background: linear-gradient(to right, var(--primary-header-color) 0%, var(--primary-header-color) 20%, rgba(255,0,0,0));}
 .nav-item {
-   font-style: italic;
-   color: white;
-}
+   color: white;}
 
-body { /* everything */
-	/* margin: 0 auto; */
-   background-color: white;
-   box-shadow: 5px 5px 3px black;
+
+
+/* everything */
+body {
+   margin-top: 1rem;
+   background-color: var(--bg-color);
 	max-width: 60%;
 }
 
-main { /* main content */
+ /* main content */
+main {
    padding: 1rem;
    padding-top: 0rem;
 }
 
+/* images are centered and fixed-width */
+img {
+   max-width: 50%;
+   display: block;
+   margin: 0 auto;
+}
+
+
+/* Code */
+pre {
+   border-radius: 2px;
+   background-color: rgb(16, 15, 15);
+   padding: 1rem;
+   overflow-x: scroll;
+   background-color: black;
+   color: white;
+}
+
+footer {
+   text-align: center;
+}
+
diff --git a/static/wool3.gif b/static/wool3.gif
deleted file mode 100644
index 5c0a854..0000000
--- a/static/wool3.gif
+++ /dev/null
diff --git a/templates/404.html b/templates/404.html
new file mode 100644
index 0000000..381dc15
--- /dev/null
+++ b/templates/404.html
@@ -0,0 +1,3 @@
+{% extends "base.html" %}
+
+<p>404: Page not found.</p>
diff --git a/templates/base.html b/templates/base.html
index 7e9a668..aa7d7bf 100644
--- a/templates/base.html
+++ b/templates/base.html
@@ -5,7 +5,15 @@
 	<meta charset="utf-8" name="viewport"
 	content="width=device-width, initial-scale=1, maximum-scale=1">
 	<link rel="stylesheet" href="{{ get_url(path='style.css', cachebust=true) }}">
-	<title>CHANGE ME</title>
+   {% block rss %}
+   <link rel="alternate" type="application/atom+xml" title="RSS" href="{{ get_url(path="atom.xml", trailing_slash=false) }}">
+   {% endblock %}
+<title>
+            {% if page.title %} {{ page.title }} | {{ config.title }}
+            {% elif section.title %} {{ section.title }} | {{ config.title }}
+            {% elif config.title %} {{ config.title }}
+            {% else %} Post {% endif %}
+</title>
 </head>
 
 <body>
diff --git a/templates/partials/footer.html b/templates/partials/footer.html
index 472d9ea..b9db931 100644
--- a/templates/partials/footer.html
+++ b/templates/partials/footer.html
@@ -1,4 +1,6 @@
 <footer>
 <hr class="divider" style="border-top: 2px solid #bbb;">
-<p>Code under AGPL, content under CC by SA.</p>
+<p>Code under AGPL, content under CC by SA. <br>
+Last updated on <time>%T</time></p>
+
 </footer>
diff --git a/templates/partials/header.html b/templates/partials/header.html
index 3400a2b..8f49975 100644
--- a/templates/partials/header.html
+++ b/templates/partials/header.html
@@ -1,5 +1,6 @@
 <header>
 
+<div id="left-header">
 <!-- if "title" is set in config.toml, display site name -->
 {% if config.title %}
 <div class="header-item">
@@ -12,5 +13,9 @@
    {% include "partials/nav.html" %}
 </nav>
 
+<div id="right-header">
+   <div id="image-gradient">
+   </div>
+</div>
 </header>
 
diff --git a/templates/partials/nav.html b/templates/partials/nav.html
index f1f7d9b..b9c4cd7 100644
--- a/templates/partials/nav.html
+++ b/templates/partials/nav.html
@@ -2,6 +2,11 @@
 {% for item in config.extra.navbar_items %}
 <nav class="header-item">
       <a class="nav-item" href="{{ get_url(path=item.url) }}">{{ item.name }}</a>
+
+      <span style="color: white">{{ item.divider }}</span>
 </nav>
+
 {% endfor %}
 {% endif %}
+
+</div>
diff --git a/templates/posts.html b/templates/posts.html
index 169c75d..dfe0001 100644
--- a/templates/posts.html
+++ b/templates/posts.html
@@ -6,7 +6,8 @@
 </h3>
 <ul>
 	{% for page in section.pages %}
-	<li><a href="{{ page.permalink | safe }}">{{ page.title }}</a></li>
+   <li><a href="{{ page.permalink | safe }}">{{ page.title }}</a>
+      <span style="font-family: monospace;">({{ page.date }})</span></li>
 	{% endfor %}
 </ul>
 {% endblock content %}