jfmonty2/blog
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

make dropcap switchable between ascender/descender

Browse Source
This commit is contained in:
Joseph Montanaro
2026-03-05 08:45:49 -05:00
parent b291e93e75
commit 13d0ac8de7
5 changed files with 27 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
src/components/Post.astro
View File

@@ -47,7 +47,7 @@ h1 {
.subtitle {
font-size: 0.85em;
font-style: italic;
margin-top: -1rem;
margin-top: -0.5rem;
}
.post {
@@ -76,15 +76,25 @@ footer {
}
}
article :global(section.post::first-letter) {
initial-letter: 2;
margin-right: 0.5rem;
color: var(--accent-color);
font-family: 'Baskervville';
article {
& :global(section.post::first-letter) {
font-family: 'Baskervville';
color: var(--accent-color);
}
&[data-dropcap-style="descender"] :global(section.post::first-letter) {
initial-letter: 2;
margin-right: 0.5rem;
}
&[data-dropcap-style="ascender"] :global(section.post::first-letter) {
font-size: 2em;
line-height: 1;
}
}
</style>
<article class="prose">
<article class="prose" data-dropcap-style={entry.data.dropcap}>
<header class="title">
<h1>
<!-- <SmallCaps text={entry.data.title} upperWeight={500} lowerWeight={800} /> -->