[blog] Show posts on frontpage

Slight color changes.
This commit is contained in:
Dhananjay Balan 2024-01-07 20:45:13 +01:00
parent 436cccf40e
commit d8b88c8b58
4 changed files with 50 additions and 31 deletions

View File

@ -1,12 +1,13 @@
html { html {
background-color:#fefefe background-color: #fefefe;
} }
.header { .header {
display: grid; display: grid;
grid-template-columns: 70% 30%; grid-template-columns: 70% 30%;
grid-template-rows: auto; grid-template-rows: auto;
font-family: Seravek, 'Gill Sans Nova', Ubuntu, Calibri, 'DejaVu Sans', source-sans-pro, sans-serif; font-family: Seravek, "Gill Sans Nova", Ubuntu, Calibri, "DejaVu Sans",
source-sans-pro, sans-serif;
font-weight: 500; font-weight: 500;
font-size: 10pt; font-size: 10pt;
} }
@ -26,9 +27,9 @@ html {
word-spacing: 110%; word-spacing: 110%;
} }
body { body {
font-family: system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; font-family: system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif,
"Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
font-weight: 400; font-weight: 400;
color: #454545; color: #454545;
margin: 2em auto; margin: 2em auto;
@ -37,15 +38,24 @@ body {
text-align: left; text-align: left;
} }
a:hover {
color: #F4F4F4;
background-color: #AD2831;
text-decoration: none;
}
}
blockquote { blockquote {
font-style: italic; font-style: italic;
} }
video, code { video,
code {
font-weight: normal; font-weight: normal;
max-width: 98%; max-width: 98%;
margin: 3em auto; margin: 3em auto;
font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace; font-family: ui-monospace, "Cascadia Code", "Source Code Pro", Menlo,
Consolas, "DejaVu Sans Mono", monospace;
} }
img { img {
@ -80,24 +90,33 @@ figcaption {
} }
h1 { h1 {
font-family: Charter, 'Bitstream Charter', 'Sitka Text', Cambria, serif; font-family: Charter, "Bitstream Charter", "Sitka Text", Cambria, serif;
font-size: 30pt; font-size: 30pt;
font-weight: bold; font-weight: bold;
} }
h2 { h2 {
font-family: Charter, "Bitstream Charter", "Sitka Text", Cambria, serif;
font-family: Charter, 'Bitstream Charter', 'Sitka Text', Cambria, serif;
font-size: 22pt; font-size: 22pt;
margin-top: 1.5em; margin-top: 1.5em;
font-weight: bold; font-weight: bold;
} }
h3 { h3 {
font-size: 20pt; font-size: 20pt;
} }
ul.posts {
list-style-type: none;
padding: 0;
}
li.post {
margin-bottom: 10px;
padding-bottom: 10px;
border-bottom: 3px solid black;
}
article > ul { article > ul {
padding-left: 0; padding-left: 0;
} }
@ -112,7 +131,6 @@ section > ul > li {
padding-top: 22pt; padding-top: 22pt;
} }
#footerdiv { #footerdiv {
margin-top: 50px; margin-top: 50px;
} }
@ -126,10 +144,12 @@ a {
color: #454545; color: #454545;
font-weight: bold; font-weight: bold;
} }
a:hover {
border-bottom-color: red;
}
h1 > a {
color: #AD2831;
text-decoration: none;
}
sup > a { sup > a {
color: #454545; color: #454545;
font-weight: 430; font-weight: 430;

View File

@ -2,10 +2,11 @@
title: Home title: Home
--- ---
<article> <ul class="posts">
<h1>Recent Posts</h1> $for(posts)$
$partial("templates/post-list.html")$ <li class="post">$body$</li>
$endfor$
</ul>
<p>…or you can find more in the <a href="/archive.html">archive</a>.</p> <p>…or you can find more in the <a href="/archive.html">archive</a>.</p>
</article>

View File

@ -55,11 +55,10 @@ main = hakyllWith config $ do
match "index.html" $ do match "index.html" $ do
route idRoute route idRoute
compile $ do compile $ do
posts <- recentFirst =<< loadAll "blog/*" posts <- fmap (take 4) . recentFirst =<< loadAllSnapshots "blog/*" "content"
let indexCtx = let indexCtx =
listField "posts" (postCtxWTags tags) (return $ take 8 posts) `mappend` listField "posts" postCtx (return $ take 8 posts) `mappend`
constField "title" "Home" `mappend` constField "title" "Home" `mappend`
tagsField "tags" tags `mappend`
defaultContext defaultContext
getResourceBody getResourceBody

View File

@ -1,12 +1,11 @@
<article class="group"> <article class="group">
<h1>$title$</h1> <h1><a href="$url$">$title$</a></h1>
<div class="postmeta"><div id="date">$date$</div> <div class="postmeta">
<div id="date">$date$</div>
$if(tags)$ $if(tags)$
<div id="tags">Posted in $tags$</div> <div id="tags">Posted in $tags$</div>
$endif$ $endif$
</div> </div>
<section> <section>$body$</section>
$body$
</section>
</article> </article>