diff options
| -rw-r--r-- | assets/css/components/_toc.scss | 3 | ||||
| -rw-r--r-- | layouts/_partials/posts/toc.html | 6 |
2 files changed, 6 insertions, 3 deletions
diff --git a/assets/css/components/_toc.scss b/assets/css/components/_toc.scss index 0fcd9188..e8486557 100644 --- a/assets/css/components/_toc.scss +++ b/assets/css/components/_toc.scss @@ -16,6 +16,8 @@ display: inline-flex; align-items: center; gap: .5rem; + text-overflow: ellipsis; + white-space: nowrap; &::before { content: ''; display: inline-block; @@ -24,6 +26,7 @@ background-color: var(--block-background-color); border-radius: .2rem; transition: background .3s; + flex-shrink: 0; } } diff --git a/layouts/_partials/posts/toc.html b/layouts/_partials/posts/toc.html index 7a4a63cf..ea87bb26 100644 --- a/layouts/_partials/posts/toc.html +++ b/layouts/_partials/posts/toc.html @@ -1,9 +1,9 @@ {{ if .Params.toc }} <div id="toc-container" - class="absolute bottom-0 right-[calc(50%_+_var(--page-width)_/_2)] left-auto - h-full top-[12rem] hidden xl:block"> + class="absolute bottom-0 left-[calc(50%_+_var(--page-width)_/_2)] right-auto + h-full w-[calc(50%_-_var(--page-width)_/_2)] top-[19rem] hidden lg:block"> <div id="toc" - class="sticky top-12 text-size-sm 2xl:text-size-base px-8" + class="sticky top-12 text-size-xs xl:text-size-sm 2xl:text-size-base w-full" >{{ .TableOfContents }}</div> </div> {{ end }} |