.toc-menu { color: var(--toc-font-color); margin-top: 2.5rem; } .toc.sidebar .toc-menu { margin-right: 0.75rem; position: sticky; top: var(--toc-top); } .toc .toc-menu h3 { color: var(--toc-heading-font-color); font-size: calc(16 / var(--rem-base) * 1rem); font-weight: var(--body-font-weight-bold); line-height: 1.3; margin: 0 -0.5px; padding-bottom: 0.25rem; } .toc.sidebar .toc-menu h3 { display: flex; flex-direction: column; /* height: 2.5rem; */ justify-content: flex-end; } .toc .toc-menu ul { font-size: calc(15 / var(--rem-base) * 1rem); line-height: var(--toc-line-height); list-style: none; margin: 0; padding: 0; } .toc.sidebar .toc-menu ul { max-height: var(--toc-height); overflow-y: auto; overscroll-behavior: none; } @supports (scrollbar-width: none) { .toc.sidebar .toc-menu ul { scrollbar-width: none; } } .toc .toc-menu ul::-webkit-scrollbar { width: 0; height: 0; } @media screen and (min-width: 1024px) { .toc .toc-menu h3 { font-size: calc(15 / var(--rem-base) * 1rem); } .toc .toc-menu ul { font-size: calc(13.5 / var(--rem-base) * 1rem); } } .toc .toc-menu li { position: relative; margin: 0; } .toc .toc-menu li[data-level="2"] a { padding-left: 1.25rem; } .toc .toc-menu li[data-level="3"] a { padding-left: 2rem; } .toc .toc-menu a { color: inherit; border-left: 2px solid var(--toc-border-color); display: inline-block; padding: 0.5rem 0 0.5rem 0.5rem; text-decoration: none; } .sidebar.toc .toc-menu a { display: block; outline: none; } /* .toc .toc-menu a:hover { color: var(--color-bwg-main); } */ .toc .toc-menu a.is-active { border-left: 3px solid var(--color-bwg-main); color: var(--color-bwg-main); font-weight: 600; } .sidebar.toc .toc-menu a:hover { background: var(--color-blue-10); } .sidebar .capture-btn { cursor: pointer; display: flex; justify-content: center; align-items: center; position: fixed; bottom: 20px; right: 20px; width: 50px; height: 50px; border-radius: 50%; background-color: var(--color-bwg-main); box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12), 0 3px 1px -2px rgba(0, 0, 0, 0.2); } .sidebar .capture-btn:hover { transition: transform 0.2s ease-in-out; background-color: rgba(0, 114, 206, 0.8); transform: scale(1.1); } .sidebar .capture-btn > i { background: url(../img/ico-camera.svg) no-repeat center; display: inline-block; width: 22px; height: 22px; } .capture-modal { display: none; position: fixed; z-index: 1000; left: 0; top: 0; width: 100%; height: 100%; overflow: auto; background-color: rgba(0, 0, 0, 0.6); } .capture-modal .button-container { position: absolute; top: 20px; right: 25px; display: flex; align-items: center; color: var(--color-white); cursor: pointer; } .capture-modal .button-container .close { font-size: 40px; font-weight: bold; } .capture-modal .button-container .close:hover { transform: translateY(-3px); transition: 200ms ease; } .capture-modal .button-container > i { background: url(../img/ico-capture-download.svg) no-repeat center; display: inline-block; width: 20px; height: 20px; margin-right: 20px; } .capture-modal .button-container > i:hover { transform: translateY(-3px); transition: 200ms ease; } .capture-modal > img { width: 100%; height: 100%; position: fixed; top: 0; left: 0; opacity: 1; transform: scale(0.8); z-index: 99999; } .capture-modal-content { background-color: #fefefe; margin: 15% auto; padding: 20px; border: 1px solid #888; width: 80%; max-width: 500px; text-align: center; }