remove donation links, wrote up follow page, haven't linked it in yet

_includes/footer.html

@@ -1,31 +1,7 @@
-<footer class="site-footer h-card">
+<footer>
-  <data class="u-url" href="{{ "/" | relative_url }}"></data>
+  <p class="license light">
-
+    Unless otherwised specified, all works are licensed under the
-  <div class="wrapper">
+    <a href="{{ '/assets/wtfpl.txt' | relative_url}}">WTFPL</a>.
-
+  </p>
-    <h2 class="footer-heading">{{ site.title | escape }}</h2>
-
-    <div class="footer-col-wrapper">
-      <div class="footer-col footer-col-1">
-        <ul class="contact-list">
-          <li class="p-name">
-            {%- if site.author -%}
-              {{ site.author | escape }}
-            {%- else -%}
-              {{ site.title | escape }}
-            {%- endif -%}
-            </li>
-            {%- if site.email -%}
-            <li><a class="u-email" href="mailto:{{ site.email }}">{{ site.email }}</a></li>
-            {%- endif -%}
-        </ul>
-      </div>
-
-      <div class="footer-col footer-col-2">
-        {%- include social.html -%}
-      </div>
-    </div>
-
-  </div>
-
 </footer>
+

_includes/header.html

@@ -1,6 +1,6 @@
 <header id="title-header" role="banner">
   <div class="row">
-    <div class="four columns">
+    <div class="six columns">
       <h1 class="title">
         <a href="{{ "/" | relative_url }}">{{ site.title | escape }}</a>
       </h1>
@@ -23,32 +23,11 @@
           </a>
         </span>
       </div>
-      <div class="light license">
-        Unless otherwised specified, all works are licensed under the
-        <a href="{{ '/assets/wtfpl.txt' | relative_url}}">WTFPL</a>.
     </div>
-    </div>
+    {%- if!page.nofollow != true %}
-
+    <!--<div class="six-columns">
-    <div id="crypto-display" class="four columns">&nbsp;</div>
+      <a href="/follow.html">FOLLOW PLZ</a>
-
+    </div>-->
-    <div class="four columns light">
+    {% endif -%}
-      <div class="donation">
-        <span>If you like what I do, consider donating!</span><br/>
-        <span>
-          <a href="https://cash.me/$mediocregopher" target="_blank">USD</a>
-          •
-          <a class="crypto" href="bitcoin:18kqNYjUZ4zNEp4VjE3pKPLBitUy6U76rk">BTC</a>
-          •
-          <a class="crypto" href="litecoin:LZgyna6Nw4phzWv24QP4xgUi7hC9DDHV7o">LTC</a>
-          •
-          <a class="crypto" href="ethereum:0xB8e1608059174760f4652178303f7c7a59121922">ETH</a>
-          •
-          <a class="crypto" href="zcash:zcMmjd2gNetan9QciRExVdTb64ZEYPjk8w6NiEXnLRcDbVQQxZ9xvKH3Ab3y7uccCrN5HRvR5YVvq684gC1drvnYadp3Yz2">ZEC</a>
-          •
-          <a class="crypto" href="monero:4HJsnT47QLPH3GaTUZsMZrCyFErJiHM5gSCtxLnYvYPsabuBqV3d4Wa1TW6Fa4Zdw9b29xqKUNf9qHev3gEXFEFK4W3oeRDaFvWQN6fePM">XMR</a>
-        </span>
-      </div>
-    </div>
-
   </div>
 </header>

_layouts/default.html

@@ -13,6 +13,8 @@
         {{ content }}
       </main>
 
+      {%- include footer.html -%}
+
     </div>
 
   </body>

_layouts/home.html

@@ -1,24 +0,0 @@
----
-layout: default
----
-
-{%- if site.posts.size > 0 -%}
-<ul id="posts-list">
-  {%- for post in site.posts -%}
-  {%- if post.hide -%}{%- continue -%}{%- endif -%}
-  <li>
-    <h2>
-      <a href="{{ post.url | relative_url }}">
-        {{ post.title | escape }}
-      </a>
-    </h2>
-    <span>{{ post.date | date: site.date_format }}</span>
-    {%- if post.updated %}
-    <span>(Updated {{ post.updated | date: site.date_format }})</span>
-    {% endif -%}
-    <p>{{ post.description }}</p>
-  </li>
-  {%- endfor -%}
-</ul>
-
-{%- endif -%}

_layouts/page.html

@@ -1,14 +0,0 @@
----
-layout: default
----
-<article class="post">
-
-  <header class="post-header">
-    <h1 class="post-title">{{ page.title | escape }}</h1>
-  </header>
-
-  <div class="post-content">
-    {{ content }}
-  </div>
-
-</article>

_layouts/post.html

@@ -1,7 +1,7 @@
 ---
 layout: default
 ---
-<article itemscope itemtype="http://schema.org/BlogPosting" style="margin-bottom: 50vh;">
+<article itemscope itemtype="http://schema.org/BlogPosting">
 
   <header id="post-header">
     <h1 id="post-headline" itemprop="name headline">
@@ -22,7 +22,7 @@ layout: default
       </time>
       •
       {% endif -%}
-      <span itemprop="about"><em>{{ page.description }}</em></span>
+      <description itemprop="about"><em>{{ page.description }}</em></description>
     </div>
   </header>
 

assets/main.css

@@ -28,7 +28,8 @@ ul {
 #title-header  {
     border-bottom: 1px solid #666;
     padding-top: 2rem;
-    padding-bottom:2rem;
+    padding-bottom: 2rem;
+    margin-bottom: 4rem;
 }
 
 #title-header .title {
@@ -55,37 +56,14 @@ ul {
     text-decoration: none;
 }
 
-#crypto-display {
+footer {
-    min-width: 1px;
+    margin-top: 4rem;
-}
+    border-top: 1px solid #666;
-
+    padding-top: 2rem;
-#crypto-display-qr img,
+    margin-bottom: 50vh;
-#crypto-display-qr canvas {
-    width: 100%;
-    max-width: 512px;
-}
-
-#crypto-display-addr {
-    overflow-wrap: break-word;
-    margin-top: 1em;
-}
-
-#crypto-display-x {
-    text-align: center;
-    margin-top: 1em;
-}
-
-#crypto-display-x span:hover {
-    cursor: pointer;
-    font-weight: bold;
-}
-
-#crypto-display-x span {
-    cursor: pointer;
 }
 
 #posts-list {
-    margin-top: 3rem;
     list-style: none;
 }
 
@@ -99,7 +77,7 @@ ul {
 }
 
 #post-header {
-    margin-top: 3rem;
+    margin-top: 2rem;
     margin-bottom: 2rem;
 }
 
@@ -107,11 +85,6 @@ ul {
     margin: 0;
 }
 
-#post-content {
-    border-bottom: 1px solid #666;
-    margin-bottom: 2rem;
-}
-
 #post-content ul {
     margin-left: 1em;
 }
@@ -121,3 +94,44 @@ ul {
 {
     max-width: 100%;
 }
+
+/* The Modal (background) */
+#modal {
+    display: none; /* Hidden by default */
+    position: fixed; /* Stay in place */
+    z-index: 1; /* Sit on top */
+    left: 0;
+    top: 0;
+    width: 100%; /* Full width */
+    height: 100%; /* Full height */
+    background-color: rgb(0,0,0); /* Fallback color */
+    background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
+}
+
+/* Modal Content/Box */
+#modal-body {
+    position: relative;
+    background-color: #fefefe;
+    margin: 10rem auto; /* 15% from the top and centered */
+    padding: 5rem;
+    border: 1px solid #888;
+    max-width: 30%; /* Could be more or less, depending on screen size */
+}
+
+/* The Close Button */
+#modal-close {
+    position: absolute;
+    top: 1rem;
+    right: 1rem;
+    line-height: 1rem;
+    color: #aaa;
+    font-size: 28px;
+    font-weight: bold;
+}
+
+#modal-close:hover,
+#modal-close:focus {
+    color: black;
+    text-decoration: none;
+    cursor: pointer;
+}

assets/main.js

@@ -1,67 +1,48 @@
-console.log("main.js started");
+// showModal will create the modal structure the first time it is called.
+var modal, modalContent;
+const showModal = function() {
+  if (!modal) {
+    // make the modal
+    const modalClose = document.createElement('span');
+    modalClose.id = 'modal-close';
+    modalClose.innerHTML = '×';
 
-// For asynchronously loading the qr code library, loadQRLib returns a promise
+    modalContent = document.createElement('div');
-// which will be resolved when the library is loaded.
+    modalContent.id = 'modal-content';
-var qrLibProm;
+
-var loadQRLib = () => {
+    const modalBody = document.createElement('div');
-    if (qrLibProm) { return qrLibProm; }
+    modalBody.id = 'modal-body';
-    qrLibProm = new Promise((resolve, reject) => {
+    modalBody.appendChild(modalContent);
-        console.log("loading qrcode.min.js");
+    modalBody.appendChild(modalClose);
-        var script = document.createElement('script');
+
-        script.src = "/assets/qrcode.min.js";
+    modal = document.createElement('div');
-        script.async = true;
+    modal.id = 'modal';
-        script.onload = () => { resolve(); };
+    modal.appendChild(modalBody);
-        document.querySelectorAll('head')[0].appendChild(script);
+
-    });
+    // add the modal to the document
-    return qrLibProm;
+    document.getElementsByTagName('body')[0].appendChild(modal);
-};
+
+    // setup modal functionality
+    modalClose.onclick = function() {
+        modal.style.display = "none";
+    }
+  }
+
+  modalContent.innerHTML = '';
+  for (var i = 0; i < arguments.length; i++) {
+    modalContent.appendChild(arguments[i]);
+  }
+  modal.style.display = "block";
+
+  // When the user clicks anywhere outside of the modal, close it
+  window.onclick = function(event) {
+    if (event.target == modal) {
+      modal.style.display = "none";
+      window.onclick = undefined;
+    }
+  }
+}
 
 document.addEventListener("DOMContentLoaded", () => {
     console.log("DOM loaded");
-
-    var cryptoDisplay = document.querySelector('#crypto-display');
-    var clearCryptoDisplay = () => {
-        cryptoDisplay.innerHTML = '&nbsp;';
-    };
-
-    console.log("setting up crypto buttons");
-    document.querySelectorAll('.crypto').forEach((el) => {
-        var href = el.href;
-        el.href="#";
-        el.onclick = () => {
-            var parts = href.split(":");
-            if (parts.length != 2) {
-                console.error(el, "href not properly formatted");
-                return;
-            }
-            var currency = parts[0];
-            var address = parts[1];
-
-            clearCryptoDisplay();
-
-            var cryptoDisplayQR = document.createElement('div');
-            cryptoDisplayQR.id = "crypto-display-qr";
-
-            var cryptoDisplayAddr = document.createElement('div');
-            cryptoDisplayAddr.id = "crypto-display-addr";
-            cryptoDisplayAddr.innerHTML = '<span>'+currency + " address: " + address + '</span>';
-
-            var cryptoDisplayX = document.createElement('div');
-            cryptoDisplayX.id = "crypto-display-x";
-            cryptoDisplayX.onclick = clearCryptoDisplay;
-            cryptoDisplayX.innerHTML = '<span>X</span>';
-
-            cryptoDisplay.appendChild(cryptoDisplayQR);
-            cryptoDisplay.appendChild(cryptoDisplayAddr);
-            cryptoDisplay.appendChild(cryptoDisplayX);
-
-            loadQRLib().then(() => {
-                new QRCode(cryptoDisplayQR, {
-                    text: currency,
-                    width: 512,
-                    height: 512,
-                });
-            });
-        };
-    });
 })

follow.md

@@ -0,0 +1,72 @@
+---
+layout: post
+title: "Follow the Blog"
+description: "There's lots of ways to do it"
+nofollow: true
+---
+
+There are a few ways to get notified of new posts to the Mediocre Blog.
+
+## Method 1: RSS
+
+RSS is the classic way to follow any blog. Simply give any RSS reader the
+following URL...
+
+<a href="{{site.url}}/feed.xml">{{site.url}}/feed.xml</a>
+
+...and posts from this blog will show up as soon as they are published.
+
+There are literally thousands of RSS readers out there. Here's some
+recommendations:
+
+* [Google Chrome Browser Extension](https://chrome.google.com/webstore/detail/rss-feed-reader/pnjaodmkngahhkoihejjehlcdlnohgmp)
+
+* [spaRSS](https://f-droid.org/en/packages/net.etuldan.sparss.floss/) is my
+  preferred android RSS reader, but you'll need to install
+  [f-droid](https://f-droid.org/) on your device (a good thing to do anyway,
+  imo).
+
+* TODO: an iOS reader, for you Apple users. Someone please [email
+  me](mailto:mediocregopher.com) a recommendation.
+
+
+## Method 2: Twitter
+
+New posts are automatically published to [my Twitter](https://twitter.com/{{
+site.twitter_username }}). Simply follow me there and pray the algorithm smiles
+upon my tweets enough to show them to you! :pray: :pray: :pray:
+
+## Method 3: Email
+
+I do solemnly swear to never ever ever:
+
+* Email you anything that's not a notification about new blog posts.
+
+* Give your email address to anyone for any reason.
+
+* Track whether or not you've opened the emails, clicked the links inside, or
+  anything like that. Delete every single one, I don't care.
+
+With that out of the way... if you'd like to receive an email everytime a new
+post is published just type in your email and hit "Subscribe" below!
+
+<!-- Begin Mailchimp Signup Form -->
+<link href="//cdn-images.mailchimp.com/embedcode/horizontal-slim-10_7.css" rel="stylesheet" type="text/css">
+<style type="text/css">
+	#mc_embed_signup{
+    }
+	/* Add your own Mailchimp form style overrides in your site stylesheet or in this style block.
+	   We recommend moving this block and the preceding CSS link to the HEAD of your HTML file. */
+</style>
+<div id="mc_embed_signup">
+<form action="https://gmail.us7.list-manage.com/subscribe/post?u=b01da7c6e6b3cb148e812a0fc&amp;id=e4559a9a22" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+    <div id="mc_embed_signup_scroll">
+	
+	<input type="email" value="" name="EMAIL" class="email" id="mce-EMAIL" placeholder="email address" required>
+    <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+    <div style="position: absolute; left: -5000px;" aria-hidden="true"><input type="text" name="b_b01da7c6e6b3cb148e812a0fc_e4559a9a22" tabindex="-1" value=""></div>
+    <div class="clear"><input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button"></div>
+    </div>
+</form>
+</div>
+<!--End mc_embed_signup-->

index.md

@@ -1,9 +1,23 @@
 ---
-#
+layout: default
-# By default, content added below the "---" mark will appear in the home page
-# between the top bar and the list of recent posts.
-# To change the home page layout, edit the _layouts/home.html file.
-# See: https://jekyllrb.com/docs/themes/#overriding-theme-defaults
-#
-layout: home
 ---
+
+{%- if site.posts.size > 0 -%}
+<ul id="posts-list">
+  {%- for post in site.posts -%}
+  {%- if post.hide -%}{%- continue -%}{%- endif -%}
+  <li>
+    <h2>
+      <a href="{{ post.url | relative_url }}">
+        {{ post.title | escape }}
+      </a>
+    </h2>
+    <span>{{ post.date | date: site.date_format }}</span>
+    {%- if post.updated %}
+    <span>(Updated {{ post.updated | date: site.date_format }})</span>
+    {% endif -%}
+    <p>{{ post.description }}</p>
+  </li>
+  {%- endfor -%}
+</ul>
+{%- endif -%}