~animesh/anmsh.net

586c5a6b3a2d809191cb852c309e3b42fc2414d2 — Animesh Bulusu 5 months ago 7b24522
Add 2023 design changes

Read this commit and/or below for changelog

1. Use a single layout file to simplify overall style and structure
2. Unify post, page and tag specific style and structure
3. Remove unneeded layouts
4. Inject compressed styles into layout via style tag
5. Use specific styles for a template via its head block
6. Cleanup extraneous model properties
7. Update associated content as much as possible
D assets/static/post.css => assets/static/post.css +0 -378
@@ 1,378 0,0 @@
:root {
    --sans-font: -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol';
    --mono-font: Menlo, Consolas, Monaco, Liberation Mono, Lucida Console, monospace;
    --bg: #f7f7f7;
    --text: #0b0b0b;
    --text-light: #666666;
    --border: #012;
    --border-light: #c2c3c4;
    --link: #0010a1;
    --accent: firebrick
}

@media (prefers-color-scheme: dark) {
    :root {
        --bg: #090909;
        --text: #dddddd;
        --text-light: #808080;
        --border: #666666;
        --border-light: #444444;
        --link: #539bf5;
        --accent: orangered
    }

    img {
        opacity: .6
    }
}

* {
    font-family: var(--sans-font)
}

.skiptocontent a {
    padding: 6px;
    position: absolute;
    top: -40px;
    left: 0;
    font-size: 14px;
    -webkit-transition: top 1s ease-out, background 1s linear;
    transition: top 1s ease-out, background 1s linear;
    z-index: 100
}

.skiptocontent a:active,
.skiptocontent a:focus {
    position: fixed;
    top: 0;
    left: 0;
    width: auto;
    height: auto;
    overflow: visible;
    text-decoration: underline
}

body {
    color: var(--text);
    background: var(--bg);
    line-height: 1.5;
    margin: 0 auto;
    min-width: 320px;
    font-size: 18px
}

time {
    font-size: 0.8rem;
    color: var(--text-light)
}

footer,
header,
main {
    padding: 5px 10px
}

header {
    display: flex;
    flex-direction: column;
    border-bottom: 1px solid var(--border-light)
}

header ul {
    margin: 0;
    display: flex
}

header ul li {
    margin-right: 10px
}

header ul li a {
    text-decoration: none
}

main {
    font-size: 16px;
    margin: 0 auto;
    margin-top: 1rem;
    outline: 0;
    word-wrap: anywhere
}

footer {
    margin-top: 4rem;
    color: var(--text-light);
    font-size: 0.8rem;
    border-top: 1px solid var(--border-light)
}

ol,
ul {
    padding: 0
}

ul li {
    list-style-type: none
}

a:link,
a:visited {
    color: var(--link)
}

a:hover {
    text-decoration: none
}

table {
    border-collapse: collapse;
    font-size: 1rem
}

td,
th {
    border: 1px solid var(--border);
    text-align: left;
    padding: 0.5rem
}

table caption {
    font-weight: 700;
    margin-bottom: 0.5rem
}

main img {
    max-width: 100%;
    border-radius: 3px;
    aspect-ratio: 1
}

figure {
    margin: 1rem;
    padding: 1px
}

figcaption {
    padding: 0 3px;
    font-size: 0.9rem
}

blockquote {
    margin: 2rem 0 2rem 2rem;
    padding: 0.4rem 0.8rem;
    border-left: 0.35rem solid var(--link);
    opacity: 0.8;
    font-style: italic
}

article>div:not(:first-child) {
    margin-bottom: 45px
}

article h1 {
    margin-top: 5px
}

article h1,
h2,
h3,
h4 {
    font-weight: 400
}

article ul,
article ol {
    padding: revert
}

article ul li {
    list-style-type: revert
}

article .footer {
    margin-top: 70px
}

article .footer div {
    margin-bottom: 15px
}

code {
    border: 1px solid var(--border-light);
    color: var(--code);
    border-radius: 3px;
    padding: 2px 6px
}

code,
pre {
    font-family: var(--mono-font);
    font-size: 0.8rem
}

pre {
    padding: 1rem 1.4rem;
    max-width: 100%;
    overflow: auto;
    margin-left: 4px;
    border-left: 2px solid var(--link)
}

pre code {
    color: var(--text);
    background: 0 0;
    margin: 0;
    padding: 0;
    border: unset
}

.posts ul {
    margin-top: 0;
    margin-bottom: 40px
}

.posts ul li {
    display: flex;
    flex-direction: column;
    margin-bottom: 20px
}

.post-subs {
    margin-top: 35px
}

.post-subs dl {
    font-size: 0.8rem;
    padding: 3px 8px
}

.post-subs dd {
    margin: unset
}

.post-subs dd:not(:last-child) {
    margin-bottom: 10px
}

.post-tags ul {
    display: inline;
    padding: 0
}

.post-tags ul li {
    display: inline;
    margin: 0 2px
}

.post-nav {
    display: flex
}

.post-nav div:not(:empty) {
    flex: 1;
    border: 1px solid var(--border-light);
    padding: 0.5rem;
    margin: 0.1rem
}

.post-nav .right {
    text-align: right
}

a[name] {
    display: block
}

.post-toc {
    display: none
}

.accent {
    color: var(--accent) !important
}

@media (min-width: 30rem) {
    body {
        width: 480px
    }

    .posts ul li {
        margin-bottom: 10px;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between
    }

    .posts ul,
    .posts ul li span {
        font-size: 0.85rem
    }

    .posts ul li a {
        font-size: initial
    }

    .posts ul li span {
        color: var(--text-light)
    }

    .posts ul li:hover span {
        color: var(--text)
    }
}

@media (min-width: 40rem) {
    body {
        width: 640px;
        font-size: 16px
    }

    header {
        border: none;
        flex-direction: row;
        margin-top: 1rem
    }

    header ul {
        display: flex;
        padding: 0
    }

    header ul li a {
        text-decoration: initial
    }

    article h1 {
        font-size: 2em
    }

    article h2 {
        margin-top: 50px
    }

    article h2 a {
        border-bottom: 1px solid var(--border-light)
    }

    footer {
        border: none
    }
}

@media (min-width: 60rem) {
    .post-toc {
        position: fixed;
        display: block;
        font-size: 0.8rem;
        padding: 2px 5px
    }

    .post-toc ul li {
        margin-bottom: 3px
    }

    .breadcrumb {
        display: block
    }
}
\ No newline at end of file

D assets/static/posts.css => assets/static/posts.css +0 -192
@@ 1,192 0,0 @@
:root {
    --sans-font: -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol';
    --bg: #f7f7f7;
    --text: #0b0b0b;
    --link: #0010a1;
    --border-light: #c2c3c4;
    --accent: firebrick
}

@media (prefers-color-scheme: dark) {
    :root {
        --bg: #090909;
        --text: #dddddd;
        --link: #539bf5;
        --border-light: #444444;
        --accent: orangered
    }
}

.skiptocontent a {
    padding: 6px;
    position: absolute;
    top: -40px;
    left: 0;
    font-size: 14px;
    -webkit-transition: top 1s ease-out, background 1s linear;
    transition: top 1s ease-out, background 1s linear;
    z-index: 100
}

.skiptocontent a:active,
.skiptocontent a:focus {
    position: fixed;
    top: 0;
    left: 0;
    width: auto;
    height: auto;
    overflow: visible;
    text-decoration: underline
}

body {
    background: var(--bg);
    color: var(--text);
    font-family: var(--sans-font);
    font-size: 18px;
    margin: 0 auto;
    min-width: 320px
}

h1 {
    font-weight: 400
}

header,
main {
    padding: 5px 10px
}

main {
    font-size: 16px;
    margin: 0 auto;
    margin-top: 1rem;
    outline: 0;
    word-wrap: anywhere
}

header {
    display: flex;
    flex-direction: column;
    border-bottom: 1px solid var(--border-light)
}

header ul {
    margin: 0;
    display: flex
}

header ul li {
    margin-right: 10px
}

header ul li a {
    text-decoration: none
}

ul {
    padding: 0;
    display: flex;
    flex-grow: 1;
    flex-wrap: wrap
}

ul li {
    list-style-type: none
}

a:link,
a:visited {
    color: var(--link)
}

.post {
    margin-bottom: 0.5rem;
    display: flex
}

.post span:nth-child(1) {
    flex: 1;
    display: none
}

.post span:nth-child(2) {
    display: flex;
    flex-direction: column;
    flex: 4
}

.post span:nth-child(2) a {
    margin-bottom: 0.5rem;
    width: fit-content;
    padding-bottom: 1rem
}

.accent {
    color: var(--accent) !important
}

@media (min-width: 30rem) {
    ul {
        justify-content: initial
    }

    ul li {
        padding-left: 0
    }

    .post {
        margin-bottom: 1rem;
        display: flex
    }

    .post span:nth-child(1) {
        flex: 1
    }

    .post span:nth-child(2) {
        display: flex;
        flex-direction: column;
        flex: 9
    }

    .post span:nth-child(2) a {
        margin-bottom: 0;
        padding-bottom: 0.4rem
    }

    body {
        width: 480px
    }
}

@media (min-width: 40rem) {
    body {
        width: 640px;
        font-size: 16px
    }

    header {
        border: none;
        flex-direction: row;
        margin-top: 1rem
    }

    header ul {
        display: flex;
        padding: 0;
    }

    header ul li a {
        text-decoration: initial
    }

    .post span:nth-child(1) {
        display: unset;
    }

    .post span:nth-child(2) {
        margin-bottom: unset;
        border: none
    }
}
\ No newline at end of file

M content/about/contents.lr => content/about/contents.lr +5 -1
@@ 6,6 6,8 @@ metadesc: About page of Animesh Bulusu
---
body:

Hello! I am Animesh Bulusu. Welcome to my internet corner.

I am a lifelong learner and an explorer. My primary interests include open source, distributed systems, dataviz, photography, electronics, spoken languages, minimalism, and stoicism. Some principles I try to live by — Habits and discipline. Karma and kaizen. Everything is an experiment. Strong opinions weakly held.

I work as a web developer in lead/IC capacity by day. My common technology choices are ASP.NET and AWS. I am getting comfortable with Terraform and IAC at the moment. I can work my way around a Django project.


@@ 26,4 28,6 @@ Key features of this blog:

Contact &mdash; <a href="mailto:anmsh@duck.com?subject=Hello!">e-mail</a>
&middot; <a href="https://flickr.com/photos/kriani/" target="_blank" rel="noopener noreferrer">flickr</a>
&middot; <a href="https://www.linkedin.com/in/animeshbulusu/" target="_blank"rel="noopener noreferrer">lnkdn</a>
\ No newline at end of file
&middot; <a href="https://www.linkedin.com/in/animeshbulusu/" target="_blank"rel="noopener noreferrer">lnkdn</a>
---
description: about me and my internet corner
\ No newline at end of file

M content/changelog/contents.lr => content/changelog/contents.lr +1 -1
@@ 2,7 2,7 @@ _model: page
---
title: Changelog
---
description: This blog's changelog
description: this blog's changelog
---
metadesc: This blog's changelog
---

M content/contents.lr => content/contents.lr +2 -4
@@ 4,13 4,11 @@ title: Posts
---
metadesc: Home page of Animesh Bulusu
---
greeting: Hello
---
landing: I am Animesh Bulusu. Welcome to my internet corner.
---
contact:
Contact &mdash; <a href="mailto:anmsh@duck.com?subject=Hello!">e-mail</a>
&middot; <a href="https://flickr.com/photos/kriani/" target="_blank" rel="noopener noreferrer">flickr</a>
&middot; <a href="https://www.linkedin.com/in/animeshbulusu/" target="_blank"rel="noopener noreferrer">lnkdn</a>
---
site: anmsh.net
---
description: all posts
\ No newline at end of file

M content/new-domain/contents.lr => content/new-domain/contents.lr +1 -1
@@ 66,6 66,6 @@ The blog itself will be available at https://b.anmsh.net shortly. The root domai

*Potential audience = search traffic, collaborators, and potential customers*

<div class="accent">Note: After 20 months, I have merged the blog and site into https://anmsh.net.</div>
<div class="active">Note: After 20 months, I have merged the blog and site into https://anmsh.net.</div>

Read about it in the post [Moving the blog from Gitlab to Sourcehut](/gitlab-to-sourcehut/).
\ No newline at end of file

M content/notes/contents.lr => content/notes/contents.lr +2 -0
@@ 3,3 3,5 @@ _model: posts
title: Notes
---
_discoverable: no
---
description: just notes
\ No newline at end of file

M content/now/contents.lr => content/now/contents.lr +3 -7
@@ 4,9 4,10 @@ title: Now
---
metadesc: Now page inspired by https://sivers.org/now
---
description: This page is inspired by the [now page](http://nownownow.com/about) by [Derek Sivers](https://sivers.org). This page details what I am upto in the current year. I edit this several times in a year.
description: my current activities
---
body:
This page is inspired by the [now page](http://nownownow.com/about) by [Derek Sivers](https://sivers.org). This page details what I am upto in the current year. I edit this several times in a year.
## Primary
### AWS (and Terraform)



@@ 18,9 19,4 @@ Architecture study slowed down considerably due to the AWS explorations. I am wo
## Other

### ASP.NET
ASP.NET took a backseat in my quest to become good with AWS. Several projects and few intermediate to advanced topic explorations are on-hold due to my primary focus.
### Go
I planned to implement a few long-term ideas in Go while learning the language.

### Angular
I avoided full-stack roles for nearly two years. I had some unpleasant time in a project w.r.t Angular and decided to complete my CYA-Angular project.
\ No newline at end of file
ASP.NET took a backseat in my quest to become good with AWS. Several projects and few intermediate to advanced topic explorations are on-hold due to my primary focus.
\ No newline at end of file

M content/tags/contents.lr => content/tags/contents.lr +2 -0
@@ 5,3 5,5 @@ _slug: /tags
metadesc: Blog post labels of Animesh Bulusu's blog. Web developer, open source enthusiast and hobbyist photographer.
---
header: All tags
---
description: Posts grouped by their categories
\ No newline at end of file

M content/thoughts/contents.lr => content/thoughts/contents.lr +3 -1
@@ 2,4 2,6 @@ _model: posts
---
title: Thoughts
---
_discoverable: no
\ No newline at end of file
_discoverable: no
---
description: some reflections, stream of consciousness and maybe rants
\ No newline at end of file

M models/page.ini => models/page.ini +1 -2
@@ 7,8 7,7 @@ label = Title
type = string

[fields.description]
label = Description
type = markdown
type = string

[fields.body]
label = Body

M models/posts.ini => models/posts.ini +4 -1
@@ 34,4 34,7 @@ type = string
type = string

[fields.contact]
type = html
\ No newline at end of file
type = html

[fields.description]
type = string
\ No newline at end of file

M models/tag.ini => models/tag.ini +0 -1
@@ 11,5 11,4 @@ label = Name
type = string

[fields.description]
label = Description
type = string
\ No newline at end of file

M models/tags.ini => models/tags.ini +0 -1
@@ 13,5 13,4 @@ label = Header
type = string

[fields.description]
label = Description
type = string

M templates/404.html => templates/404.html +3 -3
@@ 1,6 1,6 @@
{% extends "posts-layout.html" %}
{% extends "layout.html" %}
{% from "macros/common.html" import render_header %}
{% block title %}Page not found{% endblock %}
{% block body %}
<h1>404</h1>
<h2>Page not found</h2>
{{ render_header("404", "Page not found") }}
{% endblock %}
\ No newline at end of file

M templates/drafts.html => templates/drafts.html +5 -5
@@ 1,8 1,8 @@
{% extends "posts-layout.html" %}
{% from "macros/posts.html" import render_posts, render_posts_header %}
{% block head%}
{%endblock%}
{% extends "layout.html" %}
{% from "macros/common.html" import render_header %}
{% from "macros/posts.html" import render_posts %}
{% block head%}<style>.post{margin-top:25px}.post ul li{margin-bottom:10px}</style>{%endblock%}
{% block body %}
{{ render_posts_header("Drafts","work-in-progress posts") }}
{{ render_header("Drafts","work-in-progress posts") }}
{{ render_posts(this.pagination.items.include_undiscoverable(True)) }}
{% endblock %}
\ No newline at end of file

M templates/footer.html => templates/footer.html +8 -6
@@ 1,9 1,11 @@
<footer>
    © 2023. Site is licensed under <a href="https://creativecommons.org/licenses/by-sa/4.0/" target="_blank"
        rel="noopener noreferrer">CC BY-SA 4.0</a>.
    <ul>Other links:
        <li><a href="/changelog">site changelog</a></li>
        <li><a href="/notes">incomplete notes</a></li>
        <li><a href="/sitemap.xml">xml sitemap</a></li>
    <span>© 2023. Site is licensed under <a href="https://creativecommons.org/licenses/by-sa/4.0/" target="_blank"
        rel="noopener noreferrer">CC BY-SA 4.0</a>.</span>
    <ul>
        {% for href, title in [['/changelog', 'changelog'],['/notes', 'notes']] %}
        <li>
            <a {% if this.is_child_of(href) %} class="active" {%endif%} href="{{ href|url }}">{{ title }}</a>
        </li>
        {% endfor %}
    </ul>
</footer>
\ No newline at end of file

M templates/header.html => templates/header.html +8 -4
@@ 1,10 1,14 @@
<header>
    <nav>
        <ul>
            <li><a class="accent" href="/">anmsh.net &compfn;</a></li>
            <li><a href="/about/">about</a></li>
            <li><a href="/now/">now</a></li>
            <li><a href="/tags/">tags</a></li>
            <li>
                <a {% if this._path == '/' %} class="active" {% endif%} href="{{ '/'|url }}">anmsh.net &compfn;</a>
            </li>
            {% for href, title in [['/about', 'about'],['/now', 'now'],['/tags', 'tags']] %}
            <li>
                <a {% if this.is_child_of(href) %} class="active" {%endif%} href="{{ href|url }}">{{ title }}</a>
            </li>
            {% endfor %}
            <li><a href="/atom.xml">feed</a></li>
        </ul>
    </nav>

D templates/landing.html => templates/landing.html +0 -24
@@ 1,24 0,0 @@
<header>
    <nav>
        <ul>
            <li><a class="accent" href="/">anmsh.net &compfn;</a></li>
            <li><a href="/about/">about</a></li>
            <li><a href="/now/">now</a></li>
            <li><a href="/tags/">tags</a></li>
            <li><a href="/atom.xml">feed</a></li>
        </ul>
    </nav>
</header>
<main id="maincontent" tabindex="-1">
    <div>
        <div>
            <h1>{{this.greeting}}</h2>
            {%if this.landing%}<p>{{this.landing}}</p>{%endif%}
            {%if this.contact%}<p>{{this.contact}}</p>{%endif%}
        </div>
        <div>
            <h2>{{this.title}}</h2>
            {{ render_posts(this.children.filter(F._model == 'post')) }}
        </div>
    </div>
</main>
\ No newline at end of file

M templates/layout.html => templates/layout.html +8 -6
@@ 2,16 2,18 @@
<html lang="en">

<head>
    <meta name="title" content="Animesh Bulusu" />
    {% include 'meta.html' %}
    <style>:root{--sans-font:-apple-system,BlinkMacSystemFont,'Segoe UI',Helvetica,Arial,sans-serif,'Apple Color Emoji','Segoe UI Emoji','Segoe UI Symbol';--bg:#f7f7f7;--text:#0b0b0b;--link:#0010a1;--border-light:#c2c3c4;--accent:firebrick}@media (prefers-color-scheme:dark){:root{--bg:#090909;--text:#dddddd;--link:#539bf5;--accent:#ffb559;--border-light:#444444;--accent:orangered}}*,:after,:before{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.skiptocontent a{padding:6px;position:absolute;top:-40px;left:0;font-size:14px;-webkit-transition:top 1s ease-out,background 1s linear;transition:top 1s ease-out,background 1s linear;z-index:100}.skiptocontent a:active,.skiptocontent a:focus{position:fixed;top:0;left:0;width:auto;height:auto;overflow:visible;text-decoration:underline}body{background-color:var(--bg);color:var(--text);font-family:var(--sans-font);font-size:18px;margin:0 auto;line-height:1.5;min-width:320px}a:link,a:visited{color:var(--link)}h1{font-size:2rem}h1,h2,h3{font-weight:400}ul{padding:0;margin:0}header ul{margin:0;display:flex}header ul li{margin-right:10px}header ul li a{font-size:inherit;text-decoration:none}ul li{list-style-type:none}header,main{padding:5px 10px}main{font-size:16px}:active{outline:0}header{display:flex;flex-direction:column;border-bottom:1px solid var(--border-light)}.post{margin-bottom:.5rem;display:flex}.post span:nth-child(1){flex:1;display:none}.post span:nth-child(2){display:flex;flex-direction:column;flex:4}.post span:nth-child(2) a{margin-bottom:.5rem;width:fit-content;padding-bottom:1rem}.accent{color:var(--accent)!important}@media (min-width:30rem){body{width:480px}.post{margin-bottom:1rem;display:flex}.post span:nth-child(1){flex:1}.post span:nth-child(2){display:flex;flex-direction:column;flex:9}.post span:nth-child(2) a{margin-bottom:0;padding-bottom:.4rem}}@media (min-width:40rem){body{width:640px;font-size:16px}.post span:nth-child(1){display:unset}.post span:nth-child(2){margin-bottom:unset;border:none}header{border:none;flex-direction:row;margin-top:1rem}header ul{display:flex;padding:0}header ul li a{text-decoration:initial}}</style>
    <style>:root{--accent:firebrick;--bg:#f7f7f7;--border-light:#c2c3c4;--link:#0010a1;--sans-font:-apple-system,BlinkMacSystemFont,'Segoe UI',Helvetica,Arial,sans-serif,'Apple Color Emoji','Segoe UI Emoji','Segoe UI Symbol';--text:#0b0b0b}@media (prefers-color-scheme:dark){:root{--accent:orangered;--bg:#090909;--border-light:#444444;--link:#539bf5;--text:#dddddd}}*,:after,:before{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.skiptocontent a{font-size:14px;left:0;padding:6px;position:absolute;top:-40px;-webkit-transition:top 1s ease-out,background 1s linear;transition:top 1s ease-out,background 1s linear;z-index:100}.skiptocontent a:active,.skiptocontent a:focus{height:auto;left:0;overflow:visible;position:fixed;text-decoration:underline;top:0;width:auto}body{background-color:var(--bg);color:var(--text);font-family:var(--sans-font);font-size:18px;line-height:1.5;margin:0 auto;min-width:320px}a:link,a:visited{color:var(--link)}h1,h2,h3{font-weight:400}h1{font-size:1.8rem}footer,header,main{padding:5px 10px}header{border-bottom:1px solid var(--border-light);display:flex;flex-direction:column}footer ul,header ul{display:flex;margin:0}footer ul li,header ul li{margin-right:10px}footer ul li a,header ul li a{font-size:inherit;text-decoration:none}main{font-size:16px;outline:0}footer{border-top:1px solid var(--border-light);color:var(--text-light);font-size:.8rem;margin-top:4rem}ol,ul{margin:0;padding:0}ul li{list-style-type:none}:active{outline:0}.active{color:var(--accent)!important}.ph span{color:var(--text-light);font-size:.8rem}@media (min-width:30rem){body{width:480px}}@media (min-width:40rem){body{font-size:16px;width:640px}header{border:none;flex-direction:row;margin-top:1rem}footer ul,header ul{display:flex;padding:0}footer ul li a,header ul li a{text-decoration:initial}}</style>
    {% block head%}{%endblock%}
</head>

<body>
    <div class=skiptocontent>
        <a href=#maincontent>skip to main content</a>
    </div>
    {% include 'landing.html' %}
    {% include 'skip.html' %}
    {% include 'header.html' %}
    <main id="maincontent" tabindex="-1">
        {% block body %}{% endblock %}
    </main>
    {% include 'footer.html' %}
</body>

</html>
\ No newline at end of file

A templates/macros/common.html => templates/macros/common.html +6 -0
@@ 0,0 1,6 @@
{% macro render_header(header, description) %}
<div class="ph">
    <h1>{{header}}</h1>
    {%if description%}<span>{{description}}</span>{%endif%}
</div>
{% endmacro %}
\ No newline at end of file

M templates/macros/post.html => templates/macros/post.html +3 -11
@@ 1,19 1,11 @@
{% macro render_post(post) %}
<article>
    <div class="header">
        
    <div class="body">
        <time datetime="{{post.pub_date}}">{{ post.pub_date|dateformat('medium') }}</time>
        {%if post.last_updated_date%}<time datetime=""> &bullet; updated: {{
            post.last_updated_date|dateformat('medium')}}</time>{%endif%}
        
        <h1>
            {%if post.children.include_undiscoverable(True).count()%}Series: {%endif%}
            {{ post.title }}
        </h1>
    </div>
    <div class="body">
        {% if post.is_undiscoverable %}<blockquote>This is a work-in-progress post. Please check back later.
        </blockquote>{% endif %}

        {% if post.is_undiscoverable %}<blockquote>This is a work-in-progress post. Please check back later.</blockquote>{% endif %}
        {{ post.series_intro }}
        {% set children = post.children.include_undiscoverable(True) %}
        {%if post.part%}

M templates/macros/posts.html => templates/macros/posts.html +4 -13
@@ 1,20 1,11 @@
{% macro render_posts(posts) %}

{% for year, year_group in posts.order_by('-pub_date')|groupby('pub_date.year')|reverse %}
<div class="post">
    <span>{{year}}</span>
    <span>
        {% for post in year_group %}
        <a href="{{ post|url }}">{%if post.is_series%}Series: {%endif%}{{ post.title }}</a>
    <ul>
        {% for post in posts %}
        <li><a href="{{ post|url }}">{{ post.title }}</a>
        {% endfor %}
    </span>
    </ul>
</div>
{% endfor %}
{% endmacro %}

{% macro render_posts_header(header, description) %}
<div class="ph">
    <h1>{{header}}</h1>
    <p>{{description}}
</div>
{% endmacro %}
\ No newline at end of file

M templates/meta.html => templates/meta.html +1 -0
@@ 1,3 1,4 @@
<meta name="title" content="Animesh Bulusu" />
<link rel="canonical" href="{{'.'|url(external=true)}}" />
<link rel="icon" sizes="16x16" href="/static/favicon-16x16.png" type="image/png" />
<link rel="icon" sizes="32x32" href="/static/favicon-32x32.png" type="image/png" />

D templates/page-layout.html => templates/page-layout.html +0 -21
@@ 1,21 0,0 @@
<!doctype html>
<html lang="en">

<head>
    {% include 'meta.html' %}
    <meta name="title" content="{{ this.title }} | Animesh Bulusu" />
    {% block head%}
    {%endblock%}
</head>

<body>
    <div class=skiptocontent>
        <a href=#maincontent>skip to main content</a>
    </div>
    {% include 'header.html' %}
    <main id="maincontent" tabindex="-1">
        {% block body %}{% endblock %}
    </main>
</body>

</html>
\ No newline at end of file

M templates/page.html => templates/page.html +14 -22
@@ 1,25 1,17 @@
{% extends "page-layout.html" %}
{% from "macros/posts.html" import render_posts_header %}
{% extends "layout.html" %}
{% from "macros/common.html" import render_header %}
{% block title %}{{ this.title }}{% endblock %}
{% block head%}
<style>:root{--sans-font:-apple-system,BlinkMacSystemFont,'Segoe UI',Helvetica,Arial,sans-serif,'Apple Color Emoji','Segoe UI Emoji','Segoe UI Symbol';--bg:#f7f7f7;--text:#0b0b0b;--link:#0010a1;--border-light:#c2c3c4;--accent:firebrick}@media (prefers-color-scheme:dark){:root{--bg:#090909;--text:#dddddd;--link:#539bf5;--border-light:#444444;--accent:orangered}}.skiptocontent a{padding:6px;position:absolute;top:-40px;left:0;font-size:14px;-webkit-transition:top 1s ease-out,background 1s linear;transition:top 1s ease-out,background 1s linear;z-index:100}.skiptocontent a:active,.skiptocontent a:focus{position:fixed;top:0;left:0;width:auto;height:auto;overflow:visible;text-decoration:underline}body{background:var(--bg);color:var(--text);font-family:var(--sans-font);font-size:18px;margin:0 auto;min-width:320px}header,main{padding:5px 10px}main{font-size:16px;margin:0 auto;margin-top:1rem;outline:0;word-wrap:anywhere}header{display:flex;flex-direction:column;border-bottom:1px solid var(--border-light)}header ul{margin:0;display:flex}header ul li{margin-right:10px}header ul li a{text-decoration:none}h1,h2,h3{font-weight:400}h2{margin-top:35px}h3{margin-top:15px}ul{padding:0;display:flex;flex-grow:1;flex-wrap:wrap}ul li{list-style-type:none}a:link,a:visited{color:var(--link)}.page p,.page ul{line-height:1.5}.page ul{display:unset}.accent{color:var(--accent)!important}@media (min-width:30rem){body{width:480px}}footer{margin-top:4rem;border-top:1px solid var(--border-light);font-size:.8rem}@media (min-width:40rem){body{width:640px;font-size:16px}header{border:none;flex-direction:row;margin-top:1rem}header ul{display:flex;padding:0}header ul li a{text-decoration:initial}}</style>
{%endblock%}
{% block head%}{%endblock%}
{% block body %}
{{ render_posts_header(this.title, this.description) }}
<div class="page">
  {{ this.body }}
</div>
<div>
  {% set children = this.children %}
  {%if children%}
  <footer>
    <p>Previous:</p>
    <ul>
      {% for child in children %}
      <li><a href="{{child|url}}">{{ child.title }}</a></li>
      {% endfor %}
    </ul>
  </footer>
  {%endif%}
</div>
{{ render_header(this.title, this.description) }}
{{ this.body }}
{% set children = this.children %}
{%if children%}
<p>Previous:</p>
<ol>
  {% for child in children %}
  <li><a href="{{child|url}}">{{ child.title }}</a></li>
  {% endfor %}
</ol>
{%endif%}
{% endblock %}
\ No newline at end of file

D templates/post-header.html => templates/post-header.html +0 -11
@@ 1,11 0,0 @@
<header>
    <nav>
        <ul>
            <li><a class="accent" href="/">anmsh.net &compfn;</a></li>
            <li><a href="/about/">about</a></li>
            <li><a href="/now/">now</a></li>
            <li><a href="/tags/">tags</a></li>
            <li><a href="/atom.xml">feed</a></li>
        </ul>
    </nav>
</header>
\ No newline at end of file

D templates/post-layout.html => templates/post-layout.html +0 -23
@@ 1,23 0,0 @@
<!doctype html>
<html lang="en">

<head>
    {% include 'meta.html' %}
    <meta name="title" content="{{ this.title }} | Animesh Bulusu" />
    <link rel="stylesheet" href="/static/post.css">
    {% block head%}
    {%endblock%}
</head>

<body>
    <div class=skiptocontent>
        <a href=#maincontent>skip to main content</a>
    </div>
    {% include 'post-header.html' %}
    <main id="maincontent" tabindex="-1">
        {% block body %}{% endblock %}
    </main>
    {% include 'footer.html' %}
</body>

</html>
\ No newline at end of file

M templates/post.html => templates/post.html +4 -1
@@ 1,9 1,12 @@
{% extends "post-layout.html" %}
{% extends "layout.html" %}
{% from "macros/common.html" import render_header %}
{% from "macros/post.html" import render_post %}
{% block title %}{{ this.title }}{% endblock %}
{% block head%}
<style>:root{--border:#012;--mono-font:Menlo,Consolas,Monaco,Liberation Mono,Lucida Console,monospace;--text-light:#666666}@media (prefers-color-scheme:dark){:root{--border:#666666;--text-light:#808080}img{opacity:.6}}table{border-collapse:collapse;font-size:.9rem}td,th{border:1px solid var(--border);padding:.5rem;text-align:left}table caption{font-weight:700;margin-bottom:.5rem}main img{aspect-ratio:1;border-radius:3px;max-width:100%}figure{margin:1rem;padding:1px}figcaption{font-size:.9rem;padding:0 3px}blockquote{border-left:.35rem solid var(--link);font-style:italic;margin:2rem 0 2rem 2rem;opacity:.8;padding:.4rem .8rem}article>div:not(:first-child){margin-bottom:45px}article ol,article ul{padding:revert}article ul li{list-style-type:revert}article .footer{margin-top:70px}article .footer div{margin-bottom:15px}code{border:1px solid var(--border-light);border-radius:3px;color:var(--code);padding:2px 6px}code,pre{font-family:var(--mono-font);font-size:.8rem}pre{border-left:2px solid var(--link);margin-left:4px;max-width:100%;overflow:auto;padding:1rem 1.4rem}pre code{background:0 0;border:unset;color:var(--text);margin:0;padding:0}.posts ul{margin-bottom:40px;margin-top:0}.posts ul li{display:flex;flex-direction:column;margin-bottom:20px}.post-subs{margin-top:35px}.post-subs dl{font-size:.8rem;padding:3px 8px}.post-subs dd{margin:unset}.post-subs dd:not(:last-child){margin-bottom:10px}.post-tags ul{display:inline;padding:0}.post-tags ul li{display:inline;margin:0 2px}.post-nav{display:flex}.post-nav div:not(:empty){border:1px solid var(--border-light);flex:1;margin:.1rem;padding:.5rem}.post-nav .right{text-align:right}a[name]{display:block}.post-toc{display:none}time{color:var(--text-light);font-size:.8rem}@media (min-width:40rem){h2 a{border-bottom:1px solid var(--border-light)}footer{border:none}}@media (min-width:60rem){.post-toc{display:block;font-size:.8rem;padding:2px 5px;position:fixed}.post-toc ul li{margin-bottom:3px}}</style>
{%endblock%}
{% block body %}
{{ render_header(this.title, this.description) }}
{{ render_post(this) }}

{% if this.toc %}

D templates/posts-layout.html => templates/posts-layout.html +0 -22
@@ 1,22 0,0 @@
<!doctype html>
<html lang="en">

<head>
    {% include 'meta.html' %}
    <meta name="title" content="{{ this.title }} | Animesh Bulusu" />
    <link rel="stylesheet" href="/static/posts.css">
    {% block head%}
    {%endblock%}
</head>

<body>
    <div class=skiptocontent>
        <a href=#maincontent>skip to main content</a>
    </div>
    {% include 'header.html' %}
    <main id="maincontent" tabindex="-1">
        {% block body %}{% endblock %}
    </main>
</body>

</html>
\ No newline at end of file

M templates/posts.html => templates/posts.html +3 -3
@@ 1,9 1,9 @@
{% extends "layout.html" %}
{% from "macros/common.html" import render_header %}
{% from "macros/posts.html" import render_posts %}
{% block title %}{{ this.title }}{% endblock %}
{% block head%}
{%endblock%}
{% block head%}<style>.post{margin-top:25px}.post ul li{margin-bottom:10px}</style>{%endblock%}
{% block body %}

{{ render_header(this.title, this.description) }}
{{ render_posts(this.children.filter(F._model == 'post')) }}
{% endblock %}
\ No newline at end of file

A templates/skip.html => templates/skip.html +1 -0
@@ 0,0 1,1 @@
<div class=skiptocontent><a href=#maincontent>skip to main content</a></div>
\ No newline at end of file

M templates/tag.html => templates/tag.html +5 -5
@@ 1,9 1,9 @@
{% extends "posts-layout.html" %}
{% from "macros/posts.html" import render_posts, render_posts_header %}
{% extends "layout.html" %}
{% from "macros/common.html" import render_header %}
{% from "macros/posts.html" import render_posts %}
{% block title %}{{ this.name }}{% endblock %}
{% block head%}
{%endblock%}
{% block head%}<style>.post{margin-top:25px}.post ul li{margin-bottom:10px}</style>{%endblock%}
{% block body %}
{{ render_posts_header(this.name, this.description) }}
{{ render_header(this.name, this.description) }}
{{ render_posts(this.children.include_undiscoverable(True)) }}
{% endblock %}
\ No newline at end of file

M templates/tags.html => templates/tags.html +4 -14
@@ 1,19 1,9 @@
{% extends "posts-layout.html" %}
{% extends "layout.html" %}
{% from "macros/common.html" import render_header %}
{% from "macros/tags.html" import render_tags %}
{% from "macros/posts.html" import render_posts_header %}
{% block title %}{{ this.header }}{% endblock %}
{% block head%}
<style>
    .tags ul {
        justify-content: initial
    }

    .tags ul li {
        padding: 0 10px 5px 0
    }
</style>
{%endblock%}
{% block head%}<style>.tags{margin-top:25px}.tags ul{display:flex;flex-wrap:wrap}.tags ul li{padding:0 10px 5px 0}</style>{%endblock%}
{% block body %}
{{ render_posts_header(this.header, this.description) }}
{{ render_header(this.header, this.description) }}
{{ render_tags() }}
{% endblock %}
\ No newline at end of file