til/templates/index.html
{% extends "til_base.html" %}
{% block title %}Simon Willison: TIL{% endblock %}<!DOCTYPE html>
{% block extra_head %}
<link href="https://github.com/simonw" rel="me">
<link href="https://fedi.simonwillison.net/@simon" rel="me">
<link href="https://simonwillison.net/" rel="me">
<style>
input[type=search] {
padding: .25em;
font-size: 16px;
width: 60%;
}
input[type=submit] {
box-sizing: border-box;
color: #fff;
background-color: #007bff;
border-color: #007bff;
font-weight: 400;
cursor: pointer;
text-align: center;
border-width: 1px;
border-style: solid;
padding: .5em 0.8em;
font-size: 16px;
line-height: 1;
border-radius: .25rem;
margin-left: 0.3em;
}
h1 {
font-family: Georgia, 'Times New Roman', Times, serif;
}
.topic {
background-color: #ccc;
padding: 3px;
border: 1px solid #777;
font-size: 0.65em;
position: relative;
top: -1px;
}
.topic a {
text-decoration: none;
color: black;
}
</style>
{% endblock %}
{% block body %}
{% set til_count = sql("select count(*) from TIL", database="tils")[0][0] %}
<h1>Simon Willison: TIL</h1>
<p>Things I've learned, collected in <a href="https://github.com/simonw/til">simonw/til</a>. You may also enjoy <a href="https://simonwillison.net/">my blog</a>.</p>
<p><a style="text-decoration: none" href="/tils/feed.atom" title="Atom feed"><svg xmlns="http://www.w3.org/2000/svg" width="14px" height="14px" viewBox="0 0 256 256">
<defs>
<linearGradient id="a" x1=".1" x2=".9" y1=".1" y2=".9">
<stop offset="0" stop-color="#E3702D" />
<stop offset=".1" stop-color="#EA7D31" />
<stop offset=".4" stop-color="#F69537" />
<stop offset=".5" stop-color="#FB9E3A" />
<stop offset=".7" stop-color="#EA7C31" />
<stop offset=".9" stop-color="#DE642B" />
<stop offset="1" stop-color="#D95B29" />
</linearGradient>
</defs>
<rect width="256" height="256" fill="#CC5D15" rx="55" ry="55" />
<rect width="246" height="246" x="5" y="5" fill="#F49C52" rx="50" ry="50" />
<rect width="236" height="236" x="10" y="10" fill="url(#a)" rx="47" ry="47" />
<circle cx="68" cy="189" r="24" fill="#FFF" />
<path fill="#FFF" d="M160 213h-34a82 82 0 0 0-82-82V97a116 116 0 0 1 116 116z" />
<path fill="#FFF" d="M184 213A140 140 0 0 0 44 73V38a175 175 0 0 1 175 175z" />
</svg> Atom feed</a></p>
<form action="/tils/search">
<p>
<input type="search" name="q" placeholder="Search {{ til_count }} TILs">
<input type="submit" value="Search">
</p>
</form>
<p><strong>Browse by topic:</strong>
{% for row in sql("select topic, count(*) as num_tils from til group by topic order by topic", database="tils") %}
<a title="{{ row.num_tils }} TIL{{ "s" if row.num_tils > 1 else "" }}" href="/{{ row.topic }}">{{ row.topic }}</a> {{ row.num_tils }}{% if not loop.last %} ·{% endif %}
{% endfor %}
</p>
<h2>Recent TILs</h2>
{% for til in sql("select * from til order by created_utc desc limit 30", database="tils") %}
<h3><span class="topic"><a href="/{{ til.topic }}">{{ til.topic }}</a></span> <a href="/{{ til.topic }}/{{ til.slug }}">{{ til.title }}</a> - {{ til.created[:10] }}</h3>
{{ first_paragraph(til["html"]).replace("</p>", " … </p>")|safe }}
{% endfor %}
<p><a href="/all">Browse all {{ til_count }} TILs</a></p>
{% endblock %}