11ty (ksylor#1)

* IT WORKS * don't show language picker if there's only one language * use data more * whoops uncomment ads * add netlify.toml
taher-k5 · Sep 16, 2019 · b9eff92 · b9eff92
1 parent 9107692
commit b9eff92
Show file tree

Hide file tree

Showing 47 changed files with 714 additions and 676 deletions.
diff --git a/.eleventy.js b/.eleventy.js
@@ -0,0 +1,23 @@
+const CleanCSS = require("clean-css");
+module.exports = function(config) {
+    // minify css to output inline in head
+    config.addFilter("cssmin", function(code) {
+        return new CleanCSS({}).minify(code).styles;
+    });
+
+    config.addPassthroughCopy({"assets": "/"});
+
+    // collection of tips sorted
+    config.addCollection('tips_swears_en', function(collection) {
+        let tips = collection.getFilteredByGlob('en/swears/tips/*.md');
+        tips.sort((a, b) => (a.order > b.order) ? 1 : -1);
+        return tips;
+    });
+
+    config.addCollection('tips_noswears_en', function(collection) {
+        let tips = collection.getFilteredByGlob('en/noswears/tips/*.md');
+        tips.sort((a, b) => (a.order > b.order) ? 1 : -1);
+        return tips;
+    });
+
+};
diff --git a/.eleventyignore b/.eleventyignore
@@ -0,0 +1,2 @@
+**/partials/*
+README.md
diff --git a/.gitignore b/.gitignore
@@ -0,0 +1,3 @@
+_site/
+node_modules/
+package-lock.json
diff --git a/_data/site.json b/_data/site.json
@@ -0,0 +1,10 @@
+{
+    "url_swears": "https://ohshitgit.com",
+    "url_noswears": "https://dangitgit.com",
+    "copyright": "&copy; 2016-2019 Katie Sylor-Miller",
+    "languages": [
+        { "label": "english", "code": "en" }
+    ],
+    "twitter_ksylor": "<a href='https://twitter.com/ksylor'>@ksylor</a>",
+    "twitter_ohshitgit": "<a href='https://twitter.com/ohshitgit'>@ohshitgit</a>"
+}
diff --git a/_includes/layouts/page.njk b/_includes/layouts/page.njk
@@ -0,0 +1,48 @@
+<!DOCTYPE HTML>
+<html lang="{{locale}}">
+<head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width" />
+	<title>{{title}}</title>
+	<meta name="lolz" content="My git site brings all the mansplainers to the yard." />
+    <!-- hi this is coming from netlify & 11ty-->
+	{% include "partials/styles.njk" %}
+	<link href="favicon-32x32.png" rel="icon" sizes="32x32" type="image/png" />
+	<link href="favicon-16x16.png" rel="icon" sizes="16x16" type="image/png" /> 
+    {% include "partials/ga.njk" %}
+</head>
+<body>
+    {% if contentType == "swears" %}
+        {% set banner = locale + "/" + contentType + "/" + "partials/banner.njk" %}
+        {% include banner %}
+    {% endif %}
+
+    {% include "partials/langpicker.njk" %}
+
+    <div class="max-width">
+        <header class="spaced">
+            <h1 class="centered">{{title}}</h1>
+        </header>
+
+        <main>
+            <section class="intro">
+                {%include "partials/carbonads.njk"%} 
+                {% set intro = locale + "/" + contentType + "/" + "partials/intro.njk" %}
+                {% include intro %}
+            </section>
+
+            {% set tips = collections["tips_" + contentType + "_" + locale] %}
+            {% for tip in tips %}
+                <section class="spaced">
+                    <h2><a class="permalinked" href="#{{ tip.data.id }}" id="{{ tip.data.id }}">{{tip.data.title}}</a></h2>
+                    {{tip.templateContent | safe}}
+                </section>
+            {% endfor %}
+        </main>
+
+        {% set footer = locale + "/" + contentType + "/" + "partials/footer.njk" %}
+        {% include footer %}
+    </div>
+    <script src="/prism.js"></script>
+</body>
+</html>
diff --git a/_includes/partials/carbonads.njk b/_includes/partials/carbonads.njk
@@ -0,0 +1 @@
+<aside class="ads"><script async type="text/javascript" src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=ohshitgitcom" id="_carbonads_js"></script></aside>
diff --git a/_includes/partials/ga.njk b/_includes/partials/ga.njk
@@ -0,0 +1,9 @@
+<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','https://www.google-analytics.com/analytics.js','ga');
+
+    ga('create', 'UA-8206228-2', 'auto');
+    ga('send', 'pageview');
+</script>
diff --git a/_includes/partials/langpicker.njk b/_includes/partials/langpicker.njk
@@ -0,0 +1,11 @@
+{% if site.languages.length > 1 %}
+<nav class="langpicker">
+    <ul>
+    {% for lang in site.languages %}
+        {% if lang.code != locale %}
+            <li><a href="/{{lang.code}}" title="{{lang.label}}">{{lang.code}}</a></li>
+        {% endif %}
+    {% endfor %}
+    </ul>
+</nav>
+{% endif %}
diff --git a/_includes/partials/styles.njk b/_includes/partials/styles.njk
@@ -0,0 +1,8 @@
+<link href="https://fonts.googleapis.com/css?family=Montserrat|Source+Sans+Pro" rel="stylesheet" />
+{% set css %}
+    {% include "site.css" %}
+{% endset %}
+<style>
+    {{ css | cssmin | safe }}
+</style>
+<link href="/prism.css" rel="stylesheet" />
diff --git a/_includes/site.css b/_includes/site.css
@@ -0,0 +1,170 @@
+body {
+    font-family: 'Source Sans Pro', sans-serif;
+    color: #222;
+    line-height: 1.5;
+    margin: 0;
+}
+h1, h2, h3, h4, h5, h6 {
+    font-family: 'Montserrat', serif;
+}
+h1 {
+    line-height: 1.2;
+    font-size: 3em;
+}
+p {
+    margin: 0 0 1em 0;
+}
+.notice {
+    padding: 1em;
+    background: #222;
+    color: white;
+    text-align: center;
+}
+.notice a {
+    color: white;
+}
+.langpicker {
+  text-align: right;
+}
+.langpicker a {
+  display: inline-block;
+  padding: 0 0.5em;
+  color: #222;
+}
+.langpicker ul {
+  list-style-type: none;
+  margin: 0;
+  padding: 0;
+}
+.langpicker li {
+  display: inline-block;
+}
+.langpicker li:after {
+  content: "|";
+}
+.langpicker li:last-child:after {
+  content: none;
+}
+.max-width {
+    margin: 1em;
+}
+@media screen and (min-width: 680px) {
+    .max-width {
+        margin: 0 100px 0 170px;
+        max-width: 640px;
+    }
+}
+@media screen and (min-width: 980px) {
+    .max-width {
+        margin: 0 auto;
+    }
+}
+.centered {
+    text-align: center;
+}
+.spaced {
+    margin: 2em 0;
+}
+.no-bottom-margin {
+    margin-bottom: 0;
+}
+.top-lined {
+    padding-top: 2em;
+    border-top: 1px solid #000;
+}
+.bottom-lined {
+    padding-bottom: 2em;
+    border-bottom: 1px solid #000;
+}
+.intro {
+    display: flex;
+    flex-direction: column;
+}
+.ads {
+    order: 1;
+}
+@media screen and (min-width: 680px) {
+    .ads {
+        order: inherit;
+    }
+}
+.permalinked {
+    color: #222;
+    text-decoration: none;
+}
+.permalinked:hover,
+.permalinked:focus {
+    text-decoration: underline;
+}
+.flattr-note {
+    vertical-align: top;
+}
+#carbonads {
+  position: absolute;
+  display: block;
+  overflow: hidden;
+  margin-left: -160px;
+  max-width: 130px;
+  text-align: right;
+  font-size: 14px;
+  line-height: 1.5;
+}
+#carbonads a {
+  color: inherit;
+  text-decoration: none;
+}
+#carbonads a:hover {
+  color: inherit;
+}
+#carbonads span {
+  display: block;
+  overflow: hidden;
+}
+.carbon-img {
+  display: block;
+  margin: 0 auto 8px;
+  line-height: 1;
+}
+.carbon-text {
+  display: block;
+  margin-bottom: 8px;
+}
+.carbon-poweredby {
+  display: block;
+  text-transform: uppercase;
+  letter-spacing: 1px;
+  font-size: 10px;
+  line-height: 1;
+}
+@media only screen and (min-width: 320px) and (max-width: 679px) {
+  #carbonads {
+    position: relative;
+    float: none;
+    margin: 0 auto;
+    padding: 10px;
+    max-width: 330px;
+    border: solid 1px #8f8f8f;
+    text-align: left;
+  }
+  #carbonads span {
+    position: relative;
+  }
+  #carbonads > span {
+    max-width: none;
+  }
+  .carbon-img {
+    float: left;
+    margin: 0 1em 0 0;
+  }
+  .carbon-text {
+    float: left;
+    margin-bottom: 0;
+    max-width: calc(100% - 130px - 1em);
+  }
+  .carbon-poweredby {
+    position: absolute;
+    bottom: 0;
+    left: 144px;
+    display: block;
+  }
+}
diff --git a/android-chrome-192x192.png → assets/android-chrome-192x192.png b/android-chrome-192x192.png → assets/android-chrome-192x192.png
diff --git a/android-chrome-512x512.png → assets/android-chrome-512x512.png b/android-chrome-512x512.png → assets/android-chrome-512x512.png
diff --git a/apple-touch-icon.png → assets/apple-touch-icon.png b/apple-touch-icon.png → assets/apple-touch-icon.png
diff --git a/favicon-16x16.png → assets/favicon-16x16.png b/favicon-16x16.png → assets/favicon-16x16.png
diff --git a/favicon-32x32.png → assets/favicon-32x32.png b/favicon-32x32.png → assets/favicon-32x32.png
diff --git a/favicon.ico → assets/favicon.ico b/favicon.ico → assets/favicon.ico
diff --git a/prism.css → assets/prism.css b/prism.css → assets/prism.css
diff --git a/prism.js → assets/prism.js b/prism.js → assets/prism.js
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1 @@
		<aside class="ads"><script async type="text/javascript" src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=ohshitgitcom" id="_carbonads_js"></script></aside>