updated table of content scrollbar

This commit is contained in:
liyunze 2024-05-02 23:25:04 +08:00
parent f99f73d631
commit c2c8fd545f
2 changed files with 11 additions and 1 deletions

View file

@ -13,7 +13,7 @@ const { headings } = Astro.props;
<h3 class="text-lg font-bold mb-2 mt-0" transition:name="Table of Content">
Table of Contents
</h3>
<ul class="text-sm list-none">
<ul class="text-sm list-none toc-scrollbar">
{
headings.map((heading: Heading, index: number) => {
// if (heading.depth === 1) return;

View file

@ -117,6 +117,16 @@ const { title, description } = Astro.props;
a.preview {
text-decoration: none;
}
.toc-scrollbar {
overflow-y: auto;
max-height: 60vh;
/* scroll bar */
scrollbar-width: thin;
scrollbar-color: #4a4a4a #2b2d31;
scrollbar-gutter: 10px;
}
</style>
</body>
</html>