├── .github └── workflows │ └── publish.yml ├── .gitignore ├── .quartoignore ├── DESCRIPTION ├── LICENSE ├── README.md ├── _extensions └── bookup │ ├── _extension.yml │ ├── bookup.scss │ ├── bookup_dark.scss │ ├── embed-fonts.lua │ ├── fonts-download.css │ ├── fonts-embed.css │ └── fonts │ ├── fira-mono-v12-latin-500.woff2 │ ├── fira-mono-v12-latin-700.woff2 │ ├── fira-mono-v12-latin-regular.woff2 │ ├── roboto-slab-v22-latin-700.woff2 │ ├── roboto-v29-latin-300.woff2 │ ├── roboto-v29-latin-300italic.woff2 │ ├── roboto-v29-latin-700.woff2 │ ├── roboto-v29-latin-700italic.woff2 │ ├── roboto-v29-latin-italic.woff2 │ └── roboto-v29-latin-regular.woff2 ├── examples ├── _sample.qmd ├── book │ ├── .gitignore │ ├── _extensions │ │ └── bookup │ ├── _quarto.yml │ ├── index.qmd │ ├── references.bib │ ├── references.qmd │ ├── sample.qmd │ └── summary.qmd ├── document │ ├── _extensions │ │ └── bookup │ ├── bookup-dark.qmd │ └── bookup.qmd └── website │ ├── .gitignore │ ├── _extensions │ └── bookup │ ├── _quarto.yml │ ├── about.qmd │ ├── index.qmd │ ├── page.qmd │ └── styles.css ├── screenshots ├── book_light.png ├── single_dark.png ├── single_light.png └── website_dark.png └── template.qmd /.github/workflows/publish.yml: -------------------------------------------------------------------------------- 1 | on: 2 | workflow_dispatch: 3 | push: 4 | branches: [main] 5 | 6 | name: Publish examples 7 | 8 | jobs: 9 | build-deploy: 10 | runs-on: ubuntu-latest 11 | permissions: 12 | contents: write 13 | steps: 14 | - name: Install dev packages 15 | run: sudo apt-get install -y pandoc 16 | 17 | - name: Check out repository 18 | uses: actions/checkout@v2 19 | 20 | - name: Set up Quarto 21 | uses: quarto-dev/quarto-actions/setup@v2 22 | 23 | - name: Install R 24 | uses: r-lib/actions/setup-r@v2 25 | with: 26 | r-version: "release" 27 | 28 | - name: Set up Pandoc 29 | uses: r-lib/actions/setup-pandoc@v2 30 | 31 | - name: Install R Dependencies 32 | uses: r-lib/actions/setup-r-dependencies@v2 33 | with: 34 | cache: true 35 | cache-version: 2 36 | 37 | - name: Render book 38 | uses: quarto-dev/quarto-actions/render@v2 39 | with: 40 | path: "examples/book" 41 | 42 | - name: Render website 43 | uses: quarto-dev/quarto-actions/render@v2 44 | with: 45 | path: "examples/website" 46 | 47 | - name: Render example document 48 | uses: quarto-dev/quarto-actions/render@v2 49 | with: 50 | path: "examples/document/bookup.qmd" 51 | env: 52 | GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }} 53 | 54 | - name: Render dark example document 55 | uses: quarto-dev/quarto-actions/render@v2 56 | with: 57 | path: "examples/document/bookup-dark.qmd" 58 | env: 59 | GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }} 60 | 61 | - name: Copy examples 62 | run: | 63 | mkdir gh_root && \ 64 | cp -rp examples/book/_book gh_root/book && \ 65 | cp -rp examples/website/_site gh_root/website && \ 66 | cp -p examples/document/bookup.html gh_root/ && \ 67 | cp -p examples/document/bookup-dark.html gh_root/ 68 | 69 | - name: Deploy book 70 | uses: JamesIves/github-pages-deploy-action@v4 71 | with: 72 | folder: gh_root 73 | token: ${{ secrets.GITHUB_TOKEN }} 74 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | *_files 2 | *.html 3 | /.luarc.json 4 | _freeze/ 5 | _book/ 6 | _site 7 | .quarto/ 8 | examples/**.html 9 | examples/*/fonts/ -------------------------------------------------------------------------------- /.quartoignore: -------------------------------------------------------------------------------- 1 | examples/ 2 | LICENSE 3 | DESCRIPTION 4 | .github/ 5 | .gitignore 6 | screenshots/ -------------------------------------------------------------------------------- /DESCRIPTION: -------------------------------------------------------------------------------- 1 | Package: placeholder 2 | Type: Quarto custom format 3 | Title: bookup-html 4 | Encoding: UTF-8 5 | Date: 2023-03-08 6 | Version: 0.0.1 7 | Depends: 8 | knitr, 9 | palmerpenguins, 10 | DT, 11 | ggplot2 12 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2023 Julien Barnier 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # bookup-html custom quarto format 2 | 3 | [![Publish examples](https://github.com/juba/bookup-html/actions/workflows/publish.yml/badge.svg)](https://github.com/juba/bookup-html/actions/workflows/publish.yml) 4 | 5 | 6 | `bookup` is a custom [quarto](https://quarto.org) HTML format based on the Roboto font family. It provides both a light and a dark theme, and should be suitable for single documents, book projects and website projects. 7 | 8 | ## Screenshots 9 | 10 | 11 | 12 | 13 | 18 | 23 | 24 | 25 | 30 | 35 | 36 | 37 | 42 | 47 | 48 | 49 | 54 | 59 | 60 | 61 |
14 | 15 | Single document, light theme
([live example](https://juba.github.io/bookup-html/bookup.html)) 16 | 17 | 		19 | 20 | [![Single document light theme screenshot](screenshots/single_light.png)](https://juba.github.io/bookup-html/bookup.html) 21 | 22 |
26 | 27 | Single document, dark theme
([live example](https://juba.github.io/bookup-html/bookup-dark.html)) 28 | 29 | 		31 | 32 | [![Single document dark theme screenshot](screenshots/single_dark.png)](https://juba.github.io/bookup-html/bookup-dark.html) 33 | 34 |
38 | 39 | Book project with a docked sidebar, light theme
([live example](https://juba.github.io/bookup-html/book/)) 40 | 41 | 		43 | 44 | [![Book project screenshot](screenshots/book_light.png)](https://juba.github.io/bookup-html/book/) 45 | 46 |
50 | 51 | Website project with a floating sidebar, dark theme
([live example](https://juba.github.io/bookup-html/website/)) 52 | 53 | 		55 | 56 | [![Website project screenshot](screenshots/website_dark.png)](https://juba.github.io/bookup-html/website/) 57 | 58 |
62 | 63 | ## Installation and usage 64 | 65 | To use this custom format, first install the extension at the root directory of your project: 66 | 67 | ```bash 68 | quarto add juba/bookup-html 69 | ``` 70 | 71 | And add the format to your YAML configuration, along with other HTML format options if needed: 72 | 73 | ```yaml 74 | format: 75 | bookup-html: 76 | toc: true 77 | toc-depth: 3 78 | ``` 79 | 80 | 81 | Even simpler, you can also directly install the extensions and generate a sample qmd file from a template with: 82 | 83 | ```bash 84 | quarto use template juba/bookup-html 85 | ``` 86 | 87 | ## Dark and light variants 88 | 89 | **Warning :** this will only work with quarto version 1.3 or higher. 90 | 91 | By default, your document will be displayed with the light theme, with a toggle allowing to switch to the dark theme. 92 | 93 | If you want to change this behavior you can add a variant to the format name: 94 | 95 | | Format name | Theme used | 96 | | ----------------------- | ------------------------------------------- | 97 | | `bookup-html` (default) | Light theme by default, optional dark theme | 98 | | `bookup-html+dark` | Dark theme by default, optional light theme | 99 | | `bookup-html+lightonly` | Light theme only | 100 | | `bookup-html+darkonly` | Dark theme only | 101 | 102 | 103 | ## Format Options 104 | 105 | 106 | Currently `bookup` provides the following option: 107 | 108 | - `embed-fonts` : if set to `true`, fonts are included locally with the document. If set to `false`, they are downloaded from Google Web Fonts. Not that if you use `self-contained: true`, fonts are embedded inside the resulting HTML even if `embed-fonts` is `false`. 109 | 110 | 111 | ## Credits 112 | 113 | This format is derived from the original [bookdown](https://bookdown.org) theme, adapted for the online french book [Introduction à R et au tidyverse](https://juba.github.io/tidyverse). 114 | 115 | -------------------------------------------------------------------------------- /_extensions/bookup/_extension.yml: -------------------------------------------------------------------------------- 1 | title: Bookup 2 | author: Julien Barnier 3 | version: 0.1.0 4 | quarto-required: ">=1.3.340" 5 | contributes: 6 | formats: 7 | common: 8 | toc: true 9 | filters: [embed-fonts.lua] 10 | embed-fonts: true 11 | html: 12 | theme: 13 | light: [bookup.scss] 14 | dark: [bookup.scss, bookup_dark.scss] 15 | html+dark: 16 | theme: 17 | dark: [bookup.scss, bookup_dark.scss] 18 | light: [bookup.scss] 19 | html+lightonly: 20 | theme: bookup.scss 21 | html+darkonly: 22 | theme: [bookup.scss, bookup_dark.scss] -------------------------------------------------------------------------------- /_extensions/bookup/bookup.scss: -------------------------------------------------------------------------------- 1 | /*-- scss:defaults --*/ 2 | 3 | $font-family-sans-serif: "Roboto", "Segoe UI", "Helvetica Neue", Helvetica, sans-serif; 4 | $font-family-monospace: "Fira Mono", "Menlo", "Andale Mono", monospace; 5 | $font-size-root: 16px; 6 | $h1-font-size: 2.2em; 7 | $h2-font-size: 1.75em; 8 | $h3-font-size: 1.5em; 9 | $h4-font-size: 1.25em; 10 | 11 | 12 | /*-- scss:rules --*/ 13 | 14 | :root { 15 | --bs-body-font-weight: 300; 16 | --link-color: #4183C4; 17 | 18 | --toc-active-color: #0d6efd; 19 | --toc-border-color: #e9ecef; 20 | 21 | --sidebar-fg: #333; 22 | --sidebar-bg-docked: #fafafa; 23 | --sidebar-border: #dee2e6; 24 | --sidebar-active-link-color: #0d6efd; 25 | --sidebar-part-color: #00368c; 26 | --sidebar-input-border: #a1a7ac; 27 | --sidebar-form-bg: transparent; 28 | 29 | --figure-img-border: 1px solid #ddd; 30 | --figure-img-shadow: 1px 1px 10px #ddd; 31 | 32 | --code-block-color: #555; 33 | --code-block-bg: #f7f7f7; 34 | --code-color: #c7254e; 35 | --code-bg: #f9f2f4; 36 | 37 | --hl-code-comments: #696867; 38 | 39 | --header-footer-border: #dee2e6; 40 | 41 | --table-tr-border: #dee2e6; 42 | --table-out-borders: #999; 43 | --table-tr-hover: rgba(0, 0, 0, 0.07); 44 | 45 | --reader-toggle-bg: #fafafa; 46 | --reader-toggle-border: #BBB; 47 | 48 | --callout-color: #333; 49 | --callout-warning-bg: #fff9e6; 50 | --callout-warning-title: #c7980d; 51 | --callout-note-bg: #e7f1ff; 52 | --callout-note-title: #2f65b8; 53 | --callout-important-bg: #fcebec; 54 | --callout-important-title: #900; 55 | --callout-caution-bg: #fff2e8; 56 | --callout-caution-title: #d6850d; 57 | --callout-tip-bg: #e8f3ee; 58 | --callout-tip-title: #050; 59 | 60 | --listing-card-border: #a1a7ac; 61 | --listing-card-shadow: rgba(0, 0, 0, 0.04); 62 | --listing-card-shadow-hover: rgba(0, 0, 0, 0.1); 63 | } 64 | 65 | .table, 66 | .dataTable { 67 | --bs-table-accent-bg: rgba(0, 0, 0, 0); 68 | --bs-table-striped-bg: rgba(0, 0, 0, 0.03); 69 | } 70 | 71 | /* Grid */ 72 | 73 | @media (min-width: 992px) { 74 | body.docked .page-columns { 75 | grid-template-columns: [screen-start] 1.5em [screen-start-inset page-start] minmax(50px, 170px) [page-start-inset] 50px [body-start-outset] 50px [body-start] minmax(3em, 5fr) [body-content-start] minmax(300px, 800px) [body-content-end] minmax(3em, 5fr) [body-end] 50px [body-end-outset] minmax(0px, 100px) [page-end-inset] 50px [page-end] 7fr [screen-end-inset] 1.5em [screen-end] !important 76 | } 77 | } 78 | 79 | 80 | /* Global styles */ 81 | 82 | p { 83 | margin-bottom: 0.85em; 84 | } 85 | 86 | 87 | /* Sidebar */ 88 | 89 | #quarto-sidebar, 90 | #quarto-content .sidebar-navigation { 91 | 92 | &.docked { 93 | background-color: var(--sidebar-bg-docked); 94 | } 95 | 96 | .sidebar-item-container { 97 | margin-bottom: 0.5em; 98 | 99 | a.active, 100 | a:hover { 101 | color: var(--sidebar-active-link-color); 102 | } 103 | } 104 | 105 | code { 106 | font-size: inherit; 107 | color: inherit; 108 | background-color: transparent; 109 | } 110 | 111 | a, 112 | .chapter-number { 113 | color: var(--sidebar-fg); 114 | } 115 | 116 | .chapter-number { 117 | font-weight: bold; 118 | } 119 | 120 | .sidebar-item-section { 121 | margin-bottom: .7em; 122 | } 123 | 124 | .sidebar-item+.sidebar-item-section { 125 | margin-top: 1.2em; 126 | } 127 | 128 | .sidebar-item-section>.sidebar-item-container:first-child a, 129 | .sidebar-item-section>.sidebar-item-container:first-child a.active, 130 | .sidebar-item-section>.sidebar-item-container:first-child a:hover { 131 | font-weight: bold; 132 | color: var(--sidebar-part-color); 133 | background-color: transparent; 134 | cursor: pointer; 135 | } 136 | 137 | } 138 | 139 | #quarto-sidebar { 140 | border-color: var(--sidebar-border) !important; 141 | 142 | #quarto-search { 143 | form { 144 | border-color: var(--sidebar-input-border); 145 | background-color: var(--sidebar-form-bg); 146 | } 147 | 148 | form, 149 | svg, 150 | input { 151 | color: var(--sidebar-fg) !important; 152 | } 153 | } 154 | 155 | } 156 | 157 | #quarto-sidebarnav-toggle+#quarto-sidebar, 158 | #quarto-toc-toggle+#quarto-sidebar { 159 | border: none !important; 160 | } 161 | 162 | 163 | /* Table of contents */ 164 | 165 | #quarto-margin-sidebar, 166 | #quarto-content .margin-sidebar, 167 | #quarto-sidebar #TOC { 168 | code { 169 | font-size: inherit; 170 | color: inherit; 171 | } 172 | 173 | ul { 174 | 175 | a.active, 176 | a:hover { 177 | color: var(--toc-active-color) !important; 178 | border-left: 1px solid var(--toc-active-color); 179 | } 180 | 181 | a { 182 | border-color: var(--toc-border-color); 183 | } 184 | } 185 | 186 | a:hover { 187 | color: var(--link-color); 188 | } 189 | 190 | ul>li>ul>li>a { 191 | padding: 0.1em 0 0.1em 2em; 192 | font-size: 90%; 193 | opacity: 85%; 194 | } 195 | } 196 | 197 | /* toc-location: body */ 198 | #quarto-document-content #TOC { 199 | 200 | margin-bottom: 3em; 201 | 202 | h2 { 203 | font-size: 1.2em; 204 | margin-bottom: 0.3em; 205 | } 206 | 207 | >ul { 208 | margin-left: 1em; 209 | } 210 | 211 | ul { 212 | border-left: 1px solid var(--toc-border-color); 213 | list-style-type: none; 214 | font-size: 95%; 215 | 216 | li { 217 | &::before { 218 | content: ""; 219 | } 220 | 221 | margin-bottom: 0; 222 | } 223 | } 224 | 225 | ul ul { 226 | padding-left: 1.5em; 227 | border: none; 228 | margin-bottom: 0; 229 | } 230 | } 231 | 232 | 233 | 234 | /* Content */ 235 | 236 | #quarto-content { 237 | 238 | /* Reader mode toggles */ 239 | 240 | .margin-sidebar.quarto-sidebar-toggle-contents { 241 | background-color: var(--sidebar-bg-docked); 242 | color: var(--sidebar-fg); 243 | } 244 | 245 | .quarto-sidebar-toggle { 246 | background-color: var(--reader-toggle-border); 247 | border-color: var(--reader-toggle-border); 248 | } 249 | 250 | .quarto-sidebar-toggle-title { 251 | background-color: var(--reader-toggle-bg); 252 | color: var(--sidebar-fg); 253 | } 254 | 255 | .quarto-sidebar-toggle.expanded .quarto-sidebar-toggle-title { 256 | border-bottom-color: var(--reader-toggle-border); 257 | } 258 | 259 | .quarto-sidebar-toggle-contents { 260 | background-color: var(--reader-toggle-bg); 261 | } 262 | 263 | .quarto-sidebar-toggle+#quarto-sidebar { 264 | background-color: var(--bs-body-bg); 265 | } 266 | 267 | /* Bottom page navigation */ 268 | 269 | .page-navigation { 270 | a { 271 | color: var(--bs-body-color); 272 | } 273 | 274 | 275 | code { 276 | color: var(--code-block-color); 277 | background-color: var(--code-block-bg); 278 | border-color: var(--code-block-bg); 279 | } 280 | } 281 | 282 | } 283 | 284 | 285 | 286 | /* Document content */ 287 | 288 | #quarto-document-content { 289 | 290 | #title-block-header .quarto-title-meta-contents a { 291 | color: var(--bs-body-color); 292 | } 293 | 294 | a, 295 | .btn-link { 296 | color: var(--link-color); 297 | text-decoration: none; 298 | } 299 | 300 | a:not(.nav-link):hover, 301 | .btn-link:hover { 302 | text-decoration: underline; 303 | } 304 | 305 | a.anchorjs-link:hover { 306 | text-decoration: none; 307 | } 308 | 309 | strong { 310 | font-weight: bold; 311 | } 312 | 313 | /* Headings */ 314 | 315 | #title-block-header { 316 | margin-block-end: 2rem; 317 | } 318 | 319 | h1, 320 | h2, 321 | h3, 322 | h4 { 323 | font-family: "Roboto Slab", $font-family-sans-serif; 324 | line-height: 1.25; 325 | margin-top: 1.275em; 326 | margin-bottom: 0.85em; 327 | border: none; 328 | 329 | code { 330 | color: inherit; 331 | background: none; 332 | padding: 0; 333 | } 334 | } 335 | 336 | 337 | .header-section-number { 338 | color: inherit; 339 | padding-right: 0.5em; 340 | } 341 | 342 | 343 | /* Figures */ 344 | 345 | p>img { 346 | margin: 0.5em auto 1.5em auto; 347 | display: block; 348 | max-width: 100%; 349 | height: auto; 350 | } 351 | 352 | figure { 353 | margin: 2em auto 2.5em auto; 354 | text-align: center; 355 | max-width: 100%; 356 | 357 | img { 358 | border: var(--figure-img-border); 359 | box-shadow: var(--figure-img-shadow); 360 | max-width: 100%; 361 | height: auto; 362 | } 363 | 364 | figcaption { 365 | color: var(--bs-body-color); 366 | font-style: italic; 367 | font-size: 0.9em; 368 | margin-top: -1em; 369 | } 370 | } 371 | 372 | 373 | /* Tables */ 374 | 375 | table, 376 | .pagedtable-wrapper, 377 | .dataTables_wrapper { 378 | font-size: 0.9em; 379 | margin-top: 0; 380 | margin-bottom: 2rem; 381 | } 382 | 383 | table { 384 | width: auto; 385 | margin-left: auto; 386 | margin-right: auto; 387 | 388 | thead { 389 | th { 390 | box-shadow: none; 391 | } 392 | } 393 | 394 | th, 395 | td { 396 | padding: .3em 1em; 397 | } 398 | 399 | thead, 400 | tbody { 401 | tr { 402 | border-top: none; 403 | } 404 | 405 | tr:first-child { 406 | border-top: 1px solid var(--table-out-borders); 407 | } 408 | 409 | tr:last-child { 410 | border-bottom: 1px solid var(--table-out-borders); 411 | } 412 | } 413 | 414 | tbody { 415 | border-top: none; 416 | 417 | tr:hover { 418 | background-color: var(--table-tr-hover) !important; 419 | box-shadow: none !important; 420 | 421 | td { 422 | box-shadow: none !important; 423 | } 424 | } 425 | } 426 | } 427 | 428 | 429 | .table { 430 | tr { 431 | border-color: var(--table-tr-border); 432 | } 433 | } 434 | 435 | .pagedtable table { 436 | width: 100%; 437 | margin-left: 0; 438 | margin-right: 0; 439 | } 440 | 441 | /* DT */ 442 | 443 | .dataTables_wrapper, 444 | .dataTables_wrapper .dataTables_length, 445 | .dataTables_wrapper .dataTables_filter, 446 | .dataTables_wrapper .dataTables_info, 447 | .dataTables_wrapper .dataTables_processing, 448 | .dataTables_wrapper .dataTables_paginate, 449 | .dataTables_wrapper .dataTables_paginate .paginate_button { 450 | color: var(--bs-body-color) !important; 451 | } 452 | 453 | .dataTable { 454 | 455 | &.no-footer { 456 | border-bottom-color: var(--table-out-borders); 457 | } 458 | 459 | th { 460 | border-color: var(--table-out-borders); 461 | } 462 | 463 | tr { 464 | border-color: var(--table-tr-border); 465 | } 466 | 467 | tbody { 468 | td { 469 | border-color: var(--table-tr-border); 470 | } 471 | 472 | tr.even { 473 | background-color: var(--bs-table-accent-bg); 474 | } 475 | 476 | tr.odd { 477 | background-color: var(--bs-table-striped-bg); 478 | 479 | td { 480 | box-shadow: none; 481 | } 482 | } 483 | } 484 | 485 | } 486 | 487 | 488 | /* Code */ 489 | 490 | pre, 491 | code { 492 | font-size: .95em; 493 | 494 | a { 495 | color: inherit; 496 | } 497 | } 498 | 499 | p>code, 500 | a code, 501 | ul code, 502 | ol code { 503 | color: var(--code-color); 504 | background-color: var(--code-bg); 505 | border-color: var(--code-bg); 506 | padding: 2px 4px; 507 | font-size: 85%; 508 | border-radius: 4px; 509 | } 510 | 511 | pre { 512 | color: var(--code-block-color); 513 | background-color: var(--code-block-bg); 514 | border-radius: 6px; 515 | padding: .8em 1.2em; 516 | } 517 | 518 | div.sourceCode { 519 | color: var(--code-block-color); 520 | background-color: var(--code-block-bg); 521 | border-radius: 6px; 522 | margin-bottom: 1.6em; 523 | border: none; 524 | } 525 | 526 | .code-annotation-gutter { 527 | background-color: var(--code-block-bg); 528 | } 529 | 530 | a.code-annotation-anchor:hover { 531 | text-decoration: none; 532 | } 533 | 534 | code { 535 | 536 | span.kw, 537 | span.cf { 538 | font-weight: 500; 539 | } 540 | 541 | span.kw, 542 | span.cf, 543 | span.op, 544 | span.er { 545 | color: #009ad2; 546 | text-decoration: none; 547 | } 548 | 549 | span.co, 550 | span.do { 551 | color: var(--hl-code-comments); 552 | font-style: normal; 553 | } 554 | } 555 | 556 | 557 | /* Lists */ 558 | 559 | ul:not(.nav) { 560 | margin: 0 0 1.5em 0; 561 | padding: 0 0 0 2em; 562 | list-style-type: none; 563 | } 564 | 565 | ul:not(.nav):not(.task-list)>li { 566 | text-indent: -1.1em; 567 | margin-bottom: .5em; 568 | } 569 | 570 | ul:not(.nav):not(.task-list)>li::before { 571 | content: "— "; 572 | } 573 | 574 | 575 | /* Callouts */ 576 | 577 | .callout { 578 | 579 | padding: .5em; 580 | color: var(--callout-color); 581 | 582 | .callout-header { 583 | font-weight: bolder; 584 | font-size: 110%; 585 | margin-bottom: .5em; 586 | background: none; 587 | } 588 | 589 | .callout-body { 590 | font-weight: var(--bs-body-font-weight); 591 | } 592 | 593 | .callout-icon::before { 594 | height: 1.1rem; 595 | width: 1.1rem; 596 | background-size: 1.1rem 1.1rem; 597 | } 598 | 599 | /* Inline code in callout */ 600 | p>code, 601 | a code, 602 | ul code, 603 | ol code { 604 | color: var(--callout-color); 605 | background-color: transparent; 606 | border: none; 607 | padding: 2px 4px; 608 | font-size: 100%; 609 | } 610 | 611 | 612 | } 613 | 614 | .callout-warning { 615 | background-color: var(--callout-warning-bg); 616 | border-top-color: var(--callout-warning-bg); 617 | border-right-color: var(--callout-warning-bg); 618 | border-bottom-color: var(--callout-warning-bg); 619 | 620 | .callout-header { 621 | color: var(--callout-warning-title); 622 | } 623 | } 624 | 625 | .callout-note { 626 | background-color: var(--callout-note-bg); 627 | border-top-color: var(--callout-note-bg); 628 | border-right-color: var(--callout-note-bg); 629 | border-bottom-color: var(--callout-note-bg); 630 | 631 | 632 | .callout-header { 633 | color: var(--callout-note-title); 634 | } 635 | } 636 | 637 | .callout-important { 638 | background-color: var(--callout-important-bg); 639 | border-top-color: var(--callout-important-bg); 640 | border-right-color: var(--callout-important-bg); 641 | border-bottom-color: var(--callout-important-bg); 642 | 643 | .callout-header { 644 | color: var(--callout-important-title); 645 | } 646 | } 647 | 648 | .callout-caution { 649 | background-color: var(--callout-caution-bg); 650 | border-top-color: var(--callout-caution-bg); 651 | border-right-color: var(--callout-caution-bg); 652 | border-bottom-color: var(--callout-caution-bg); 653 | 654 | .callout-header { 655 | color: var(--callout-caution-title); 656 | } 657 | } 658 | 659 | .callout-tip { 660 | background-color: var(--callout-tip-bg); 661 | border-top-color: var(--callout-tip-bg); 662 | border-right-color: var(--callout-tip-bg); 663 | border-bottom-color: var(--callout-tip-bg); 664 | 665 | .callout-header { 666 | color: var(--callout-tip-title); 667 | } 668 | } 669 | 670 | 671 | /* Leaflet */ 672 | 673 | .leaflet-container { 674 | margin-top: 0; 675 | margin-bottom: 2rem; 676 | } 677 | 678 | .leaflet .leaflet-control-container a { 679 | background-color: #FFF; 680 | color: #000; 681 | } 682 | 683 | .leaflet a:hover { 684 | text-decoration: none; 685 | } 686 | 687 | 688 | /* Footnotes */ 689 | 690 | .footnote-back { 691 | padding-left: .3em; 692 | } 693 | 694 | .footnote-ref { 695 | padding: 0 0 0 .2em; 696 | font-weight: 400; 697 | } 698 | 699 | } 700 | 701 | 702 | /* Header secondary nav */ 703 | 704 | header { 705 | .quarto-secondary-nav { 706 | background-color: var(--bs-body-bg); 707 | color: var(--bs-body-color); 708 | border-bottom: 1px solid var(--header-footer-border); 709 | 710 | a, 711 | .btn, 712 | code { 713 | color: var(--bs-body-color) !important; 714 | } 715 | 716 | } 717 | } 718 | 719 | 720 | /* Footnotes */ 721 | 722 | #footnotes { 723 | .footnote-back { 724 | font-family: var(--bs-font-monospace); 725 | } 726 | } 727 | 728 | /* Footer */ 729 | 730 | body:not(.floating) { 731 | .nav-footer { 732 | border-top: 1px solid var(--header-footer-border); 733 | } 734 | } 735 | 736 | 737 | /* Listings */ 738 | 739 | #quarto-document-content { 740 | .quarto-listing { 741 | a { 742 | color: currentColor; 743 | 744 | &:hover { 745 | text-decoration: none; 746 | } 747 | } 748 | 749 | .card { 750 | box-shadow: 0 16px 16px var(--listing-card-shadow); 751 | transition: all 0.3s ease-out; 752 | background-color: var(--bs-body-bg); 753 | color: var(--bs-body-color); 754 | border-color: var(--listing-card-border); 755 | 756 | &:hover { 757 | transform: translateY(-5px) scale(1.005) translateZ(0); 758 | box-shadow: 0 26px 26px var(--listing-card-shadow-hover); 759 | } 760 | } 761 | } 762 | } -------------------------------------------------------------------------------- /_extensions/bookup/bookup_dark.scss: -------------------------------------------------------------------------------- 1 | /*-- scss:defaults --*/ 2 | 3 | $body-bg: #1c1f2b; 4 | $body-color: #cad2dd; 5 | $footer-bg: #1c1f2b; 6 | $footer-fg: #cad2dd; 7 | 8 | 9 | /*-- scss:rules --*/ 10 | 11 | :root { 12 | --link-color: #c1ff42; 13 | 14 | --toc-active-color: #c1ff42; 15 | --toc-border-color: #555; 16 | 17 | --sidebar-fg: #ccd1e2; 18 | --sidebar-bg-docked: #2d3143; 19 | --sidebar-border: transparent; 20 | --sidebar-active-link-color: #c1ff42; 21 | --sidebar-part-color: #ccd1e2; 22 | --sidebar-input-border: #5d6173; 23 | 24 | --figure-img-border: 1px solid #5d6173; 25 | --figure-img-shadow: none; 26 | 27 | --code-block-color: #9dbed8; 28 | --code-block-bg: #2d3143; 29 | --code-color: #9dbed8; 30 | --code-bg: #2d3143; 31 | 32 | --hl-code-comments: #8e8d8c; 33 | 34 | --header-footer-border: #2d3143; 35 | 36 | --table-tr-border: #50616e; 37 | --table-out-borders: #AAA; 38 | --table-tr-hover: #242838; 39 | 40 | --reader-toggle-bg: #2d3143; 41 | --reader-toggle-border: #5d6173; 42 | 43 | --callout-color: #000; 44 | --callout-warning-bg: #ffe99f; 45 | --callout-warning-title: #af8300; 46 | --callout-note-bg: #b4d3ff; 47 | --callout-note-title: #2f65b8; 48 | --callout-important-bg: #f8bcc0; 49 | --callout-important-title: #900; 50 | --callout-caution-bg: #ffdabd; 51 | --callout-caution-title: #be7200; 52 | --callout-tip-bg: #bafcde; 53 | --callout-tip-title: #050; 54 | 55 | --listing-card-border: #5d6173; 56 | --listing-card-shadow: rgba(255, 255, 255, 0.04); 57 | --listing-card-shadow-hover: rgba(255, 255, 255, 0.08); 58 | 59 | } 60 | 61 | .table, 62 | .dataTable { 63 | --bs-table-accent-bg: #35394b; 64 | --bs-table-striped-bg: #2d3143; 65 | } 66 | 67 | body { 68 | color-scheme: dark; 69 | } -------------------------------------------------------------------------------- /_extensions/bookup/embed-fonts.lua: -------------------------------------------------------------------------------- 1 | local function readMeta(meta) 2 | if meta['embed-fonts'] then 3 | quarto.doc.add_html_dependency({ 4 | name = "bookup_fonts_gwf", 5 | version = "0.0", 6 | stylesheets = { "fonts-embed.css" } 7 | }) 8 | quarto.doc.add_format_resource("fonts") 9 | else 10 | quarto.doc.add_html_dependency({ 11 | name = "bookup_fonts_embed", 12 | version = "0.0", 13 | stylesheets = { "fonts-download.css" } 14 | }) 15 | end 16 | end 17 | 18 | return { 19 | { Meta = readMeta } 20 | } 21 | -------------------------------------------------------------------------------- /_extensions/bookup/fonts-download.css: -------------------------------------------------------------------------------- 1 | @import url('https://fonts.googleapis.com/css?family=Roboto+Slab:700|Roboto:300,300i,400,400i,700|Fira+Code'); 2 | -------------------------------------------------------------------------------- /_extensions/bookup/fonts-embed.css: -------------------------------------------------------------------------------- 1 | /*-- scss:rules --*/ 2 | 3 | /* roboto-300 - latin */ 4 | @font-face { 5 | font-family: 'Roboto'; 6 | font-style: normal; 7 | font-weight: 300; 8 | src: local(''), 9 | url('fonts/roboto-v29-latin-300.woff2') format('woff2') 10 | } 11 | 12 | /* roboto-300italic - latin */ 13 | @font-face { 14 | font-family: 'Roboto'; 15 | font-style: italic; 16 | font-weight: 300; 17 | src: local(''), 18 | url('fonts/roboto-v29-latin-300italic.woff2') format('woff2') 19 | } 20 | 21 | /* roboto-regular - latin */ 22 | @font-face { 23 | font-family: 'Roboto'; 24 | font-style: normal; 25 | font-weight: 400; 26 | src: local(''), 27 | url('fonts/roboto-v29-latin-regular.woff2') format('woff2') 28 | } 29 | 30 | /* roboto-italic - latin */ 31 | @font-face { 32 | font-family: 'Roboto'; 33 | font-style: italic; 34 | font-weight: 400; 35 | src: local(''), 36 | url('fonts/roboto-v29-latin-italic.woff2') format('woff2') 37 | } 38 | 39 | /* roboto-700 - latin */ 40 | @font-face { 41 | font-family: 'Roboto'; 42 | font-style: normal; 43 | font-weight: 700; 44 | src: local(''), 45 | url('fonts/roboto-v29-latin-700.woff2') format('woff2') 46 | } 47 | 48 | /* roboto-700italic - latin */ 49 | @font-face { 50 | font-family: 'Roboto'; 51 | font-style: italic; 52 | font-weight: 700; 53 | src: local(''), 54 | url('fonts/roboto-v29-latin-700italic.woff2') format('woff2') 55 | } 56 | 57 | /* roboto-slab-700 - latin */ 58 | @font-face { 59 | font-family: 'Roboto Slab'; 60 | font-style: normal; 61 | font-weight: 700; 62 | src: local(''), 63 | url('fonts/roboto-slab-v22-latin-700.woff2') format('woff2') 64 | } 65 | 66 | /* fira-mono-regular - latin */ 67 | @font-face { 68 | font-family: 'Fira Mono'; 69 | font-style: normal; 70 | font-weight: 400; 71 | src: local(''), 72 | url('fonts/fira-mono-v12-latin-regular.woff2') format('woff2') 73 | } 74 | 75 | /* fira-mono-500 - latin */ 76 | @font-face { 77 | font-family: 'Fira Mono'; 78 | font-style: normal; 79 | font-weight: 500; 80 | src: local(''), 81 | url('fonts/fira-mono-v12-latin-500.woff2') format('woff2') 82 | } 83 | 84 | /* fira-mono-700 - latin */ 85 | @font-face { 86 | font-family: 'Fira Mono'; 87 | font-style: normal; 88 | font-weight: 700; 89 | src: local(''), 90 | url('fonts/fira-mono-v12-latin-700.woff2') format('woff2') 91 | } -------------------------------------------------------------------------------- /_extensions/bookup/fonts/fira-mono-v12-latin-500.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/juba/bookup-html/62827330a1cbbe367e369b0edf671ce76d4c15ee/_extensions/bookup/fonts/fira-mono-v12-latin-500.woff2 -------------------------------------------------------------------------------- /_extensions/bookup/fonts/fira-mono-v12-latin-700.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/juba/bookup-html/62827330a1cbbe367e369b0edf671ce76d4c15ee/_extensions/bookup/fonts/fira-mono-v12-latin-700.woff2 -------------------------------------------------------------------------------- /_extensions/bookup/fonts/fira-mono-v12-latin-regular.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/juba/bookup-html/62827330a1cbbe367e369b0edf671ce76d4c15ee/_extensions/bookup/fonts/fira-mono-v12-latin-regular.woff2 -------------------------------------------------------------------------------- /_extensions/bookup/fonts/roboto-slab-v22-latin-700.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/juba/bookup-html/62827330a1cbbe367e369b0edf671ce76d4c15ee/_extensions/bookup/fonts/roboto-slab-v22-latin-700.woff2 -------------------------------------------------------------------------------- /_extensions/bookup/fonts/roboto-v29-latin-300.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/juba/bookup-html/62827330a1cbbe367e369b0edf671ce76d4c15ee/_extensions/bookup/fonts/roboto-v29-latin-300.woff2 -------------------------------------------------------------------------------- /_extensions/bookup/fonts/roboto-v29-latin-300italic.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/juba/bookup-html/62827330a1cbbe367e369b0edf671ce76d4c15ee/_extensions/bookup/fonts/roboto-v29-latin-300italic.woff2 -------------------------------------------------------------------------------- /_extensions/bookup/fonts/roboto-v29-latin-700.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/juba/bookup-html/62827330a1cbbe367e369b0edf671ce76d4c15ee/_extensions/bookup/fonts/roboto-v29-latin-700.woff2 -------------------------------------------------------------------------------- /_extensions/bookup/fonts/roboto-v29-latin-700italic.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/juba/bookup-html/62827330a1cbbe367e369b0edf671ce76d4c15ee/_extensions/bookup/fonts/roboto-v29-latin-700italic.woff2 -------------------------------------------------------------------------------- /_extensions/bookup/fonts/roboto-v29-latin-italic.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/juba/bookup-html/62827330a1cbbe367e369b0edf671ce76d4c15ee/_extensions/bookup/fonts/roboto-v29-latin-italic.woff2 -------------------------------------------------------------------------------- /_extensions/bookup/fonts/roboto-v29-latin-regular.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/juba/bookup-html/62827330a1cbbe367e369b0edf671ce76d4c15ee/_extensions/bookup/fonts/roboto-v29-latin-regular.woff2 -------------------------------------------------------------------------------- /examples/_sample.qmd: -------------------------------------------------------------------------------- 1 | 2 | 3 | ```{r} 4 | #| label: setup 5 | #| include: false 6 | 7 | library(knitr) 8 | ``` 9 | 10 | # Code and tables 11 | 12 | ## Syntax highlighting 13 | 14 | Here is a sample code chunk, just to show that syntax highlighting works as expected as well as code annotations. 15 | 16 | ```{r} 17 | #| label: sh 18 | #| echo: true 19 | #| eval: true 20 | say_hello <- function(name) { 21 | paste("Hello,", name, "!") # <1> 22 | } 23 | 24 | say_hello("world") # <2> 25 | ``` 26 | 1. Quite an original example. 27 | 2. This is were all the action is happening. 28 | 29 | ## Verbatim 30 | 31 | Here is the structure of the `penguins` dataset. 32 | 33 | ```{r} 34 | #| label: penguins_str 35 | #| echo: true 36 | #| code-line-numbers: true 37 | library(palmerpenguins) 38 | str(penguins) 39 | ``` 40 | 41 | ## Tables 42 | 43 | Sample table output. 44 | 45 | ```{r} 46 | #| label: table 47 | tab <- table(penguins$island, penguins$species) 48 | kable(tab) 49 | ``` 50 | 51 | Sample `DT:datatable` output. 52 | 53 | ```{r} 54 | #| label: dt 55 | library(DT) 56 | DT::datatable(penguins) 57 | ``` 58 | 59 | 60 | # Styling 61 | 62 | A simple list : 63 | 64 | - one mississipi 65 | - two mississipi 66 | - three mississipi 67 | 68 | 69 | A blockquote : 70 | 71 | > Oh ! What a nice blockquote you have here. Much more wonderful than a classical lorem ipsum, really. 72 | 73 | And we could also [include links](https://www.r-project.org/) or simply URLs like this : ^[And even footnotes]. 74 | 75 | An incredibly complex equation : 76 | 77 | $$ y = \sqrt{\frac{1}{x + \beta}} $$ 78 | 79 | 80 | # Figures 81 | 82 | Here is an histogram. 83 | 84 | ```{r} 85 | #| label: hist 86 | library(ggplot2) 87 | ggplot(data = penguins) + 88 | geom_histogram(aes(x = body_mass_g)) + 89 | facet_grid(rows = vars(species)) 90 | ``` 91 | 92 | And a wonderful scatterplot, with a caption. 93 | 94 | ```{r} 95 | #| label: scatter 96 | #| fig.cap: "This is a scatterplot" 97 | ggplot(data = penguins) + 98 | geom_point( 99 | aes(x = bill_length_mm, y = bill_depth_mm) 100 | ) 101 | ``` 102 | 103 | 104 | # Callouts 105 | 106 | ::: {.callout-note} 107 | This is a note callout. 108 | ::: 109 | 110 | ::: {.callout-warning} 111 | This is a warning callout 112 | ::: 113 | 114 | ::: {.callout-important} 115 | This is an important callout 116 | ::: 117 | 118 | ::: {.callout-caution} 119 | This is a caution callout 120 | ::: 121 | 122 | ::: {.callout-tip} 123 | This is a tip callout.With a bit of `code`. 124 | ::: 125 | 126 | # Tabset 127 | 128 | :::{.panel-tabset} 129 | 130 | ## First tab 131 | 132 | This is the first tab content. 133 | 134 | ## Second tab 135 | 136 | This is the second tab content. 137 | 138 | ::: -------------------------------------------------------------------------------- /examples/book/.gitignore: -------------------------------------------------------------------------------- 1 | /.quarto/ 2 | -------------------------------------------------------------------------------- /examples/book/_extensions/bookup: -------------------------------------------------------------------------------- 1 | ../../../_extensions/bookup -------------------------------------------------------------------------------- /examples/book/_quarto.yml: -------------------------------------------------------------------------------- 1 | project: 2 | type: book 3 | 4 | execute: 5 | freeze: auto 6 | 7 | book: 8 | title: "Sample bookup-html book project" 9 | author: "Jane Doe" 10 | date: today 11 | downloads: [pdf, epub] 12 | doi: "10.XXX/XXX" 13 | url: https://example.com 14 | repo-url: https://github.com/juba/bookup-html/tree/main/examples/book 15 | repo-actions: edit 16 | search: true 17 | reader-mode: true 18 | sidebar: 19 | style: "docked" 20 | chapters: 21 | - index.qmd 22 | - part: "Content" 23 | chapters: 24 | - sample.qmd 25 | - summary.qmd 26 | appendices: 27 | - references.qmd 28 | 29 | bibliography: references.bib 30 | 31 | format: 32 | bookup-html 33 | 34 | 35 | 36 | -------------------------------------------------------------------------------- /examples/book/index.qmd: -------------------------------------------------------------------------------- 1 | # Introduction 2 | 3 | This is a sample quarto book project using the `bookup-html` custom [quarto](https://quarto.org) format. 4 | 5 | You can learn more on this format and how to use it in the [bookup-html Github repository](https://github.com/juba/bookup-html). 6 | 7 | -------------------------------------------------------------------------------- /examples/book/references.bib: -------------------------------------------------------------------------------- 1 | @article{knuth84, 2 | author = {Knuth, Donald E.}, 3 | title = {Literate Programming}, 4 | year = {1984}, 5 | issue_date = {May 1984}, 6 | publisher = {Oxford University Press, Inc.}, 7 | address = {USA}, 8 | volume = {27}, 9 | number = {2}, 10 | issn = {0010-4620}, 11 | url = {https://doi.org/10.1093/comjnl/27.2.97}, 12 | doi = {10.1093/comjnl/27.2.97}, 13 | journal = {Comput. J.}, 14 | month = may, 15 | pages = {97–111}, 16 | numpages = {15} 17 | } 18 | 19 | 20 | -------------------------------------------------------------------------------- /examples/book/references.qmd: -------------------------------------------------------------------------------- 1 | # References {.unnumbered} 2 | 3 | ::: {#refs} 4 | ::: 5 | -------------------------------------------------------------------------------- /examples/book/sample.qmd: -------------------------------------------------------------------------------- 1 | # Features overview 2 | 3 | This is a book created from markdown and executable code. 4 | 5 | See @knuth84 for additional discussion of literate programming. 6 | 7 | {{< include ../_sample.qmd >}} 8 | 9 | -------------------------------------------------------------------------------- /examples/book/summary.qmd: -------------------------------------------------------------------------------- 1 | # An empty page 2 | 3 | In summary, this book has no content whatsoever. 4 | -------------------------------------------------------------------------------- /examples/document/_extensions/bookup: -------------------------------------------------------------------------------- 1 | ../../../_extensions/bookup/ -------------------------------------------------------------------------------- /examples/document/bookup-dark.qmd: -------------------------------------------------------------------------------- 1 | --- 2 | title: "Bookup quarto format example" 3 | date: today 4 | author: "Jane Doe" 5 | format: 6 | bookup-html+darkonly: 7 | embed-fonts: true 8 | self-contained: true 9 | --- 10 | 11 | 12 | This is a sample document using the `bookup-html` custom [quarto](https://quarto.org) format. 13 | 14 | You can learn more about this format and how to use it in the [bookup-html Github repository](https://github.com/juba/bookup-html). 15 | 16 | 17 | {{< include ../_sample.qmd >}} 18 | -------------------------------------------------------------------------------- /examples/document/bookup.qmd: -------------------------------------------------------------------------------- 1 | --- 2 | title: "Bookup quarto format example" 3 | date: today 4 | author: "Jane Doe" 5 | format: 6 | bookup-html: 7 | embed-fonts: true 8 | self-contained: true 9 | --- 10 | 11 | 12 | This is a sample document using the `bookup-html` custom [quarto](https://quarto.org) format. 13 | 14 | You can learn more about this format and how to use it in the [bookup-html Github repository](https://github.com/juba/bookup-html). 15 | 16 | 17 | {{< include ../_sample.qmd >}} 18 | -------------------------------------------------------------------------------- /examples/website/.gitignore: -------------------------------------------------------------------------------- 1 | /.quarto/ 2 | -------------------------------------------------------------------------------- /examples/website/_extensions/bookup: -------------------------------------------------------------------------------- 1 | ../../../_extensions/bookup/ -------------------------------------------------------------------------------- /examples/website/_quarto.yml: -------------------------------------------------------------------------------- 1 | project: 2 | type: website 3 | 4 | website: 5 | title: "Bookup website" 6 | search: true 7 | reader-mode: true 8 | navbar: 9 | background: "#2e3f58" 10 | left: 11 | - href: index.qmd 12 | text: Home 13 | - about.qmd 14 | - text: "More" 15 | menu: 16 | - page.qmd 17 | sidebar: 18 | style: "floating" 19 | contents: 20 | - section: "Pages" 21 | contents: 22 | - index.qmd 23 | - page.qmd 24 | - about.qmd 25 | page-footer: 26 | left: "This is quite a fine footer." 27 | right: 28 | - icon: github 29 | href: https://github.com/juba/bookup-html 30 | 31 | format: 32 | bookup-html: 33 | embed-fonts: true 34 | 35 | 36 | -------------------------------------------------------------------------------- /examples/website/about.qmd: -------------------------------------------------------------------------------- 1 | --- 2 | title: "About" 3 | --- 4 | 5 | This would be a nice about page if it had any content. 6 | -------------------------------------------------------------------------------- /examples/website/index.qmd: -------------------------------------------------------------------------------- 1 | --- 2 | title: "Sample bookup-html website project" 3 | --- 4 | 5 | # Welcome 6 | 7 | This is a sample quarto website project using the `bookup-html` custom [quarto](https://quarto.org) format. 8 | 9 | You can learn more on this format and how to use it in the [bookup-html Github repository](https://github.com/juba/bookup-html). 10 | 11 | 12 | 13 | -------------------------------------------------------------------------------- /examples/website/page.qmd: -------------------------------------------------------------------------------- 1 | --- 2 | title: "Sample page" 3 | --- 4 | 5 | {{< include ../_sample.qmd >}} 6 | 7 | -------------------------------------------------------------------------------- /examples/website/styles.css: -------------------------------------------------------------------------------- 1 | /* css styles */ 2 | -------------------------------------------------------------------------------- /screenshots/book_light.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/juba/bookup-html/62827330a1cbbe367e369b0edf671ce76d4c15ee/screenshots/book_light.png -------------------------------------------------------------------------------- /screenshots/single_dark.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/juba/bookup-html/62827330a1cbbe367e369b0edf671ce76d4c15ee/screenshots/single_dark.png -------------------------------------------------------------------------------- /screenshots/single_light.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/juba/bookup-html/62827330a1cbbe367e369b0edf671ce76d4c15ee/screenshots/single_light.png -------------------------------------------------------------------------------- /screenshots/website_dark.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/juba/bookup-html/62827330a1cbbe367e369b0edf671ce76d4c15ee/screenshots/website_dark.png -------------------------------------------------------------------------------- /template.qmd: -------------------------------------------------------------------------------- 1 | --- 2 | title: "" 3 | author: "" 4 | date: today 5 | format: 6 | bookup-html: 7 | embed-fonts: true 8 | toc: true 9 | --- 10 | 11 | ## Introduction 12 | 13 | This is a default template for the `bookup-html` custom quarto format. 14 | 15 | You can learn more about `bookup` in its [Github repository](https://github.com/juba/bookup-html). 16 | 17 | You can learn more about controlling the appearance of HTML output at the [quarto website](https://quarto.org/docs/output-formats/html-basics.html). 18 | 19 | --------------------------------------------------------------------------------