/*!************************************************************************************************************************************************************************************************************************************************!*\ !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[4].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[4].use[2]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[4].use[3]!./src/glossary/style.scss ***! \************************************************************************************************************************************************************************************************************************************************/ :root { --navWidth: 40vw; } @media (min-width: 768px) { :root { --navWidth: 22vw; } } nav.glossary-index { position: fixed; top: 50%; transform: translateY(-50%); width: var(--navWidth); right: -8px; height: 60vh; z-index: var(--z-3); } nav.glossary-index > ul { --dir: column; --align: flex-start; --justify: flex-start; --gap: 1px; touch-action: pan-y; max-height: 100%; height: 100%; width: 100%; overflow: hidden auto; scroll-behavior: smooth; } nav.glossary-index li, nav.glossary-index a { flex: 1; width: 100%; height: -moz-max-content; height: max-content; min-height: max(var(--chipchip), -moz-max-content); min-height: max(var(--chipchip), max-content); } nav.glossary-index a { --justify: center; padding: 0.25rem 0.5rem; hyphens: auto; background-color: rgba(var(--base), var(--op-45)); word-wrap: anywhere; white-space: wrap; } nav.glossary-index a:hover, nav.glossary-index a:focus, nav.glossary-index a.active { background-color: rgba(var(--action-0), var(--op-6)); color: var(--action-contrast); } .glossary dd { margin-left: 0.5rem; width: calc(100% + 0.75rem); } .glossary dd, .glossary dt { position: relative; left: 0; transition: margin var(--trans-base), left var(--trans-base), width var(--trans-base); } .glossary dt:target, .glossary dt.active { outline: none; left: -1.5rem; padding: 0; color: rgb(var(--action-0)); } .glossary dt:target + dd, .glossary dt.active + dd { left: -1.5rem; } main header, dl.glossary { grid-column: full; padding: 0 var(--navWidth) 0 2rem; } @media (min-width: 768px) { main header, dl.glossary { margin-left: auto; max-width: var(--content); margin-right: var(--navWidth); padding-right: var(--btn); } } @media (max-width: 768px) { .glossary h2 { font-size: var(--txt-medium); } .glossary p { font-size: var(--txt-x-small); } .glossary-index li, .glossary-index a { height: -moz-fit-content; height: fit-content; } .glossary-index a { font-size: var(--txt-x-small); padding: 0.25rem; min-height: 2em; } body:has(.glossary) h1 { font-size: var(--txt-xx-large); } } /*# sourceMappingURL=style-index.css.map*/