diff options
Diffstat (limited to 'assets/scss')
| -rw-r--r-- | assets/scss/_fuji-style/_sidebar.scss | 67 |
1 files changed, 33 insertions, 34 deletions
diff --git a/assets/scss/_fuji-style/_sidebar.scss b/assets/scss/_fuji-style/_sidebar.scss index a300c4c..e913d95 100644 --- a/assets/scss/_fuji-style/_sidebar.scss +++ b/assets/scss/_fuji-style/_sidebar.scss @@ -36,55 +36,54 @@ @media screen and (max-width: $width-md) { .sidebar-mobile { + width: 70%; position: fixed; top: 0; right: 0; bottom: 0%; background-color: var(--color-codebg); - padding: 1.5rem; - display: flex; - flex-direction: row; - flex-wrap: wrap; - justify-content: space-around; z-index: 50; + overflow: auto; + display: flex; + flex-direction: column-reverse; - .sidebar-item { - width: 40%; // max 2 modules per line - - // space only at first 2 modules - .sidebar-pages, - .sidebar-tags { - margin-bottom: 1rem; - } + .sidebar-wrapper { + display: flex; + flex-direction: column; + flex-wrap: nowrap; + justify-content: space-around; + margin: 1.5rem 4.25rem 1.5rem 1.5rem; + } - .sidebar-links, - .sidebar-bgm { - margin-bottom: 0; - } + .sidebar-item { + width: 90%; // max 1 module per line + text-align: right; - & > img { - margin: 0.5rem 0.25rem 0 0.25rem; - width: 75%; - border-radius: 0.25rem; + // space only at not first modules + margin-top: 1rem; + &:last-child { + margin-top: 0; } } } } -// single page part -.sidebar-toc { - ul ul { - font-size: 0.875rem; - padding-left: 0.5rem; - margin-bottom: 0.25rem; - } +@media screen and (min-width: $width-md) { + // single page part + .sidebar-toc { + ul ul { + font-size: 0.875rem; + padding-left: 0.5rem; + margin-bottom: 0.25rem; + } - position: sticky; - top: 1rem; + position: sticky; + top: 1rem; - #TableOfContents { - max-height: 32rem; - overflow: auto; - scrollbar-width: thin; + #TableOfContents { + max-height: 32rem; + overflow: auto; + scrollbar-width: thin; + } } } |