refactor(tazjin/homepage): long overdue entry list rework
The entry list is now much more condensed. It's maybe a little *too* condensed, but already closer to what I'm looking for. Note: A new "note" post type has snuck in and can now be used for random musings or comments on previous entries. Notes do not show up in the Atom feed. Change-Id: I920c0c7650937474b8a5f30cba78416554d523ce Reviewed-on: https://cl.tvl.fyi/c/depot/+/8806 Reviewed-by: tazjin <tazjin@tvl.su> Autosubmit: tazjin <tazjin@tvl.su> Tested-by: BuildkiteCI
This commit is contained in:
parent
0b2f5510ed
commit
d8d0b17823
6 changed files with 113 additions and 116 deletions
|
@ -46,6 +46,7 @@
|
|||
date = 1423995834;
|
||||
content = ./posts/sick-in-sweden.md;
|
||||
oldKey = "1423995834";
|
||||
listed = false;
|
||||
}
|
||||
{
|
||||
key = "nsa-zettabytes";
|
||||
|
|
|
@ -15,13 +15,18 @@ let
|
|||
inherit (pkgs) writeFile runCommand;
|
||||
|
||||
# The different types of entries on the homepage.
|
||||
entryClass = enum "entryClass" [ "blog" "project" "misc" ];
|
||||
entryClass = enum "entryClass" [
|
||||
"blog"
|
||||
"project"
|
||||
"note"
|
||||
"misc"
|
||||
];
|
||||
|
||||
# The definition of a single entry.
|
||||
entry = struct "entry" {
|
||||
class = entryClass;
|
||||
title = string;
|
||||
url = string;
|
||||
title = option string;
|
||||
url = option string;
|
||||
date = int; # epoch
|
||||
description = option string;
|
||||
};
|
||||
|
@ -33,28 +38,42 @@ let
|
|||
title = post.title;
|
||||
url = "/blog/${post.key}";
|
||||
date = post.date;
|
||||
description = post.description or "Blog post from ${formatDate post.date}";
|
||||
});
|
||||
|
||||
formatDate = defun [ int string ] (date: readFile (runCommand "date" { } ''
|
||||
date --date='@${toString date}' '+%Y-%m-%d' > $out
|
||||
date --date='@${toString date}' '+%Y-%m-%d' | tr -d '\n' > $out
|
||||
''));
|
||||
|
||||
formatEntryDate = defun [ entry string ] (entry: entryClass.match entry.class {
|
||||
blog = "Blog post from ${formatDate entry.date}";
|
||||
project = "Project from ${formatDate entry.date}";
|
||||
misc = "Posted on ${formatDate entry.date}";
|
||||
});
|
||||
entryUrl = defun [ entry string ] (entry:
|
||||
if entry.class == "note"
|
||||
then "#${toString entry.date}"
|
||||
else entry.url
|
||||
);
|
||||
|
||||
hasDescription = defun [ entry bool ] (entry:
|
||||
((entry ? description) && (entry.description != null))
|
||||
);
|
||||
|
||||
entryTitle = defun [ entry string ] (entry:
|
||||
let
|
||||
optionalColon = lib.optionalString (hasDescription entry) ":";
|
||||
titleText =
|
||||
if (!(entry ? title) && (entry.class == "note"))
|
||||
then "[${formatDate entry.date}]"
|
||||
else lib.optionalString (entry ? title) ((escape entry.title) + optionalColon);
|
||||
in
|
||||
lib.optionalString (titleText != "")
|
||||
''<span class="entry-title ${entry.class}">${titleText}</span>''
|
||||
);
|
||||
|
||||
entryToDiv = defun [ entry string ] (entry: ''
|
||||
<a href="${entry.url}" class="entry ${entry.class}">
|
||||
<div>
|
||||
<p class="entry-title">${escape entry.title}</p>
|
||||
${
|
||||
lib.optionalString ((entry ? description) && (entry.description != null))
|
||||
"<p class=\"entry-description\">${escape entry.description}</p>"
|
||||
}
|
||||
<p class="entry-date">${formatEntryDate entry}</p>
|
||||
</div>
|
||||
<a href="${entryUrl entry}" id="${toString entry.date}" class="entry">
|
||||
${entryTitle entry}
|
||||
${
|
||||
lib.optionalString (hasDescription entry)
|
||||
"<span class=\"entry-description\">${escape entry.description}</span>"
|
||||
}
|
||||
</a>
|
||||
'');
|
||||
|
||||
|
|
|
@ -1,3 +1,9 @@
|
|||
let
|
||||
note = date: description: {
|
||||
class = "note";
|
||||
inherit description date;
|
||||
};
|
||||
in
|
||||
[
|
||||
{
|
||||
class = "misc";
|
||||
|
@ -5,8 +11,7 @@
|
|||
url = "https://t.me/tazlog";
|
||||
date = 1643321164;
|
||||
description = ''
|
||||
My new channel on Telegram, for occasional updates smaller (and
|
||||
more frequent) than what ends up being posted here.
|
||||
My Telegram channel with occasional random life updates and musings.
|
||||
'';
|
||||
}
|
||||
{
|
||||
|
@ -15,8 +20,7 @@
|
|||
url = "https://changelog.com/shipit/37";
|
||||
date = 1641819600;
|
||||
description = ''
|
||||
Episode #37 of Ship It!, a podcast about systems, featuring me.
|
||||
We talk about TVL, Nix, monorepos and related things.
|
||||
Podcast episode about TVL, Nix, monorepos and all sorts of related things.
|
||||
'';
|
||||
}
|
||||
{
|
||||
|
@ -24,9 +28,7 @@
|
|||
title = "Tvix";
|
||||
url = "https://tvl.fyi/blog/rewriting-nix";
|
||||
date = 1638381387;
|
||||
description = ''
|
||||
TVL is rewriting Nix with funding from NLNet.
|
||||
'';
|
||||
description = "TVL is rewriting Nix with funding from NLNet.";
|
||||
}
|
||||
{
|
||||
class = "misc";
|
||||
|
@ -34,8 +36,7 @@
|
|||
url = "https://www.youtube.com/watch?v=P-2P3MSZrBM";
|
||||
date = 1594594800;
|
||||
description = ''
|
||||
A fascinating, mind-bending interview by Lex Fridman with Joscha
|
||||
Bach about the Nature of the Universe.
|
||||
Mind-bending discussion with philosopher Joscha Bach.
|
||||
'';
|
||||
}
|
||||
{
|
||||
|
@ -43,7 +44,7 @@
|
|||
title = "The Virus Lounge";
|
||||
url = "https://tvl.fyi";
|
||||
date = 1587435629;
|
||||
description = "A community around Nix, monorepos, build tooling and the like!";
|
||||
description = "A community around Nix, monorepos, build tooling and more!";
|
||||
}
|
||||
{
|
||||
class = "project";
|
||||
|
@ -71,7 +72,7 @@
|
|||
title = "dottime";
|
||||
url = "https://dotti.me/";
|
||||
date = 1560898800;
|
||||
description = "A universal convention for conveying time (by edef <3)";
|
||||
description = "A universal convention for conveying time";
|
||||
}
|
||||
{
|
||||
class = "project";
|
||||
|
@ -86,18 +87,63 @@
|
|||
url = "https://principiadiscordia.com/book/1.php";
|
||||
date = 1495494000;
|
||||
description = ''
|
||||
The Principia is a short book I read as a child, and didn't
|
||||
understand until much later. It shaped much of my world view.
|
||||
A short book about everything that everyone should read.
|
||||
'';
|
||||
}
|
||||
{
|
||||
class = "misc";
|
||||
title = "This Week in Virology";
|
||||
url = "http://www.microbe.tv/twiv/";
|
||||
date = 1585517557;
|
||||
description = ''
|
||||
Podcast with high-quality information about virology,
|
||||
epidemiology and so on. Highly relevant to COVID19.
|
||||
'';
|
||||
title = "Nix — не только пакетный менеджер";
|
||||
date = 1663923600;
|
||||
url = "https://www.youtube.com/watch?v=0Lhahzs-Wos";
|
||||
description = "Двухчасовой (!) разговор с введением в Nix, NixOS и так далее";
|
||||
}
|
||||
{
|
||||
class = "project";
|
||||
title = "yandex-cloud-rs";
|
||||
date = 1650877200;
|
||||
url = "https://docs.rs/yandex-cloud";
|
||||
description = "Простой SDK на Rust для работы с API Yandex Cloud.";
|
||||
}
|
||||
{
|
||||
class = "project";
|
||||
title = "nix-1p";
|
||||
date = 1564650000;
|
||||
url = "https://code.tvl.fyi/about/nix/nix-1p";
|
||||
description = "A (more or less) one-page introduction to the Nix language.";
|
||||
}
|
||||
{
|
||||
class = "misc";
|
||||
title = "Ставим NixOS!";
|
||||
date = 1678784400;
|
||||
url = "https://progmsk.timepad.ru/event/2358560/";
|
||||
description = "Встреча в undef.space для помощи в начале работы с Nix/NixOS";
|
||||
}
|
||||
{
|
||||
class = "misc";
|
||||
title = "Tvix - September '22";
|
||||
date = 1662973200;
|
||||
url = "https://tvl.fyi/blog/tvix-status-september-22";
|
||||
description = "Tvix update blog post over on TVL";
|
||||
}
|
||||
{
|
||||
class = "project";
|
||||
title = "Tvixbolt";
|
||||
date = 1667293200;
|
||||
url = "https://tvixbolt.tvl.su/";
|
||||
description = "In-browser language evaluator for Nix, based on Tvix";
|
||||
}
|
||||
{
|
||||
class = "project";
|
||||
title = "ООО ТВЛ";
|
||||
date = 1609491600;
|
||||
url = "https://tvl.su/ru/";
|
||||
description = "Официальный сайт моей компании по IT-консалтингу.";
|
||||
}
|
||||
|
||||
# Notes.
|
||||
(note 1676106000 "If you have a Huawei device that sometimes struggles on public Wi-Fi networks, try enabling MAC-address randomisation. Huawei devices often get pushed onto management networks!")
|
||||
(note 1686868637 "I moved some of my pages (including this one) to a machine in my flat in Moscow. If you end up having access trouble because your ISP blocks Russian resources, please let me know.")
|
||||
(note 1686868636 "Protip: Use the Reddit blackout to click the 'Logout' button, and never come back.")
|
||||
(note 1486550941 "↓ I no longer recommend people to use this. Generate your configuration from a language like Nix instead.")
|
||||
(note 1576800001 "↓ No longer just my projects, it's all of TVL! Go check it out.")
|
||||
]
|
||||
|
|
|
@ -4,7 +4,7 @@
|
|||
with depot.nix.yants;
|
||||
|
||||
let
|
||||
inherit (builtins) map readFile;
|
||||
inherit (builtins) filter map readFile;
|
||||
inherit (lib) max singleton;
|
||||
inherit (pkgs) writeText;
|
||||
inherit (depot.web) blog atom-feed;
|
||||
|
@ -23,7 +23,7 @@ let
|
|||
});
|
||||
|
||||
allEntries = (with depot.users.tazjin.blog; map (blog.toFeedEntry config) posts)
|
||||
++ (map pageEntryToEntry pageEntries);
|
||||
++ (map pageEntryToEntry (filter (e: e.class != "note") pageEntries));
|
||||
|
||||
feed = {
|
||||
id = "https://tazj.in/";
|
||||
|
|
|
@ -3,6 +3,7 @@
|
|||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<meta name="description" content="tazjin's blog">
|
||||
<link rel="stylesheet" type="text/css" href="static/tvl.css" media="all">
|
||||
<link rel="stylesheet" type="text/css" href="static/tazjin.css" media="all">
|
||||
<link rel="icon" type="image/webp" href="/static/favicon.webp">
|
||||
<link rel="alternate" type="application/atom+xml" href="/feed.atom">
|
||||
<title>tazjin's interblag</title>
|
||||
|
@ -15,22 +16,14 @@
|
|||
<hr>
|
||||
</header>
|
||||
<div class="introduction">
|
||||
<p>Hi, I'm tazjin.</p>
|
||||
<p>
|
||||
I spend a lot of my time hacking on the
|
||||
<a class="dark-link" href="https://tvl.fyi">TVL</a> monorepo and
|
||||
doing other computer-related things. Follow me
|
||||
on <a class="dark-link" href="https://t.me/tazlog">Telegram</a>,
|
||||
via the feed here or (occasionally) catch me in-person
|
||||
at <a href="https://undef.club/#about" class="dark-link">
|
||||
undef.club</a>.
|
||||
</p>
|
||||
<p>
|
||||
Below is a collection of
|
||||
Below are some of
|
||||
my <span class="project">projects</span>, <span class="blog">blog
|
||||
posts</span> and some <span class="misc">random things</span> by
|
||||
me or others. If you'd like to get in touch about anything, send
|
||||
me a mail at mail@[this domain] or ping me on IRC.
|
||||
posts</span>, <span class="note">notes</span> and some
|
||||
other <span class="misc">random things</span>. If you'd like to
|
||||
get in touch, email me at mail@[this domain] or ping me
|
||||
on <a class="dark-link" href="https://tvl.fyi">TVL</a> IRC.
|
||||
</p>
|
||||
<hr>
|
||||
</div>
|
||||
<div class="entry-container">
|
||||
|
|
|
@ -35,10 +35,6 @@ body {
|
|||
font-family: jetbrains-mono, monospace;
|
||||
}
|
||||
|
||||
p, a :not(.uncoloured-link) {
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
h1, h2, h3 {
|
||||
line-height: 1.2
|
||||
}
|
||||
|
@ -54,64 +50,6 @@ article p {
|
|||
margin: 1.4em auto;
|
||||
}
|
||||
|
||||
/* Homepage styling */
|
||||
|
||||
.dark {
|
||||
background-color: #181818;
|
||||
color: #e4e4ef;
|
||||
}
|
||||
|
||||
.dark-link, .interblag-title {
|
||||
color: #96a6c8;
|
||||
}
|
||||
|
||||
.entry-container {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: wrap;
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
.interblag-title {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.entry {
|
||||
width: 42%;
|
||||
margin: 5px;
|
||||
padding-left: 7px;
|
||||
padding-right: 5px;
|
||||
border: 2px solid;
|
||||
border-radius: 5px;
|
||||
flex-grow: 1;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.misc {
|
||||
color: #73c936;
|
||||
border-color: #73c936;
|
||||
}
|
||||
|
||||
.blog {
|
||||
color: #268bd2;
|
||||
border-color: #268bd2;
|
||||
}
|
||||
|
||||
.project {
|
||||
color: #ff4f58;
|
||||
border-color: #ff4f58;
|
||||
}
|
||||
|
||||
.entry-title {
|
||||
color: inherit !important;
|
||||
font-weight: bold;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.entry-date {
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
/* Blog styling */
|
||||
|
||||
.light {
|
||||
|
|
Loading…
Reference in a new issue