From 44050ace93362c273e5589cc86378b825c6d49e3 Mon Sep 17 00:00:00 2001 From: Nicolas Doby Date: Fri, 6 Jan 2023 09:54:50 +0100 Subject: [PATCH] refactor: review the table of content display --- src/blog_assets/css/index.scss | 27 ++++++++++++++++++++------- 1 file changed, 20 insertions(+), 7 deletions(-) diff --git a/src/blog_assets/css/index.scss b/src/blog_assets/css/index.scss index fc8d699..c001373 100644 --- a/src/blog_assets/css/index.scss +++ b/src/blog_assets/css/index.scss @@ -75,16 +75,21 @@ main { position: sticky; top: 1rem; align-self: flex-start; - width: 320px; } .left-side { padding-right: 60px; + min-width: 360px; + max-width: 360px; +} +.right-side { + min-width: 300px; + max-width: 300px; } .table-of-contents { background: var(--background-color-toc); border-radius: 5px; - padding: 0.7rem; + padding: 1.625rem 0.7rem; } .table-of-contents ul { @@ -97,9 +102,7 @@ main { } li { - text-overflow: ellipsis; - overflow: hidden; - white-space: nowrap; + line-height: 17px; a { font-weight: bold; @@ -113,13 +116,23 @@ main { } } +.table-of-contents > ul ul { + margin-top: 10px; +} + .table-of-contents > ul ul li { - margin-left: 0.7rem; + margin: 0 0 0 0.7rem; + line-height: 17px; a { font-weight: normal; } } +.table-of-contents > ul ul li+li, +.table-of-contents > ul ul li:first-child { + margin-bottom: .5rem; +} + .right-side { padding-left: 60px; } @@ -293,7 +306,7 @@ figure figcaption { gap: 3rem; } .post-list-item { - max-width: 430px; + max-width: 410px; padding: 2rem; border-radius: 5px; box-shadow: 0 5px 10px rgba(0,0,0,0.3);