update styles

This commit is contained in:
Youwen Wu 2024-05-25 01:44:00 -07:00
parent 4aec824ae6
commit 10df9b5639
Signed by: youwen5
GPG key ID: 865658ED1FE61EC3
5 changed files with 47 additions and 10 deletions

View file

@ -29,18 +29,20 @@
h1 {
@apply text-2xl font-bold;
}
h2,
h2 {
@apply text-2xl font-medium mt-8;
}
h3,
h4,
h5,
h6 {
@apply text-xl font-bold mt-4;
@apply text-xl font-medium mt-8 text-accent-light dark:text-accent-dark;
}
p {
@apply leading-loose my-2;
}
img {
@apply mx-auto my-4 rounded-lg;
@apply mx-auto my-6 rounded-lg;
}
div.sourceCode {
@apply p-4 rounded-lg;
@ -51,4 +53,39 @@
math[display="block"] {
@apply overflow-x-auto my-1 text-xl;
}
ul {
@apply list-disc ml-2;
}
ol {
counter-reset: item;
}
ol li {
display: block;
}
ol li:before {
content: counters(item, ".") ". ";
counter-increment: item;
}
ol ol {
li {
@apply ml-2;
}
counter-reset: subitem;
}
ol ol li:before {
@apply ml-4;
content: counter(item, upper-alpha) ". ";
counter-increment: subitem;
}
ol ol ol li:before {
content: counter(subitem, lower-roman) ". ";
}
li {
@apply my-1;
}
}

View file

@ -21,6 +21,11 @@ title: "blog | youwen wu"
class="w-fit dark:group-hover:text-muted-dark group-hover:text-muted-light transition-colors"
>
<h3 class="text-2xl">$title$</h3>
<p
class="italic text-accent-light dark:text-accent-dark my-1 group-hover:dark:text-muted-dark group-hover:text-muted-light transition-colors"
>
$desc$
</p>
<p class="text-sm">$date$</p>
</a>
</div>

File diff suppressed because one or more lines are too long

View file

@ -48,12 +48,6 @@
title="$feedTitle$"
type="application/rss+xml"
/>
<script
defer
src="https://cdn.jsdelivr.net/npm/katex@0.16.10/dist/katex.min.js"
integrity="sha384-hIoBPJpTUs74ddyc4bFZSM1TVlQDA60VBbJS0oA934VSz82sBx1X7kSx2ATBDIyd"
crossorigin="anonymous"
></script>
<link rel="stylesheet" href="./out/bundle.css" />
<link rel="stylesheet" href="./css/code.css" />
<link

View file

@ -4,6 +4,7 @@
<h1 class="text-4xl">
<a href=".$url$">$title$</a>
</h1>
<p class="mb-1 mt-2 italic text-lg">$desc$</p>
<div class="mt-2">$date$</div>
<div class="mt-1 text-sm">
$if(updated)$(last updated: $updated$)$endif$