akemi/noway.moe
1
0
Fork 0
Code Issues 1 Pull requests Packages Projects Releases Wiki Activity

Markdown: improve heading styles

Browse source
This commit is contained in:
Akemi Izuko 2023-12-29 15:37:47 -07:00
parent eff91d3614
commit 31cd1bd61b
Signed by: akemi
GPG key ID: 8DE0764E1809E9FC
2 changed files with 20 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

19
src/layouts/BlogPost.astro
View file

@ -83,19 +83,34 @@ const { title, description, pubDate, updatedDate, heroImage } = Astro.props;
} }
.prose h1 { .prose h1 {
font-size: 40px; font-size: 40px;
border-bottom: 2px solid #000;
margin-bottom: calc(var(--font-size) / 3); margin-bottom: calc(var(--font-size) / 3);
} }
.prose h1:after { /* Psuedo-element prevents extending to padding */
content: "";
display: block;
border-bottom: 2px solid #000;
}
.prose h2 { .prose h2 {
font-size: 30px; font-size: 30px;
}
.prose h2:after { /* Psuedo-element prevents extending to padding */
content: "";
display: block;
border-bottom: 1px solid #aaa; border-bottom: 1px solid #aaa;
} }
.prose h3 { .prose h3 {
font-size: 26px; font-size: 26px;
} }
.prose h4, .prose h5, .prose h6 { .prose h4 {
font-size: 22px; font-size: 22px;
} }
.prose h5 {
font-size: 20px;
}
.prose h6 {
color: #888;
font-size: 18px;
}
/**** Paragraphs ****/ /**** Paragraphs ****/
.prose p { .prose p {

5
src/pages/blog/index.astro
View file

@ -59,15 +59,16 @@ const posts = (await getCollection('blog')).sort(
<main> <main>
<section> <section>
<h1 <h1
class="text-center text-4xl" class="text-center mt-8 mb-4 text-6xl"
style="font-family: var(--font-title);"> style="font-family: var(--font-title);">
Blogs! Blogs!
</h1> </h1>
<p <p
class="text-center m-6"> class="text-center mb-4 text-xl">
A collection of tutorials and opinionated pieces. Have a A collection of tutorials and opinionated pieces. Have a
read! read!
</p> </p>
<hr class="m-4" style="border: 1px solid black;" />
<ul> <ul>
{ {
posts.map((post) => ( posts.map((post) => (