hrl-docs/styles.css at main · lucy-dwr/hrl-docs · GitHub

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
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
/* ===============================
   Global Layout & Typography
   =============================== */

/* Headings
   ------------------------------- */

/* Main page title */
main h1,
main .h1 {
  margin-top: 3rem;
  margin-bottom: 1.25rem;
}

/* Second-level headings */
main h2,
main .h2 {
  /* Top margin set more specifically below */
  margin-bottom: 1.15rem;
}

/* Third-level headings */
main h3,
main .h3 {
  margin-top: 2rem;
  margin-bottom: 0.75rem;
}

/* Ensure generous spacing before any H2 */
main .section > h2,
main h2 {
  margin-top: 3.5rem !important;
}

/* Sections
   ------------------------------- */

main section {
  /* Add a little more breathing room between sections overall */
  margin-bottom: 2.5rem;
}

/* Body text
   ------------------------------- */

/* Slightly reduce base body text size without altering headings/navigation */
main {
  font-size: 0.9rem;
}

main p {
  /* Slightly increase line height in body text for readability */
  line-height: 1.6;
}

/* Lists
   ------------------------------- */

/* Add breathing room before and after lists */
main ul,
main ol {
  margin-top: 0.75rem;
  margin-bottom: 1.5rem;
}

/* Optional: more space between paragraphs and following lists */
main p + ul,
main p + ol {
  margin-top: 1rem;
}

/* Bold ordered list markers when explicitly requested with a helper class */
.bold-ol ol > li::marker {
  font-weight: 700;
}

/* Optional: more space between headings and the list that follows */
main h2 + ul,
main h2 + ol,
main h3 + ul,
main h3 + ol {
  margin-top: 1.25rem;
}

/* Contextual spacing rules
   ------------------------------- */

/* Add extra space when a third-level heading follows text or a list */
main p + h3,
main ul + h3,
main ol + h3 {
  margin-top: 2.5rem;
}

/* Tighten spacing when a heading is immediately followed by a sub-section heading */
main section[class^="level"]
  > :is(h1, h2, h3, h4, h5)
  + section[class^="level"]
  > :is(h2, h3, h4, h5, h6) {
  margin-top: 1.5rem !important;
}

/* =========================================================
   Specific Overrides
   ========================================================= */

/* Increase vertical spacing between bullets (works even with Bootstrap/Quarto overrides) */
main ul li,
main ol li {
  margin-bottom: 0.5rem !important;
  line-height: 1.5 !important;
}

/* If list items contain <p>, ensure they also have spacing */
main ul li p,
main ol li p {
  margin-bottom: 0.5rem !important;
  line-height: 1.5 !important;
}

/* =========================================================
   Callouts
   ========================================================= */

/* Add a bit more vertical padding in the tip and note callout header banners */
.callout.callout-tip > .callout-header,
.callout.callout-note > .callout-header {
  padding-top: 0.7rem;
  padding-bottom: 0.4rem;
}

/* Remove extra gap under the last bullet in callouts
   (keep only the callout's own padding at the bottom) */
.callout .callout-body ul,
.callout .callout-body ol {
  margin-bottom: 0;
}

.callout .callout-body ul li:last-child,
.callout .callout-body ol li:last-child {
  margin-bottom: 0 !important;
}

/* Footer draft notice */
.footer-draft-note {
  color: #333333;
  font-style: italic;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
}

.nav-footer {
  align-items: center !important;
}