Jake Vanderwerf
2026-05-31 d7e7d248cbe41cd7a9ef9c2fb022b6c4831f99a3
build/glossary/style-index-rtl.css
@@ -1 +1,109 @@
:root{--navWidth:40vw}@media(min-width:768px){:root{--navWidth:22vw}}nav.glossary-index{height:60vh;position:fixed;left:-8px;top:50%;transform:translateY(-50%);width:var(--navWidth);z-index:var(--z-3)}nav.glossary-index>ul{--dir:column;--align:flex-start;--justify:flex-start;--gap:1px;height:100%;max-height:100%;overflow:hidden auto;scroll-behavior:smooth;touch-action:pan-y;width:100%}nav.glossary-index a,nav.glossary-index li{flex:1;height:-moz-max-content;height:max-content;min-height:max(var(--chipchip),-moz-max-content);min-height:max(var(--chipchip),max-content);width:100%}nav.glossary-index a{--justify:center;background-color:rgba(var(--base),var(--op-45));hyphens:auto;padding:.25rem .5rem;word-wrap:anywhere;white-space:wrap}nav.glossary-index a.active,nav.glossary-index a:focus,nav.glossary-index a:hover{background-color:rgba(var(--action-0),var(--op-6));color:var(--action-contrast)}.glossary dd{margin-right:.5rem;width:calc(100% + .75rem)}.glossary dd,.glossary dt{right:0;position:relative;transition:margin var(--trans-base),right var(--trans-base),width var(--trans-base)}.glossary dt.active,.glossary dt:target{color:rgb(var(--action-0));right:-1.5rem;outline:none;padding:0}.glossary dt.active+dd,.glossary dt:target+dd{right:-1.5rem}dl.glossary,main header{grid-column:full;padding:0 2rem 0 var(--navWidth)}@media(min-width:768px){dl.glossary,main header{margin-right:auto;margin-left:var(--navWidth);max-width:var(--content);padding-left:var(--btn)}}@media(max-width:768px){.glossary h2{font-size:var(--txt-medium)}.glossary p{font-size:var(--txt-x-small)}.glossary-index a,.glossary-index li{height:-moz-fit-content;height:fit-content}.glossary-index a{font-size:var(--txt-x-small);min-height:2em;padding:.25rem}body:has(.glossary) h1{font-size:var(--txt-xx-large)}}
/*!************************************************************************************************************************************************************************************************************************************************!*\
  !*** 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);
  left: -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-right: 0.5rem;
  width: calc(100% + 0.75rem);
}
.glossary dd,
.glossary dt {
  position: relative;
  right: 0;
  transition: margin var(--trans-base), right var(--trans-base), width var(--trans-base);
}
.glossary dt:target,
.glossary dt.active {
  outline: none;
  right: -1.5rem;
  padding: 0;
  color: rgb(var(--action-0));
}
.glossary dt:target + dd,
.glossary dt.active + dd {
  right: -1.5rem;
}
main header,
dl.glossary {
  grid-column: full;
  padding: 0 2rem 0 var(--navWidth);
}
@media (min-width: 768px) {
  main header,
  dl.glossary {
    margin-right: auto;
    max-width: var(--content);
    margin-left: var(--navWidth);
    padding-left: 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);
  }
}