Generate Index
This commit is contained in:
parent
d861c7ef87
commit
c59c266ee1
4 changed files with 115 additions and 12 deletions
|
|
@ -6,12 +6,16 @@ use DB::Post;
|
|||
|
||||
unit class Config;
|
||||
|
||||
method generate-head(Str:D $title, BlogMeta:D $meta, $description?) {
|
||||
method generate-head($title, BlogMeta:D $meta, $description?) {
|
||||
head [
|
||||
meta :charset<utf-8>;
|
||||
meta :name<viewport>, :content<width=device-width, initial-scale=1>;
|
||||
meta :author :content<Nathan McCarty>;
|
||||
do if $title ~~ Str:D {
|
||||
title "$title — {$meta.title}";
|
||||
} else {
|
||||
title $meta.title;
|
||||
}
|
||||
# Add description, if one exists
|
||||
do if $description ~~ Str:D {
|
||||
meta :description :content($description)
|
||||
|
|
@ -123,15 +127,19 @@ method post-read-time(Post:D $post) {
|
|||
]
|
||||
}
|
||||
|
||||
method post-info(Post:D $post) {
|
||||
div :class<post-info>, [
|
||||
self.post-date: $post;
|
||||
self.post-read-time: $post;
|
||||
];
|
||||
}
|
||||
|
||||
method post-header(Post:D $post) {
|
||||
header :class<post-header>, [
|
||||
div :class<post-title>, [
|
||||
h1 $post.title;
|
||||
];
|
||||
div :class<post-info>, [
|
||||
self.post-date: $post;
|
||||
self.post-read-time: $post;
|
||||
];
|
||||
self.post-info: $post;
|
||||
# TODO: Add tags once we have support for that
|
||||
]
|
||||
}
|
||||
|
|
@ -161,6 +169,59 @@ method generate-post(Post:D $post, BlogMeta:D $meta) {
|
|||
"<!doctype html>$html"
|
||||
}
|
||||
|
||||
method generate-blurb(Int:D $id, $db) {
|
||||
my $post = $db.posts{$id};
|
||||
my $desc = $post.description;
|
||||
my @slugs = $post.all-slugs;
|
||||
# Use the primary slug if there is one, the id if there isn't
|
||||
my $link = do if @slugs.elems > 0 {
|
||||
"/posts/by-slug/{@slugs[0]}.html"
|
||||
} else {
|
||||
"/posts/by-id/$id.html"
|
||||
}
|
||||
div :class<post-blurb>, [
|
||||
div :class<post-blurb-title>, [
|
||||
a :href($link), span [
|
||||
h2 $post.title;
|
||||
];
|
||||
];
|
||||
self.post-info: $post;
|
||||
if $desc ~~ Str:D {
|
||||
div :class<post-blurb-description>, [
|
||||
p $post.description;
|
||||
];
|
||||
} else {
|
||||
[]
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
method generate-index($db) {
|
||||
my @most-recent =
|
||||
$db.sorted-posts
|
||||
.head(10)
|
||||
.grep(!*.value.hidden)
|
||||
.map(-> $pair {
|
||||
self.generate-blurb: $pair.key, $db
|
||||
});
|
||||
|
||||
my $head = self.generate-head(Nil, $db.meta);
|
||||
my $body = body [
|
||||
self.site-header: $db.meta;
|
||||
div :class<post-blurbs>, [
|
||||
h1 "Recent Posts"
|
||||
], @most-recent;
|
||||
];
|
||||
|
||||
my $html =
|
||||
html :lang<en>, [
|
||||
$head,
|
||||
$body
|
||||
];
|
||||
|
||||
"<!doctype html>$html"
|
||||
}
|
||||
|
||||
sub icon($icon) {
|
||||
i(:class("bx bx-$icon"))
|
||||
}
|
||||
|
|
|
|||
|
|
@ -83,17 +83,23 @@ class PostDB {
|
|||
$id-path.spurt: $html;
|
||||
for $post.all-slugs -> $slug {
|
||||
# remove the symlink if it already exists
|
||||
my $slug-path = $by-slug.add: $slug;
|
||||
my $slug-path = $by-slug.add: "$slug.html";
|
||||
$slug-path.unlink if $slug-path.l;
|
||||
$id-path.symlink: $slug-path;
|
||||
}
|
||||
}
|
||||
# Render the archive
|
||||
# Render the rss/atom feed
|
||||
# Render the index
|
||||
# Symlink the about article
|
||||
$out-dir.add('index.html').spurt: $config.generate-index(self);
|
||||
# TODO: Render the archive
|
||||
# TODO: Render the rss/atom feed
|
||||
# TODO: Symlink the about article
|
||||
die "Not Implemented"
|
||||
}
|
||||
|
||||
#| Get a list of posts sorted by date
|
||||
method sorted-posts() {
|
||||
%!posts.sort(*.value.posted-at).reverse
|
||||
}
|
||||
}
|
||||
|
||||
#| Read the database out of a directory
|
||||
|
|
|
|||
|
|
@ -13,3 +13,6 @@ has Str:D $.tagline is required is rw;
|
|||
|
||||
#| The id of the placeholder post
|
||||
has Int:D $.placeholder-id is rw = 0;
|
||||
|
||||
#| The id of the about post
|
||||
has Int:D $.about-id is rw = 0;
|
||||
|
|
|
|||
|
|
@ -46,7 +46,7 @@ body, .post {
|
|||
font-style: italic;
|
||||
}
|
||||
|
||||
.post-body, .post-header {
|
||||
.post-body, .post-header, .post-blurbs {
|
||||
width: 66%;
|
||||
display: block;
|
||||
padding-left: 1.5rem;
|
||||
|
|
@ -58,6 +58,28 @@ body, .post {
|
|||
/* text-align: justify; */
|
||||
}
|
||||
|
||||
.post-blurbs {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex-direction: column;
|
||||
gap: 1rem;
|
||||
}
|
||||
|
||||
.post-blurb {
|
||||
width: 100%;
|
||||
display: block;
|
||||
border-radius: 1rem;
|
||||
padding: 0.5rem;
|
||||
background-color: light-dark(#ebebeb, #252525);
|
||||
/* background-color: light-dark(#cdcdcd, #3b3b3b); */
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex-direction: column;
|
||||
/* gap: 0.25rem; */
|
||||
}
|
||||
|
||||
.post-header {
|
||||
padding: 1.5rem;
|
||||
display: flex;
|
||||
|
|
@ -71,7 +93,18 @@ body, .post {
|
|||
color: light-dark(#dd0f9d, #eb6eb7);
|
||||
}
|
||||
|
||||
.post-title > h1 {
|
||||
.post-blurbs > h1 {
|
||||
color: light-dark(#1d9700, #70b433);
|
||||
}
|
||||
|
||||
a:link {
|
||||
color: light-dark(#009c8f, #41c7b9);
|
||||
}
|
||||
|
||||
a:visited {
|
||||
color: light-dark(#dd0f9d, #eb6eb7);
|
||||
}
|
||||
.post-title > h1, .post-blurb-title > h2 {
|
||||
margin-top: 0px;
|
||||
margin-bottom: 0px;
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue