| ... | @@ -5,490 +5,443 @@ | ... | @@ -5,490 +5,443 @@ |
| 5 | <title>Documentation - Zig</title> | 5 | <title>Documentation - Zig</title> |
| 6 | <link rel="icon" href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAgklEQVR4AWMYWuD7EllJIM4G4g4g5oIJ/odhOJ8wToOxSTXgNxDHoeiBMfA4+wGShjyYOCkG/IGqWQziEzYAoUAeiF9D5U+DxEg14DRU7jWIT5IBIOdCxf+A+CQZAAoopEB7QJwBCBwHiip8UYmRdrAlDpIMgApwQZNnNii5Dq0MBgCxxycBnwEd+wAAAABJRU5ErkJggg=="> | 6 | <link rel="icon" href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAgklEQVR4AWMYWuD7EllJIM4G4g4g5oIJ/odhOJ8wToOxSTXgNxDHoeiBMfA4+wGShjyYOCkG/IGqWQziEzYAoUAeiF9D5U+DxEg14DRU7jWIT5IBIOdCxf+A+CQZAAoopEB7QJwBCBwHiip8UYmRdrAlDpIMgApwQZNnNii5Dq0MBgCxxycBnwEd+wAAAABJRU5ErkJggg=="> |
| 7 | <style type="text/css"> | 7 | <style type="text/css"> |
| 8 | .old body { | 8 | :root { |
| 9 | font-family: system-ui, -apple-system, Roboto, "Segoe UI", sans-serif; | 9 | font-size: 1em; |
| 10 | max-width: 60em; | 10 | --ui: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji"; |
| | 11 | --mono: "Source Code Pro", monospace; |
| | 12 | --tx-color: #141414; |
| | 13 | --bg-color: #ffffff; |
| | 14 | --link-color: #2A6286; |
| | 15 | --sidebar-sh-color: rgba(0, 0, 0, 0.09); |
| | 16 | --search-bg-color: #f3f3f3; |
| | 17 | --search-bg-color-focus: #ffffff; |
| | 18 | --search-sh-color: rgba(0, 0, 0, 0.18); |
| | 19 | --help-sh-color: rgba(0, 0, 0, 0.75); |
| | 20 | } |
| | 21 | |
| | 22 | a { |
| | 23 | text-decoration: none; |
| 11 | } | 24 | } |
| 12 | .old .hidden { | 25 | |
| | 26 | a:hover { |
| | 27 | text-decoration: underline; |
| | 28 | } |
| | 29 | |
| | 30 | .hidden { |
| 13 | display: none; | 31 | display: none; |
| 14 | } | 32 | } |
| 15 | .old a { | 33 | |
| 16 | color: #2A6286; | 34 | /* layout */ |
| | 35 | .canvas { |
| | 36 | width: 100vw; |
| | 37 | height: 100vh; |
| | 38 | overflow: hidden; |
| | 39 | margin: 0; |
| | 40 | padding: 0; |
| | 41 | font-family: var(--ui); |
| | 42 | color: var(--tx-color); |
| | 43 | background-color: var(--bg-color); |
| 17 | } | 44 | } |
| 18 | .old pre{ | 45 | |
| 19 | font-family:"Source Code Pro",monospace; | 46 | .flex-main { |
| 20 | font-size:1em; | 47 | display: flex; |
| 21 | background-color:#F5F5F5; | 48 | width: 100%; |
| 22 | padding:1em; | 49 | height: 100%; |
| 23 | overflow-x: auto; | 50 | justify-content: center; |
| | 51 | |
| | 52 | z-index: 100; |
| 24 | } | 53 | } |
| 25 | .old code { | 54 | |
| 26 | font-family:"Source Code Pro",monospace; | 55 | .flex-filler { |
| 27 | font-size:1em; | 56 | flex-grow: 1; |
| | 57 | flex-shrink: 1; |
| 28 | } | 58 | } |
| 29 | .old nav { | 59 | |
| 30 | width: 10em; | 60 | .flex-left { |
| 31 | position: fixed; | 61 | width: 12rem; |
| 32 | left: 0; | 62 | max-width: 15vw; |
| 33 | top: 0; | 63 | min-width: 9.5rem; |
| 34 | height: 100vh; | | |
| 35 | overflow: auto; | 64 | overflow: auto; |
| | 65 | overflow-wrap: break-word; |
| | 66 | flex-shrink: 0; |
| | 67 | flex-grow: 0; |
| | 68 | |
| | 69 | z-index: 300; |
| 36 | } | 70 | } |
| 37 | .old nav h2 { | 71 | |
| 38 | font-size: 1.2em; | 72 | .flex-right { |
| 39 | text-decoration: underline; | 73 | display: flex; |
| 40 | margin: 0; | 74 | overflow: auto; |
| 41 | padding: 0.5em 0; | 75 | flex-grow: 1; |
| 42 | text-align: center; | 76 | flex-shrink: 1; |
| | 77 | |
| | 78 | z-index: 200; |
| | 79 | } |
| | 80 | |
| | 81 | .flex-right > .wrap { |
| | 82 | width: 60rem; |
| | 83 | max-width: 85vw; |
| | 84 | flex-shrink: 1; |
| | 85 | } |
| | 86 | |
| | 87 | .help-modal { |
| | 88 | z-index: 400; |
| | 89 | } |
| | 90 | |
| | 91 | /* sidebar */ |
| | 92 | .sidebar { |
| | 93 | font-size: 1rem; |
| | 94 | background-color: var(--bg-color); |
| | 95 | box-shadow: 0 0 1rem var(--sidebar-sh-color); |
| | 96 | } |
| | 97 | |
| | 98 | .sidebar .logo { |
| | 99 | padding: 0.35rem 0.35rem; |
| 43 | } | 100 | } |
| 44 | .old nav p { | 101 | |
| | 102 | .sidebar .logo > img { |
| | 103 | width: 100%; |
| | 104 | } |
| | 105 | |
| | 106 | .sidebar h2 { |
| | 107 | margin: 0.5rem; |
| | 108 | padding: 0; |
| | 109 | font-size: 1.2rem; |
| | 110 | } |
| | 111 | |
| | 112 | .sidebar h2 > span { |
| | 113 | border-bottom: 0.125rem dotted var(--tx-color); |
| | 114 | } |
| | 115 | |
| | 116 | .sidebar .packages { |
| | 117 | list-style-type: none; |
| 45 | margin: 0; | 118 | margin: 0; |
| 46 | padding: 0; | 119 | padding: 0; |
| 47 | text-align: center; | 120 | background-color: #f1f1f1; |
| 48 | } | 121 | } |
| 49 | .old section { | 122 | |
| 50 | margin-left: 10em; | 123 | .sidebar .packages > li > a { |
| | 124 | display: block; |
| | 125 | padding: 0.5rem 1rem; |
| | 126 | color: var(--tx-color); |
| | 127 | text-decoration: none; |
| 51 | } | 128 | } |
| 52 | .old section h1 { | 129 | |
| | 130 | .sidebar .packages > li > a:hover { |
| | 131 | color: #fff; |
| | 132 | background-color: #555; |
| | 133 | } |
| | 134 | |
| | 135 | .sidebar .packages > li > a.active { |
| | 136 | color: #000; |
| | 137 | background-color: #FFBB4D; |
| | 138 | } |
| | 139 | |
| | 140 | .sidebar p.str { |
| | 141 | margin: 0.5rem; |
| | 142 | font-family: var(--mono); |
| | 143 | } |
| | 144 | |
| | 145 | /* docs section */ |
| | 146 | .docs { |
| | 147 | padding: 0.7rem 0.7rem 2.4rem 1.4rem; |
| | 148 | font-size: 1rem; |
| | 149 | background-color: var(--bg-color); |
| | 150 | overflow-wrap: break-word; |
| | 151 | } |
| | 152 | |
| | 153 | .docs .search { |
| | 154 | width: 100%; |
| | 155 | padding: 0.5rem; |
| | 156 | font-size: 1rem; |
| | 157 | font-family: var(--ui); |
| | 158 | color: var(--tx-color); |
| | 159 | background-color: var(--search-bg-color); |
| | 160 | border-top: 0; |
| | 161 | border-left: 0; |
| | 162 | border-right: 0; |
| | 163 | border-bottom-width: 0.125rem; |
| | 164 | border-bottom-style: solid; |
| | 165 | border-bottom-color: var(--tx-color); |
| | 166 | outline: none; |
| | 167 | transition: border-bottom-color 0.35s, background 0.35s, box-shadow 0.35s; |
| | 168 | } |
| | 169 | |
| | 170 | .docs .search:focus { |
| | 171 | background-color: var(--search-bg-color-focus); |
| | 172 | border-bottom-color: #ffbb4d; |
| | 173 | box-shadow: 0 0.3em 1em 0.125em var(--search-sh-color); |
| | 174 | } |
| | 175 | |
| | 176 | .docs .search::placeholder { |
| | 177 | font-size: 1rem; |
| | 178 | font-family: var(--ui); |
| | 179 | color: var(--tx-color); |
| | 180 | opacity: 0.5; |
| | 181 | } |
| | 182 | |
| | 183 | .docs a { |
| | 184 | color: var(--link-color); |
| | 185 | } |
| | 186 | |
| | 187 | .docs pre { |
| | 188 | font-family: var(--mono); |
| | 189 | font-size:1em; |
| | 190 | background-color:#F5F5F5; |
| | 191 | padding:1em; |
| | 192 | overflow-x: auto; |
| | 193 | } |
| | 194 | |
| | 195 | .docs code { |
| | 196 | font-family: var(--mono); |
| | 197 | font-size:1em; |
| | 198 | } |
| | 199 | |
| | 200 | .docs h1 { |
| 53 | border-bottom: 1px dashed; | 201 | border-bottom: 1px dashed; |
| 54 | } | 202 | } |
| 55 | .old section h2 { | 203 | |
| | 204 | .docs h2 { |
| 56 | font-size: 1.3em; | 205 | font-size: 1.3em; |
| 57 | margin: 0.5em 0; | 206 | margin: 0.5em 0; |
| 58 | padding: 0; | 207 | padding: 0; |
| 59 | border-bottom: 1px solid; | 208 | border-bottom: 1px solid; |
| 60 | } | 209 | } |
| 61 | .old #listNav { | 210 | #listNav { |
| 62 | list-style-type: none; | 211 | list-style-type: none; |
| 63 | margin: 0.5em 0 0 0; | 212 | margin: 0.5em 0 0 0; |
| 64 | padding: 0; | 213 | padding: 0; |
| 65 | overflow: hidden; | 214 | overflow: hidden; |
| 66 | background-color: #f1f1f1; | 215 | background-color: #f1f1f1; |
| 67 | } | 216 | } |
| 68 | .old #listNav li { | 217 | #listNav li { |
| 69 | float:left; | 218 | float:left; |
| 70 | } | 219 | } |
| 71 | .old #listNav li a { | 220 | #listNav li a { |
| 72 | display: block; | 221 | display: block; |
| 73 | color: #000; | 222 | color: #000; |
| 74 | text-align: center; | 223 | text-align: center; |
| 75 | padding: .5em .8em; | 224 | padding: .5em .8em; |
| 76 | text-decoration: none; | 225 | text-decoration: none; |
| 77 | } | 226 | } |
| 78 | .old #listNav li a:hover { | 227 | #listNav li a:hover { |
| 79 | background-color: #555; | 228 | background-color: #555; |
| 80 | color: #fff; | 229 | color: #fff; |
| 81 | } | 230 | } |
| 82 | .old #listNav li a.active { | 231 | #listNav li a.active { |
| 83 | background-color: #FFBB4D; | 232 | background-color: #FFBB4D; |
| 84 | color: #000; | 233 | color: #000; |
| 85 | } | 234 | } |
| 86 | | 235 | |
| 87 | .old #listPkgs { | 236 | #listSearchResults li.selected { |
| 88 | list-style-type: none; | 237 | background-color: #93e196; |
| 89 | margin: 0; | | |
| 90 | padding: 0; | | |
| 91 | background-color: #f1f1f1; | | |
| 92 | } | | |
| 93 | .old #listPkgs li a { | | |
| 94 | display: block; | | |
| 95 | color: #000; | | |
| 96 | padding: 0.5em 1em; | | |
| 97 | text-decoration: none; | | |
| 98 | } | | |
| 99 | .old #listPkgs li a:hover { | | |
| 100 | background-color: #555; | | |
| 101 | color: #fff; | | |
| 102 | } | | |
| 103 | .old #listPkgs li a.active { | | |
| 104 | background-color: #FFBB4D; | | |
| 105 | color: #000; | | |
| 106 | } | | |
| 107 | .old #logo { | | |
| 108 | width: 8em; | | |
| 109 | padding: 0.5em 1em; | | |
| 110 | } | 238 | } |
| 111 | | 239 | |
| 112 | .old #search { | 240 | #tableFnErrors dt { |
| 113 | width: 100%; | 241 | font-weight: bold; |
| 114 | } | 242 | } |
| 115 | | 243 | |
| 116 | .old #helpDialog { | 244 | .docs td { |
| 117 | width: 21em; | 245 | vertical-align: top; |
| 118 | height: 19em; | 246 | margin: 0; |
| | 247 | padding: 0.5em; |
| | 248 | max-width: 20em; |
| | 249 | text-overflow: ellipsis; |
| | 250 | overflow-x: hidden; |
| | 251 | } |
| | 252 | |
| | 253 | /* help dialog */ |
| | 254 | .help-modal { |
| | 255 | display: flex; |
| | 256 | width: 100%; |
| | 257 | height: 100%; |
| 119 | position: fixed; | 258 | position: fixed; |
| 120 | top: 0; | 259 | top: 0; |
| 121 | left: 0; | 260 | left: 0; |
| 122 | background-color: #333; | 261 | justify-content: center; |
| | 262 | align-items: center; |
| | 263 | background-color: rgba(0, 0, 0, 0.15); |
| | 264 | backdrop-filter: blur(0.3em); |
| | 265 | } |
| | 266 | |
| | 267 | .help-modal > .dialog { |
| | 268 | max-width: 97vw; |
| | 269 | max-height: 97vh; |
| | 270 | overflow: auto; |
| | 271 | font-size: 1rem; |
| 123 | color: #fff; | 272 | color: #fff; |
| 124 | border: 1px solid #fff; | 273 | background-color: #333; |
| | 274 | border: 0.125rem solid #000; |
| | 275 | box-shadow: 0 0.5rem 2.5rem 0.3rem var(--help-sh-color); |
| 125 | } | 276 | } |
| 126 | .old #helpDialog h1 { | 277 | |
| 127 | text-align: center; | 278 | .help-modal h1 { |
| | 279 | margin: 0.75em 2.5em 1em 2.5em; |
| 128 | font-size: 1.5em; | 280 | font-size: 1.5em; |
| | 281 | text-align: center; |
| 129 | } | 282 | } |
| 130 | .old #helpDialog dt, #helpDialog dd { | 283 | |
| | 284 | .help-modal dt, .help-modal dd { |
| 131 | display: inline; | 285 | display: inline; |
| 132 | margin: 0 0.2em; | 286 | margin: 0 0.2em; |
| 133 | } | 287 | } |
| 134 | .old kbd { | 288 | |
| | 289 | .help-modal dl { |
| | 290 | margin-left: 0.5em; |
| | 291 | margin-right: 0.5em; |
| | 292 | } |
| | 293 | |
| | 294 | .help-modal kbd { |
| | 295 | display: inline-block; |
| | 296 | padding: 0.3em 0.2em; |
| | 297 | font-size: 1.2em; |
| | 298 | font-size: var(--mono); |
| | 299 | line-height: 0.8em; |
| | 300 | vertical-align: middle; |
| 135 | color: #000; | 301 | color: #000; |
| 136 | background-color: #fafbfc; | 302 | background-color: #fafbfc; |
| 137 | border-color: #d1d5da; | 303 | border-color: #d1d5da; |
| 138 | border-bottom-color: #c6cbd1; | 304 | border-bottom-color: #c6cbd1; |
| | 305 | border: solid 0.0625em; |
| | 306 | border-radius: 0.1875em; |
| 139 | box-shadow-color: #c6cbd1; | 307 | box-shadow-color: #c6cbd1; |
| 140 | display: inline-block; | 308 | box-shadow: inset 0 -0.0625em 0; |
| 141 | padding: 0.3em 0.2em; | | |
| 142 | font: 1.2em monospace; | | |
| 143 | line-height: 0.8em; | | |
| 144 | vertical-align: middle; | | |
| 145 | border: solid 1px; | | |
| 146 | border-radius: 3px; | | |
| 147 | box-shadow: inset 0 -1px 0; | | |
| 148 | cursor: default; | 309 | cursor: default; |
| 149 | } | 310 | } |
| 150 | | 311 | |
| 151 | .old #listSearchResults li.selected { | 312 | /* tokens */ |
| 152 | background-color: #93e196; | 313 | .tok-kw { |
| 153 | } | | |
| 154 | | | |
| 155 | .old #tableFnErrors dt { | | |
| 156 | font-weight: bold; | | |
| 157 | } | | |
| 158 | | | |
| 159 | .old td { | | |
| 160 | vertical-align: top; | | |
| 161 | margin: 0; | | |
| 162 | padding: 0.5em; | | |
| 163 | max-width: 20em; | | |
| 164 | text-overflow: ellipsis; | | |
| 165 | overflow-x: hidden; | | |
| 166 | } | | |
| 167 | | | |
| 168 | .old .tok-kw { | | |
| 169 | color: #333; | 314 | color: #333; |
| 170 | font-weight: bold; | 315 | font-weight: bold; |
| 171 | } | 316 | } |
| 172 | .old .tok-str { | 317 | .tok-str { |
| 173 | color: #d14; | 318 | color: #d14; |
| 174 | } | 319 | } |
| 175 | .old .tok-builtin { | 320 | .tok-builtin { |
| 176 | color: #0086b3; | 321 | color: #0086b3; |
| 177 | } | 322 | } |
| 178 | .old .tok-comment { | 323 | .tok-comment { |
| 179 | color: #777; | 324 | color: #777; |
| 180 | font-style: italic; | 325 | font-style: italic; |
| 181 | } | 326 | } |
| 182 | .old .tok-fn { | 327 | .tok-fn { |
| 183 | color: #900; | 328 | color: #900; |
| 184 | font-weight: bold; | 329 | font-weight: bold; |
| 185 | } | 330 | } |
| 186 | .old .tok-null { | 331 | .tok-null { |
| 187 | color: #008080; | 332 | color: #008080; |
| 188 | } | 333 | } |
| 189 | .old .tok-number { | 334 | .tok-number { |
| 190 | color: #008080; | 335 | color: #008080; |
| 191 | } | 336 | } |
| 192 | .old .tok-type { | 337 | .tok-type { |
| 193 | color: #458; | 338 | color: #458; |
| 194 | font-weight: bold; | 339 | font-weight: bold; |
| 195 | } | 340 | } |
| 196 | | 341 | |
| | 342 | /* dark mode */ |
| 197 | @media (prefers-color-scheme: dark) { | 343 | @media (prefers-color-scheme: dark) { |
| 198 | .old body{ | 344 | |
| 199 | background-color: #111; | 345 | :root { |
| 200 | color: #bbb; | 346 | --tx-color: #bbb; |
| 201 | } | 347 | --bg-color: #111; |
| 202 | .old a { | 348 | --link-color: #88f; |
| 203 | color: #88f; | 349 | --sidebar-sh-color: rgba(128, 128, 128, 0.09); |
| | 350 | --search-bg-color: #3c3c3c; |
| | 351 | --search-bg-color-focus: #000; |
| | 352 | --search-sh-color: rgba(255, 255, 255, 0.28); |
| | 353 | --help-sh-color: rgba(142, 142, 142, 0.5); |
| 204 | } | 354 | } |
| 205 | .old pre{ | 355 | |
| | 356 | .docs pre { |
| 206 | background-color:#2A2A2A; | 357 | background-color:#2A2A2A; |
| 207 | } | 358 | } |
| 208 | .old #listNav { | 359 | #listNav { |
| 209 | background-color: #333; | 360 | background-color: #333; |
| 210 | } | 361 | } |
| 211 | .old #listNav li a { | 362 | #listNav li a { |
| 212 | color: #fff; | 363 | color: #fff; |
| 213 | } | 364 | } |
| 214 | .old #listNav li a:hover { | 365 | #listNav li a:hover { |
| 215 | background-color: #555; | 366 | background-color: #555; |
| 216 | color: #fff; | 367 | color: #fff; |
| 217 | } | 368 | } |
| 218 | .old #listNav li a.active { | 369 | #listNav li a.active { |
| 219 | background-color: #FFBB4D; | 370 | background-color: #FFBB4D; |
| 220 | color: #000; | 371 | color: #000; |
| 221 | } | 372 | } |
| 222 | .old #listPkgs { | 373 | #listPkgs { |
| 223 | background-color: #333; | 374 | background-color: #333; |
| 224 | } | 375 | } |
| 225 | .old #listPkgs li a { | 376 | #listPkgs li a { |
| 226 | color: #fff; | 377 | color: #fff; |
| 227 | } | 378 | } |
| 228 | .old #listPkgs li a:hover { | 379 | #listPkgs li a:hover { |
| 229 | background-color: #555; | 380 | background-color: #555; |
| 230 | color: #fff; | 381 | color: #fff; |
| 231 | } | 382 | } |
| 232 | .old #listPkgs li a.active { | 383 | #listPkgs li a.active { |
| 233 | background-color: #FFBB4D; | 384 | background-color: #FFBB4D; |
| 234 | color: #000; | 385 | color: #000; |
| 235 | } | 386 | } |
| 236 | .old #listSearchResults li.selected { | 387 | #listSearchResults li.selected { |
| 237 | background-color: #000; | 388 | background-color: #000; |
| 238 | } | 389 | } |
| 239 | .old #listSearchResults li.selected a { | 390 | #listSearchResults li.selected a { |
| 240 | color: #fff; | 391 | color: #fff; |
| 241 | } | 392 | } |
| 242 | .old .tok-kw { | 393 | .tok-kw { |
| 243 | color: #eee; | 394 | color: #eee; |
| 244 | } | 395 | } |
| 245 | .old .tok-str { | 396 | .tok-str { |
| 246 | color: #2e5; | 397 | color: #2e5; |
| 247 | } | 398 | } |
| 248 | .old .tok-builtin { | 399 | .tok-builtin { |
| 249 | color: #ff894c; | 400 | color: #ff894c; |
| 250 | } | 401 | } |
| 251 | .old .tok-comment { | 402 | .tok-comment { |
| 252 | color: #aa7; | 403 | color: #aa7; |
| 253 | } | 404 | } |
| 254 | .old .tok-fn { | 405 | .tok-fn { |
| 255 | color: #e33; | 406 | color: #e33; |
| 256 | } | 407 | } |
| 257 | .old .tok-null { | 408 | .tok-null { |
| 258 | color: #ff8080; | 409 | color: #ff8080; |
| 259 | } | 410 | } |
| 260 | .old .tok-number { | 411 | .tok-number { |
| 261 | color: #ff8080; | 412 | color: #ff8080; |
| 262 | } | 413 | } |
| 263 | .old .tok-type { | 414 | .tok-type { |
| 264 | color: #68f; | 415 | color: #68f; |
| 265 | } | 416 | } |
| 266 | } | | |
| 267 | | | |
| 268 | /* ------- */ | | |
| 269 | .hidden { | | |
| 270 | display: none; | | |
| 271 | } | | |
| 272 | | | |
| 273 | .font-normal { | | |
| 274 | font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji"; | | |
| 275 | } | | |
| 276 | | | |
| 277 | .font-mono { | | |
| 278 | font-family: "Source Code Pro", monospace; | | |
| 279 | } | | |
| 280 | | | |
| 281 | .canvas { | | |
| 282 | margin: 0; | | |
| 283 | padding: 0; | | |
| 284 | width: 100vw; | | |
| 285 | height: 100vh; | | |
| 286 | overflow: hidden; | | |
| 287 | /*background-color: #fff4ef;*/ | | |
| 288 | /*background-color: #f7f7f7;*/ | | |
| 289 | } | | |
| 290 | | | |
| 291 | .help-flex { | | |
| 292 | position: fixed; | | |
| 293 | top: 0; | | |
| 294 | left: 0; | | |
| 295 | width: 100%; | | |
| 296 | height: 100%; | | |
| 297 | display: flex; | | |
| 298 | justify-content: center; | | |
| 299 | align-items: center; | | |
| 300 | background-color: rgba(0, 0, 0, 0.15); | | |
| 301 | | | |
| 302 | z-index: 400; | | |
| 303 | } | | |
| 304 | | | |
| 305 | .help-modal { | | |
| 306 | max-width: 97vw; | | |
| 307 | max-height: 97vh; | | |
| 308 | background-color: #333; | | |
| 309 | color: #fff; | | |
| 310 | border: 0.125em solid #000; | | |
| 311 | box-shadow: 0 0.5em 2.5em 0.3em rgba(0, 0, 0, 0.75); | | |
| 312 | overflow: auto; | | |
| 313 | } | | |
| 314 | | | |
| 315 | .help-modal h1 { | | |
| 316 | text-align: center; | | |
| 317 | font-size: 1.5em; | | |
| 318 | margin: 0.75em 2.5em 1em 2.5em; | | |
| 319 | } | | |
| 320 | | | |
| 321 | dt, dd { | | |
| 322 | display: inline; | | |
| 323 | margin: 0 0.2em; | | |
| 324 | } | | |
| 325 | | | |
| 326 | dl { | | |
| 327 | margin-left: 0.5em; | | |
| 328 | margin-right: 0.5em; | | |
| 329 | } | | |
| 330 | | | |
| 331 | kbd { | | |
| 332 | color: #000; | | |
| 333 | background-color: #fafbfc; | | |
| 334 | border-color: #d1d5da; | | |
| 335 | border-bottom-color: #c6cbd1; | | |
| 336 | box-shadow-color: #c6cbd1; | | |
| 337 | display: inline-block; | | |
| 338 | padding: 0.3em 0.2em; | | |
| 339 | font: 1.2em monospace; | | |
| 340 | line-height: 0.8em; | | |
| 341 | vertical-align: middle; | | |
| 342 | border: solid 1px; | | |
| 343 | border-radius: 3px; | | |
| 344 | box-shadow: inset 0 -1px 0; | | |
| 345 | cursor: default; | | |
| 346 | } | | |
| 347 | | | |
| 348 | .main-flex { | | |
| 349 | width: 100%; | | |
| 350 | height: 100%; | | |
| 351 | display: flex; | | |
| 352 | justify-content: center; | | |
| 353 | | | |
| 354 | z-index: 100; | | |
| 355 | } | | |
| 356 | | | |
| 357 | .flex-filler { | | |
| 358 | flex-grow: 1; | | |
| 359 | flex-shrink: 1; | | |
| 360 | } | | |
| 361 | | | |
| 362 | .nav { | | |
| 363 | width: 12em; | | |
| 364 | overflow: auto; | | |
| 365 | max-width: 15vw; | | |
| 366 | min-width: 9.5em; | | |
| 367 | flex-shrink: 0; | | |
| 368 | flex-grow: 0; | | |
| 369 | background: #fff; | | |
| 370 | box-shadow: 0 0 1em rgba(0, 0, 0, 0.09); | | |
| 371 | overflow-wrap: break-word; | | |
| 372 | | 417 | |
| 373 | z-index: 300; | | |
| 374 | } | | |
| 375 | | | |
| 376 | nav h2 { | | |
| 377 | font-size: 1.2em; | | |
| 378 | margin: 0.5em; | | |
| 379 | padding: 0; | | |
| 380 | } | | |
| 381 | | | |
| 382 | nav h2 > span { | | |
| 383 | border-bottom: 0.125em dotted #000; | | |
| 384 | } | | |
| 385 | | | |
| 386 | nav p { | | |
| 387 | margin: 0.5em; | | |
| 388 | } | 418 | } |
| 389 | | | |
| 390 | .logo-wrap { | | |
| 391 | padding: 0.35em 0.35em; | | |
| 392 | } | | |
| 393 | | | |
| 394 | .logo { | | |
| 395 | width: 100%; | | |
| 396 | } | | |
| 397 | | | |
| 398 | .right-flex { | | |
| 399 | display: flex; | | |
| 400 | overflow: auto; | | |
| 401 | flex-grow: 1; | | |
| 402 | flex-shrink: 1; | | |
| 403 | | | |
| 404 | z-index: 200; | | |
| 405 | } | | |
| 406 | | | |
| 407 | .right-wrap { | | |
| 408 | width: 60em; | | |
| 409 | max-width: 85vw; | | |
| 410 | flex-shrink: 1; | | |
| 411 | } | | |
| 412 | | | |
| 413 | .section-docs { | | |
| 414 | padding: 0.7em 0.7em 2.4em 1.4em; | | |
| 415 | background: #fff; | | |
| 416 | overflow-wrap: break-word; | | |
| 417 | } | | |
| 418 | | | |
| 419 | .search { | | |
| 420 | width: 100%; | | |
| 421 | padding: 0.5em; | | |
| 422 | font-size: 1em; | | |
| 423 | background: #f3f3f3; | | |
| 424 | border-top: 0; | | |
| 425 | border-left: 0; | | |
| 426 | border-right: 0; | | |
| 427 | border-bottom-width: 0.125em; | | |
| 428 | border-bottom-style: solid; | | |
| 429 | border-bottom-color: #000; | | |
| 430 | outline: none; | | |
| 431 | transition: border-bottom-color 0.35s, background 0.35s, box-shadow 0.35s; | | |
| 432 | } | | |
| 433 | | | |
| 434 | .search:focus { | | |
| 435 | border-bottom-color: #ffbb4d; | | |
| 436 | background: white; | | |
| 437 | box-shadow: 0 0.3em 1em 0.125em rgba(0, 0, 0, 0.18); | | |
| 438 | } | | |
| 439 | | | |
| 440 | .search::placeholder { | | |
| 441 | color: #000; | | |
| 442 | opacity: 0.5; | | |
| 443 | } | | |
| 444 | | | |
| 445 | /*section.section-docs h1 { | | |
| 446 | text-decoration: none; | | |
| 447 | border-bottom: 0.125em dashed #717171; | | |
| 448 | display: inline-block; | | |
| 449 | font-size: 1.35em; | | |
| 450 | max-width: 100%; | | |
| 451 | margin: 0.8em 0; | | |
| 452 | } | | |
| 453 | | | |
| 454 | section.section-docs h2 { | | |
| 455 | font-size: 1.2em; | | |
| 456 | margin: 0.5em 0; | | |
| 457 | padding: 0; | | |
| 458 | text-decoration: none; | | |
| 459 | border-bottom: 0.125em solid #717171; | | |
| 460 | display: inline-block; | | |
| 461 | max-width: 100%; | | |
| 462 | } | | |
| 463 | | | |
| 464 | table { | | |
| 465 | border: 1px solid red; | | |
| 466 | }*/ | | |
| 467 | </style> | 419 | </style> |
| 468 | </head> | 420 | </head> |
| 469 | <body class="canvas font-normal"> | 421 | <body class="canvas"> |
| 470 | <div class="main-flex"> | 422 | <div class="flex-main"> |
| 471 | <div class="flex-filler"></div> | 423 | <div class="flex-filler"></div> |
| 472 | <nav class="nav"> | 424 | <div class="flex-left sidebar"> |
| 473 | <div class="logo-wrap"> | 425 | <nav> |
| 474 | <img alt="ZIG" class="logo" id="logo" src="data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAxNTAgMTAwIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjxnIGZpbGw9IiNmN2E0MWQiPjxwYXRoIGQ9Im0wIDEwdjgwaDE5bDYtMTAgMTItMTBoLTE3di00MGgxNXYtMjB6bTQwIDB2MjBoNjJ2LTIwem05MSAwLTYgMTAtMTIgMTBoMTd2NDBoLTE1djIwaDM1di04MHptLTgzIDYwdjIwaDYydi0yMHoiIHNoYXBlLXJlbmRlcmluZz0iY3Jpc3BFZGdlcyIvPjxwYXRoIGQ9Im0zNyA3MC0xOCAyMHYtMTV6Ii8+PHBhdGggZD0ibTExMyAzMCAxOC0yMHYxNXoiLz48cGF0aCBkPSJtOTYuOTggMTAuNjMgMzYuMjgtMTAuNC04MC4yOSA4OS4xNy0zNi4yOCAxMC40eiIvPjwvZz48L3N2Zz4K"></img> | 426 | <div class="logo"> |
| 475 | </div> | 427 | <img alt="ZIG" id="logo" src="data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAxNTAgMTAwIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjxnIGZpbGw9IiNmN2E0MWQiPjxwYXRoIGQ9Im0wIDEwdjgwaDE5bDYtMTAgMTItMTBoLTE3di00MGgxNXYtMjB6bTQwIDB2MjBoNjJ2LTIwem05MSAwLTYgMTAtMTIgMTBoMTd2NDBoLTE1djIwaDM1di04MHptLTgzIDYwdjIwaDYydi0yMHoiIHNoYXBlLXJlbmRlcmluZz0iY3Jpc3BFZGdlcyIvPjxwYXRoIGQ9Im0zNyA3MC0xOCAyMHYtMTV6Ii8+PHBhdGggZD0ibTExMyAzMCAxOC0yMHYxNXoiLz48cGF0aCBkPSJtOTYuOTggMTAuNjMgMzYuMjgtMTAuNC04MC4yOSA4OS4xNy0zNi4yOCAxMC40eiIvPjwvZz48L3N2Zz4K"></img> |
| 476 | <div id="sectPkgs" class="old hidden"> | 428 | </div> |
| 477 | <h2><span>Packages</span></h2> | 429 | <div id="sectPkgs" class="hidden"> |
| 478 | <ul id="listPkgs"> | 430 | <h2><span>Packages</span></h2> |
| 479 | </ul> | 431 | <ul id="listPkgs" class="packages"></ul> |
| 480 | </div> | 432 | </div> |
| 481 | <div id="sectInfo" class="hidden"> | 433 | <div id="sectInfo" class="hidden"> |
| 482 | <h2><span>Zig Version</span></h2> | 434 | <h2><span>Zig Version</span></h2> |
| 483 | <p class="font-mono" id="tdZigVer"></p> | 435 | <p class="str" id="tdZigVer"></p> |
| 484 | <h2><span>Target</span></h2> | 436 | <h2><span>Target</span></h2> |
| 485 | <p class="font-mono" id="tdTarget"></p> | 437 | <p class="str" id="tdTarget"></p> |
| 486 | </div> | 438 | </div> |
| 487 | </nav> | 439 | </nav> |
| 488 | <div class="right-flex"> | 440 | </div> |
| 489 | <div class="right-wrap"> | 441 | <div class="flex-right"> |
| 490 | <section class="old section-docs"> | 442 | <div class="wrap"> |
| 491 | <input type="search" class="search font-normal" id="search" autocomplete="off" spellcheck="false" placeholder="`s` to search, `?` to see more options"> | 443 | <section class="docs"> |
| | 444 | <input type="search" class="search" id="search" autocomplete="off" spellcheck="false" placeholder="`s` to search, `?` to see more options"> |
| 492 | <p id="status">Loading...</p> | 445 | <p id="status">Loading...</p> |
| 493 | <div id="sectNav" class="hidden"><ul id="listNav"></ul></div> | 446 | <div id="sectNav" class="hidden"><ul id="listNav"></ul></div> |
| 494 | <div id="fnProto" class="hidden"> | 447 | <div id="fnProto" class="hidden"> |
| ... | @@ -562,8 +515,8 @@ | ... | @@ -562,8 +515,8 @@ |
| 562 | </div> | 515 | </div> |
| 563 | </div> | 516 | </div> |
| 564 | <div id="helpDialog" class="hidden"> | 517 | <div id="helpDialog" class="hidden"> |
| 565 | <div class="help-flex"> | 518 | <div class="help-modal"> |
| 566 | <div class="help-modal"> | 519 | <div class="dialog"> |
| 567 | <h1>Keyboard Shortcuts</h1> | 520 | <h1>Keyboard Shortcuts</h1> |
| 568 | <dl><dt><kbd>?</kbd></dt><dd>Show this help dialog</dd></dl> | 521 | <dl><dt><kbd>?</kbd></dt><dd>Show this help dialog</dd></dl> |
| 569 | <dl><dt><kbd>Esc</kbd></dt><dd>Clear focus; close this dialog</dd></dl> | 522 | <dl><dt><kbd>Esc</kbd></dt><dd>Clear focus; close this dialog</dd></dl> |