Jake Vanderwerf
10 days ago 97e7c319d656a5f05489ca996e249e7359303d4d
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
/*!************************************************************************************************************************************************************************************************************************************************!*\
  !*** 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*/