fix meta title/desc

config.toml

@@ -16,28 +16,28 @@ taxonomies = [
 author = "avitex"
 
 [[extra.main_menu]]
-name = "blog"
+name = "Blog"
 url = "/blog"
 sub = [
-	{name = "latest", url = "/blog"},
-	{name = "categories", url = "/blog/categories"},
-	{name = "tags", url = "/blog/tags"}
+	{name = "Latest", url = "/blog"},
+	{name = "Categories", url = "/blog/categories"},
+	{name = "Tags", url = "/blog/tags"}
 ]
 
 [[extra.main_menu]]
-name = "projects"
+name = "Projects"
 url = "/projects"
 sub = [
-	{name = "rust", url = "#rust"},
-	{name = "elixir", url = "#elixir"},
-	{name = "github", url = "https://github.com/avitex"}
+	{name = "Rust", url = "#rust"},
+	{name = "Elixir", url = "#elixir"},
+	{name = "Github", url = "https://github.com/avitex"}
 ]
 
 [[extra.main_menu]]
-name = "about"
+name = "About"
 url = "/about"
 sub = [
-	{name = "overview", url = "/about"},
-	{name = "bio", url = "/about/bio"},
-	{name = "social", url = "/about/social"}
+	{name = "Overview", url = "/about"},
+	{name = "Bio", url = "/about/bio"},
+	{name = "Social", url = "/about/social"}
 ]

content/_index.md

@@ -1,7 +0,0 @@
-+++
-insert_anchor_links = "right"
-+++
-
-My [projects](/projects), [thoughts](/blog), and [me](/about)
-
-![avitex](/brain-only.png)

sass/_layout.scss

@@ -0,0 +1,19 @@
+* {
+    margin: 0;
+    padding: 0;
+    box-sizing: border-box;
+}
+
+html, body {
+    height: 100%;
+    width: 100%;
+}
+
+.container {
+    width: 100%;
+    min-width: 600px;
+    max-width: 900px;
+    margin-left: auto;
+    margin-right: auto;
+    padding-bottom: 2rem;
+}

sass/_reset.scss

@@ -1,10 +0,0 @@
-* {
-    margin: 0;
-    padding: 0;
-    box-sizing: border-box;
-}
-
-html, body {
-    height: 100%;
-    width: 100%;
-}

sass/site.scss

@@ -9,7 +9,11 @@ $mono-font: 'Source Code Pro', monospace;
 $content-font: 'Charter', serif;
 $heading-font: 'Space Grotesk', Helvetica, sans-serif;
 
-@import './reset';
+$lg-breakpoint: 1024px;
+$md-breakpoint: 720px;
+$sm-breakpoint: 640px;
+
+@import './layout';
 @import './scrollbar';
 @import './header';
 @import './search';
@@ -62,10 +66,13 @@ h1, h2, h3 {
 
     a.anchor{
         display: none;
+        &::after {
             color: $red;
+            content: " #";
             font-weight: bold;
             text-decoration: none;
         }
+    }
 
     &:hover a.anchor {
         display: inline;
@@ -129,15 +136,6 @@ code {
     font-size: 0.75em;
 }
 
-.container {
-    width: 100%;
-    min-width: 600px;
-    max-width: 900px;
-    margin-left: auto;
-    margin-right: auto;
-    padding-bottom: 2rem;
-}
-
 .muted {
     color: $grey;
 }

templates/about.html

@@ -1,3 +1,2 @@
 {% extends "content.html" %}
-
 {% block title %}About - {{ config.title }}{% endblock %}

templates/anchor-link.html

@@ -1 +1 @@
- <a class="anchor" aria-label="Anchor link for: {{ id }}" href="#{{ id }}">#</a>
+<a class="anchor" aria-label="Anchor link for: {{ id }}" href="#{{ id }}"></a>

templates/blog.html

@@ -1,8 +1,6 @@
 {% extends "content.html" %}
 {% import "post_macros.html" as post_macros %}
-
 {% block title %}Blog - {{ config.title }}{% endblock %}
-
 {% block content %}
     <main class="main">
         {% for page in paginator.pages %}

templates/blog/categories/list.html

@@ -1,5 +1,5 @@
 {% extends "content.html" %}
-
+{% block title %}Categories - {{ config.title }}{% endblock %}
 {% block content %}
 	<h1>Categories</h1>
 	{% if terms %}

templates/blog/categories/single.html

@@ -1,6 +1,6 @@
 {% extends "content.html" %}
 {% import "post_macros.html" as post_macros %}
-
+{% block title %}Category {{ term.name }} - {{ config.title }}{% endblock %}
 {% block content %}
 	<h1>Category: <code>{{ term.name }}</code> <small>(<a href="{{ get_taxonomy_url(kind="blog/categories", name=term.name) }}rss.xml">RSS</a>)</small></h1>
 	{% for page in term.pages %}

templates/blog/post.html

@@ -1,6 +1,7 @@
 {% extends "content.html" %}
+{% import "macros.html" as macros %}
 {% import "post_macros.html" as post_macros %}
-
+{% block title %}{{ page.title }} - {{ config.title }}{% endblock %}
 {% block content %}
 	<article itemscope itemtype="http://schema.org/BlogPosting">
 		<header class="article-header">
@@ -19,13 +20,13 @@
 					{% endif %}
 					{% if page.taxonomies | get(key="blog/categories") %}
 						{% set categories = page.taxonomies | get(key="blog/categories") %}
-						in <a href="{{ get_taxonomy_url(kind="blog/categories", name=categories[0]) }}">{{ categories[0] }}</a>
+						in <a href="{{ get_taxonomy_url(kind="blog/categories", name=categories[0]) | safe }}">{{ categories[0] }}</a>
 					{% endif %}
 					{% set tags = page.taxonomies | get(key="blog/tags") %}
 					{% if tags %}
 						and tagged
 						{% for tag in tags %}
-							<a href="{{ get_taxonomy_url(kind="blog/tags", name=tag) }}">{{ tag }}</a>
+							<a href="{{ get_taxonomy_url(kind="blog/tags", name=tag) | safe }}">{{ tag }}</a>
 							{% if tags | length > 1 %}
 								{% if loop.index != tags | length %}
 									{% if loop.index == tags | length - 1 %}

templates/blog/tags/list.html

@@ -1,4 +1,5 @@
 {% extends "content.html" %}
+{% block title %}Tag - {{ config.title }}{% endblock %}
 {% block content %}
 	<h1>Tags</h1>
 	{% if terms %}

templates/blog/tags/single.html

@@ -1,6 +1,6 @@
 {% extends "content.html" %}
 {% import "post_macros.html" as post_macros %}
-
+{% block title %}Tag {{ term.name }} - {{ config.title }}{% endblock %}
 {% block content %}
 	<h1>Tag: <code>{{ term.name }}</code> <small>(<a href="{{ get_taxonomy_url(kind="blog/tags", name=term.name) }}rss.xml">RSS</a>)</small></h1>
 	{% for page in term.pages %}

templates/content.html

@@ -3,13 +3,13 @@
 {% block body %}
     <div class="container">
         <header class="site-header">
-            <a class="brand" href="{{ get_url(path="/") }}"><img alt="avitex logo" src="{{ get_url(path="brain-48px.png") }}" /></a>
+            <a class="brand" href="{{ get_url(path="/") | safe }}">
+                <img alt="brain logo" src="{{ get_url(path="brain-48px.png") | safe }}" />
+            </a>
             {% include "partials/site-nav.html" %}
         </header>
-        <main class="content {% block extra_content_class %}{% endblock extra_content_class %}">
-            {% block content %}
-                {{ section.content | safe }}
-            {% endblock content %}
+        <main class="content">
+            {% block content %}{{ section.content | safe }}{% endblock content %}
         </main>
     </div>
 {% endblock body %}

templates/index.html

@@ -1,11 +1,12 @@
 {% extends "root.html" %}
 {% import "macros.html" as macros %}
 {% block title %}{{ config.description }} - {{ config.title }}{% endblock %}
+{% block meta_description %}The personal homepage of {{config.extra.author}}{% endblock meta_description %}
 {% block body %}
     <main class="home-page">
-        <img src="/brain-256px.png" alt="avitex logo" />
+        <img alt="brain logo" src="{{ get_url(path="brain-256px.png") | safe }}" />
         <div class="inner">
-            <h1>avitex</h1>
+            <h1>{{config.extra.author}}</h1>
             {% include "partials/site-nav.html" %}
         </div>
     </main>

templates/macros.html

@@ -1,8 +1,8 @@
 {% macro link(url) %}
 	{%- if url is starting_with("/") or url is starting_with("./") -%}
-		{{ get_url(path=url, trailing_slash=false) }}
+		{{ get_url(path=url, trailing_slash=false) | safe }}
 	{%- else -%}
-		{{ url }}
+		{{ url | safe }}
 	{%- endif -%}
 {% endmacro link %}
 
@@ -13,3 +13,17 @@
 		{{ curr_url is starting_with(url) }}
 	{%- endif -%}
 {% endmacro is_active_nav %}
+
+{% macro meta_desc(ctx) %}
+	{%- if ctx.description == "" -%}
+		{{ ctx.description }}
+	{%- else -%}
+		{%- if ctx.summary -%}
+			{{ ctx.summary | striptags | replace(from="
+", to=" ") | trim }}
+		{%- else -%}
+			{{ ctx.content | striptags | replace(from="
+", to=" ") | trim }}
+		{%- endif -%}
+	{%- endif -%}
+{% endmacro meta_desc %}

templates/page.html

@@ -1,6 +1,4 @@
 {% extends "content.html" %}
-
+{% import "macros.html" as macros %}
 {% block title %}{{ page.title }} - {{ config.title }}{% endblock %}
-{% block content %}
-    {{ page.content | safe }}
-{% endblock content %}
+{% block content %}{{ page.content | safe }}{% endblock content %}

templates/partials/site-nav.html

@@ -10,19 +10,21 @@
         </li>
     {% endfor %}
     </ul>
-    <ul class="menu sub-menu">
     {% for item in config.extra.main_menu %}
         {% if item.sub and current_url is starting_with(macros::link(url=item.url)) %}
+            <ul class="menu sub-menu">
                 {% for sub_item in item.sub %}
                     <li>
-                        <a itemprop="url"
-                            class="{% if macros::link(url=sub_item.url) == current_url %}active{% endif %}"
-                            href="{{ macros::link(url=sub_item.url) }}">
+                        <a
+                            itemprop="url"
+                            href="{{ macros::link(url=sub_item.url) }}"
+                            {%- if macros::link(url=sub_item.url) == current_url %} class="active" {% endif -%}
+                            >
                                 <span itemprop="name">{{ sub_item.name }}</span>
                         </a>
                     </li>
                 {% endfor %}
+            </ul>
         {% endif %}
     {% endfor %}
-    </ul>
 </nav>

templates/post_macros.html

@@ -26,7 +26,7 @@
 			<div itemprop="summary">
 				{{ page.summary | safe }}
 				<nav class="readmore">
-					<a itemprop="url" href="{{ page.permalink }}">
+					<a itemprop="url" href="{{ page.permalink | safe }}">
 						<span>Read More</span>
 						<svg class="icon i-caret-r" xmlns="http://www.w3.org/2000/svg" fill="currentcolor" viewBox="0 0 5.9 9" width="5.9" height="9">
 							<path d="M5.9 4.5L4.5 3.1 1.4 0 0 1.4l3.1 3.1-3.1 3L1.4 9l3.1-3.1z"></path>

templates/projects.html

@@ -1,3 +1,2 @@
 {% extends "content.html" %}
-
 {% block title %}Projects - {{ config.title }}{% endblock %}

templates/root.html

@@ -1,3 +1,4 @@
+{% import "macros.html" as macros %}
 <!DOCTYPE html>
 <html lang="en">
 <head>
@@ -6,6 +7,10 @@
     <meta name="author" content="{{ config.extra.author }}">
     <meta name="apple-mobile-web-app-capable" content="yes">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta name="description" content="{% block meta_description %}
+        {%- if section -%}{{ macros::meta_desc(ctx=section) }}{%- endif -%}
+        {%- if page -%}{{ macros::meta_desc(ctx=page) }}{%- endif -%}
+    {% endblock meta_description %}">
     <link rel="stylesheet" href="{{ get_url(path="site.css") | safe }}" />
     <link rel="stylesheet" href="{{ get_url(path="fonts.min.css") | safe }}" />
     <link rel="icon" type="image/png" href="{{ get_url(path="favicon.png") | safe }}" />
@@ -14,8 +19,8 @@
 </head>
 <body>
     {% block body %}{% endblock body %}
-    <script type="text/javascript" src="{{ get_url(path="elasticlunr.min.js") }}"></script>
-    <script type="text/javascript" src="{{ get_url(path="search_index.en.js") }}"></script>
-    <script type="text/javascript" src="{{ get_url(path="search.js") }}"></script>
+    <script type="text/javascript" src="{{ get_url(path="elasticlunr.min.js") | safe }}"></script>
+    <script type="text/javascript" src="{{ get_url(path="search_index.en.js") | safe }}"></script>
+    <script type="text/javascript" src="{{ get_url(path="search.js") | safe }}"></script>
 </body>
 </html>