@use chrono::{Datelike, Utc};

@(title: Option<&str>, styles: Option<&str>)

<!DOCTYPE html>
<!--
MMMMMMMMMMMMMMMMMMNmmNMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMNmmmd.:mmMM
MMMMMMMMMMMMMMMMMNmmmNMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMNmmydmmmmmNMM
MMMMMMMMMMMMMMMMNm/:mNMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMNmms /mmmmmMMM
MMMMMMMMMMMMMMMNmm:-dmMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMNmmmmdsdmmmmNMMM
MMMMMMMMMMMMMMMmmmmmmmNMMMMMMMMMMMNmmdhhddhhmNNMMMMMMMMMMMMMMMMNmy:hmmmmmmmmMMMM
MMMMMMMMMMMMMMNm++mmmmNMMMMMMmdyo/::.........-:/sdNMMMMMMMMMMNmmms`smmmmmmmNMMMM
MMMMMMMMMMMMMMmd.-dmmmmMMmhs/-....................-+dNMMMMMMNmmmmmmmmmmmmmmMMMMM
MMMMMMMMMMMMMNmmmmmmmmho:-...........................:sNMMNmmmmmmmmmmmmmmmNMNmdd
MMMMMMMMMMMMNmd+ydhs/-.................................-sNmmmmmmmmmmmmmmmdhyssss
MMMMMMMMMMMNNh+`........................................:dmmmmmmmmmmmmmmmyssssss
MMMMNNdhy+:-...........................................+dmmmmmmmmmmmmmmmdsssssss
MMMN+-...............................................-smmmmmmmmmmmmmmmmmysyyhdmN
MMMMNho:::-.--::-.......................----------..:hmmmmmmmmmmmmmmmmmmmNMMMMMM
MMMMMMMMNNNmmdo:......................--------------:ymmmmmmmmmmmmmmmmmmmMMMMMMM
MMMMMMMMMMds+........................-----------------+dmmmmmmmmmmmmmmmmmMMMMMMM
MMMMMMMMMh+........................--------------------:smmmmmmmmmmmmmmNMMMMMMMM
MMMMMMMNy/........................-------------::--------/hmmmmmmmmmmmNMMMMMMNmd
MMMMMMMd/........................--------------so----------odmmmmmmmmMMNmdhhysss
MMMMMMm/........................--------------+mh-----------:ymmmmdhhyysssssssss
MMMMMMo.......................---------------:dmmo------------+dmdysssssssssssss
yhdmNh:......................---------------:dmmmm+------------:sssssssssssyhhdm
sssssy.......................--------------:hmmmmmmos++:---------/sssyyhdmNMMMMM
ssssso......................--------------:hmmmNNNMNdddysso:------:yNNMMMMMMMMMM
ysssss.....................--------------/dmNyy/mMMd``d/------------sNMMMMMMMMMM
MNmdhy-...................--------------ommmh`o/NM/. smh+-----------:yNMMMMMMMMM
MMMMMN+...................------------/hmmss: `-//-.smmmmd+----------:hMMMMMMMMM
MMMMMMd:..................----------:smmmmhy+oosyysdmmy+:.  `.--------/dMMMMMMMM
MMMMMMMh-................---------:smmmmmmmmmmmmmmmh/`      `/s:-------sMMMMMMMM
MMMMMMMms:...............-------/ymmmmmmmmmmmmmmmd/        :dMMNy/-----+mMMMMMMM
MMMMMMmyss/..............------ommmmmmmmmmmmmmmmd.       :yMMMMMMNs:---+mMMMMMMM
MMMMNdssssso-............----..odmmmmmmmmmmmmmmh:.`    .sNMMMMMMMMMd/--sMMMMMMMM
MMMmysssssssh/................`  -odmmmmmmmmmh+.     `omMMMMMMMMMMMMh/+mMMMMMMMM
MNdyssssssymMNy-..............     `/sssso+:.      `+mMMMMMMMMMMMMMMMdNMMMMMMMMM
NhssssssshNMMMMNo:............/.`                `+dMMMMMMMMMMMMMMMMMMMMMMMMMMMM
ysssssssdMMMMMMMMm+-..........+ddy/.`          -omMMMMMMMMMMMMMMMMMMMMMMMMMMMMMM
ssssssymMMMMMMMMMMMh/.........-oNMMNmy+--` `-+dNMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMM
ssssydNMMMMMMMMMMMMMNy:........-hMMMMMMMNmdmMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMM
sssymMMMMMMMMMMMMMMMMMm+....-..:hMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMM
symNMMMMMMMMMMMMMMMMMMMNo.../-/dMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMM
dNMMMMMMMMMMMMMMMMMMMMMMh:.:hyNMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMM
la budza pu cusku lu
  <<.i do snura .i ko kanro
    .i do panpi .i ko gleki>> li'u
-->
<html lang="en">
    <head>
        @if title.is_some() {
        <title>@title.unwrap() - Xe</title>
        } else {
        <title>Xe</title>
        }
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <link rel="stylesheet" href="/css/hack.css" />
        <link rel="stylesheet" href="/css/gruvbox-dark.css" />
        <link rel="stylesheet" href="/css/shim.css" />
        @if Utc::now().month() == 12 || Utc::now().month() == 1 || Utc::now().month() == 2 { <link rel="stylesheet" href="/css/snow.css?snowfix=20211201" /> }
        <link rel="manifest" href="/static/manifest.json" />

        <link rel="alternate" title="Xe's Blog" type="application/rss+xml" href="https://christine.website/blog.rss" />
        <link rel="alternate" title="Xe's Blog" type="application/json" href="https://christine.website/blog.json" />

        <link rel="apple-touch-icon" sizes="57x57" href="/static/favicon/apple-icon-57x57.png">
        <link rel="apple-touch-icon" sizes="60x60" href="/static/favicon/apple-icon-60x60.png">
        <link rel="apple-touch-icon" sizes="72x72" href="/static/favicon/apple-icon-72x72.png">
        <link rel="apple-touch-icon" sizes="76x76" href="/static/favicon/apple-icon-76x76.png">
        <link rel="apple-touch-icon" sizes="114x114" href="/static/favicon/apple-icon-114x114.png">
        <link rel="apple-touch-icon" sizes="120x120" href="/static/favicon/apple-icon-120x120.png">
        <link rel="apple-touch-icon" sizes="144x144" href="/static/favicon/apple-icon-144x144.png">
        <link rel="apple-touch-icon" sizes="152x152" href="/static/favicon/apple-icon-152x152.png">
        <link rel="apple-touch-icon" sizes="180x180" href="/static/favicon/apple-icon-180x180.png">
        <link rel="icon" type="image/png" sizes="192x192" href="/static/favicon/android-icon-192x192.png">
        <link rel="icon" type="image/png" sizes="32x32" href="/static/favicon/favicon-32x32.png">
        <link rel="icon" type="image/png" sizes="96x96" href="/static/favicon/favicon-96x96.png">
        <link rel="icon" type="image/png" sizes="16x16" href="/static/favicon/favicon-16x16.png">
        <link rel="manifest" href="/static/favicon/manifest.json">
        <meta name="msapplication-TileColor" content="#ffffff">
        <meta name="msapplication-TileImage" content="/static/favicon/ms-icon-144x144.png">
        <meta name="theme-color" content="#ffffff">
        <link href="https://mi.within.website/api/webmention/accept" rel="webmention" />
        @if styles.is_some() {
          <style>
             @styles.unwrap()
          </style>
        }
    </head>
    <body class="snow hack gruvbox-dark">
        <div class="container">
            <header>
                <span class="logo"></span>
                <nav><a href="/">Xe</a> - <a href="/blog">Blog</a> - <a href="/contact">Contact</a> - <a href="/gallery">Gallery</a> - <a href="/resume">Resume</a> - <a href="/talks">Talks</a> - <a href="/signalboost">Signal Boost</a> - <a href="/feeds">Feeds</a> | <a target="_blank" rel="noopener noreferrer" href="https://graphviz.christine.website">GraphViz</a> - <a target="_blank" rel="noopener noreferrer" href="https://when-then-zen.christine.website/">When Then Zen</a></nav>
            </header>

            <br />
            <br />
            <div class="snowframe">