From 7fce3836baa98e0954fa64ff4676a26d1609c6c3 Mon Sep 17 00:00:00 2001 From: wade-cheng Date: Tue, 8 Apr 2025 15:08:57 -0400 Subject: [PATCH 1/9] convert website from jekyll to mdBook --- .github/workflows/jekyll-gh-pages.yml | 51 ------------------ .gitignore | 5 +- book.toml | 8 +++ README.md => src/README.md | 2 - src/SUMMARY.md | 25 +++++++++ {assets => src/assets}/README.md | 0 {assets => src/assets}/pyg1.png | Bin {assets => src/assets}/pyg2.png | Bin {assets => src/assets}/pygbag_logo.png | Bin src/chapter_1.md | 1 + .../platform_wasm}/README.md | 0 {wiki => src/wiki}/README.md | 3 -- {wiki => src/wiki}/dinovm/README.md | 0 {wiki => src/wiki}/pkg/README.md | 0 {wiki => src/wiki}/pkg/nurses_2/README.md | 0 {wiki => src/wiki}/pkg/panda3d/README.md | 0 .../wiki}/publishing/github.io/README.md | 2 +- .../wiki}/publishing/github.io/actions.png | Bin .../wiki}/publishing/github.io/pages.png | Bin .../wiki}/publishing/github.io/pygbag.yml | 0 .../wiki}/publishing/github.io/yml.png | Bin .../wiki}/publishing/itch.io/README.md | 2 +- {wiki => src/wiki}/pygbag-code/README.md | 2 +- .../wiki}/pygbag-configuration/README.md | 0 {wiki => src/wiki}/pygbag-debug/README.md | 0 {wiki => src/wiki}/pygbag-internals/README.md | 0 {wiki => src/wiki}/pygbag-script/README.md | 2 +- {wiki => src/wiki}/pygbag/README.md | 2 +- {wiki => src/wiki}/python-wasm/README.md | 2 +- 29 files changed, 41 insertions(+), 66 deletions(-) delete mode 100644 .github/workflows/jekyll-gh-pages.yml create mode 100644 book.toml rename README.md => src/README.md (98%) create mode 100644 src/SUMMARY.md rename {assets => src/assets}/README.md (100%) rename {assets => src/assets}/pyg1.png (100%) rename {assets => src/assets}/pyg2.png (100%) rename {assets => src/assets}/pygbag_logo.png (100%) create mode 100644 src/chapter_1.md rename {platform_wasm => src/platform_wasm}/README.md (100%) rename {wiki => src/wiki}/README.md (98%) rename {wiki => src/wiki}/dinovm/README.md (100%) rename {wiki => src/wiki}/pkg/README.md (100%) rename {wiki => src/wiki}/pkg/nurses_2/README.md (100%) rename {wiki => src/wiki}/pkg/panda3d/README.md (100%) rename {wiki => src/wiki}/publishing/github.io/README.md (90%) rename {wiki => src/wiki}/publishing/github.io/actions.png (100%) rename {wiki => src/wiki}/publishing/github.io/pages.png (100%) rename {wiki => src/wiki}/publishing/github.io/pygbag.yml (100%) rename {wiki => src/wiki}/publishing/github.io/yml.png (100%) rename {wiki => src/wiki}/publishing/itch.io/README.md (92%) rename {wiki => src/wiki}/pygbag-code/README.md (98%) rename {wiki => src/wiki}/pygbag-configuration/README.md (100%) rename {wiki => src/wiki}/pygbag-debug/README.md (100%) rename {wiki => src/wiki}/pygbag-internals/README.md (100%) rename {wiki => src/wiki}/pygbag-script/README.md (94%) rename {wiki => src/wiki}/pygbag/README.md (98%) rename {wiki => src/wiki}/python-wasm/README.md (91%) diff --git a/.github/workflows/jekyll-gh-pages.yml b/.github/workflows/jekyll-gh-pages.yml deleted file mode 100644 index e31d81c..0000000 --- a/.github/workflows/jekyll-gh-pages.yml +++ /dev/null @@ -1,51 +0,0 @@ -# Sample workflow for building and deploying a Jekyll site to GitHub Pages -name: Deploy Jekyll with GitHub Pages dependencies preinstalled - -on: - # Runs on pushes targeting the default branch - push: - branches: ["main"] - - # Allows you to run this workflow manually from the Actions tab - workflow_dispatch: - -# Sets permissions of the GITHUB_TOKEN to allow deployment to GitHub Pages -permissions: - contents: read - pages: write - id-token: write - -# Allow only one concurrent deployment, skipping runs queued between the run in-progress and latest queued. -# However, do NOT cancel in-progress runs as we want to allow these production deployments to complete. -concurrency: - group: "pages" - cancel-in-progress: false - -jobs: - # Build job - build: - runs-on: ubuntu-latest - steps: - - name: Checkout - uses: actions/checkout@v4 - - name: Setup Pages - uses: actions/configure-pages@v5 - - name: Build with Jekyll - uses: actions/jekyll-build-pages@v1 - with: - source: ./ - destination: ./_site - - name: Upload artifact - uses: actions/upload-pages-artifact@v3 - - # Deployment job - deploy: - environment: - name: github-pages - url: ${{ steps.deployment.outputs.page_url }} - runs-on: ubuntu-latest - needs: build - steps: - - name: Deploy to GitHub Pages - id: deployment - uses: actions/deploy-pages@v4 diff --git a/.gitignore b/.gitignore index a3816f7..bcff6e8 100644 --- a/.gitignore +++ b/.gitignore @@ -1,7 +1,4 @@ /.idea # for local testing -Gemfile.lock -Gemfile -.jekyll-metadata -_site +book diff --git a/book.toml b/book.toml new file mode 100644 index 0000000..5b25644 --- /dev/null +++ b/book.toml @@ -0,0 +1,8 @@ +[book] +authors = [] +language = "en" +multilingual = false +src = "src" + +[output.html] +no-section-label = true \ No newline at end of file diff --git a/README.md b/src/README.md similarity index 98% rename from README.md rename to src/README.md index 08b3cc2..c71a9a2 100644 --- a/README.md +++ b/src/README.md @@ -141,5 +141,3 @@ Visit the [wiki](/wiki/) to get started! **Work in progress, pull requests welcomed. Feel free to propose links to games or tutorials. Please contribute!!!** Logo thanks to https://github.com/FinFetChannel - -[Edit this page](https://github.com/pygame-web/pygame-web.github.io/edit/main/README.md) diff --git a/src/SUMMARY.md b/src/SUMMARY.md new file mode 100644 index 0000000..a3ec81d --- /dev/null +++ b/src/SUMMARY.md @@ -0,0 +1,25 @@ +# Summary + +[Get Started](README.md) + +# Reference Wiki + +- [Wiki Intro](wiki/README.md) + - [pygbag](wiki/pygbag/README.md) + - [pygbag-code](wiki/pygbag-code/README.md) + - [pygbag-configuration](wiki/pygbag-configuration/README.md) + - [pygbag-debug](wiki/pygbag-debug/README.md) + - [pygbag-internals](wiki/pygbag-internals/README.md) + - [pygbag-script](wiki/pygbag-script/README.md) + - [python-wasm](wiki/python-wasm/README.md) + - [dinovm](wiki/dinovm/README.md) + - [pkg](wiki/pkg/README.md) + - [nurses_2](wiki/pkg/nurses_2/README.md) + - [panda3d](wiki/pkg/panda3d/README.md) + - [publishing]() + - [github.io](wiki/publishing/github.io/README.md) + - [itch.io](wiki/publishing/itch.io/README.md) + +# Misc +- [platform_wasm](platform_wasm/README.md) +- [assets](assets/README.md) \ No newline at end of file diff --git a/assets/README.md b/src/assets/README.md similarity index 100% rename from assets/README.md rename to src/assets/README.md diff --git a/assets/pyg1.png b/src/assets/pyg1.png similarity index 100% rename from assets/pyg1.png rename to src/assets/pyg1.png diff --git a/assets/pyg2.png b/src/assets/pyg2.png similarity index 100% rename from assets/pyg2.png rename to src/assets/pyg2.png diff --git a/assets/pygbag_logo.png b/src/assets/pygbag_logo.png similarity index 100% rename from assets/pygbag_logo.png rename to src/assets/pygbag_logo.png diff --git a/src/chapter_1.md b/src/chapter_1.md new file mode 100644 index 0000000..b743fda --- /dev/null +++ b/src/chapter_1.md @@ -0,0 +1 @@ +# Chapter 1 diff --git a/platform_wasm/README.md b/src/platform_wasm/README.md similarity index 100% rename from platform_wasm/README.md rename to src/platform_wasm/README.md diff --git a/wiki/README.md b/src/wiki/README.md similarity index 98% rename from wiki/README.md rename to src/wiki/README.md index fb8fc03..390e477 100644 --- a/wiki/README.md +++ b/src/wiki/README.md @@ -109,6 +109,3 @@ Python WebAssembly at PyCon FR 2023 (in French): - [WebAssembly/Python Discord Server](https://discord.gg/MCTM4xFDMK) Thanks for reading and supporting pygame-ce and pygbag. These tools could not have existed without your support. - - -[edit this page](https://github.com/pygame-web/pygame-web.github.io/edit/main/wiki/README.md) diff --git a/wiki/dinovm/README.md b/src/wiki/dinovm/README.md similarity index 100% rename from wiki/dinovm/README.md rename to src/wiki/dinovm/README.md diff --git a/wiki/pkg/README.md b/src/wiki/pkg/README.md similarity index 100% rename from wiki/pkg/README.md rename to src/wiki/pkg/README.md diff --git a/wiki/pkg/nurses_2/README.md b/src/wiki/pkg/nurses_2/README.md similarity index 100% rename from wiki/pkg/nurses_2/README.md rename to src/wiki/pkg/nurses_2/README.md diff --git a/wiki/pkg/panda3d/README.md b/src/wiki/pkg/panda3d/README.md similarity index 100% rename from wiki/pkg/panda3d/README.md rename to src/wiki/pkg/panda3d/README.md diff --git a/wiki/publishing/github.io/README.md b/src/wiki/publishing/github.io/README.md similarity index 90% rename from wiki/publishing/github.io/README.md rename to src/wiki/publishing/github.io/README.md index eaabb8d..01eeb21 100644 --- a/wiki/publishing/github.io/README.md +++ b/src/wiki/publishing/github.io/README.md @@ -37,4 +37,4 @@ Finally, go back to "Actions" and run the "pages-build-deployment" action. Now y -[contribute to this page](https://github.com/pygame-web/pygame-web.github.io/edit/main/wiki/pygbag/github.io/README.md) + diff --git a/wiki/publishing/github.io/actions.png b/src/wiki/publishing/github.io/actions.png similarity index 100% rename from wiki/publishing/github.io/actions.png rename to src/wiki/publishing/github.io/actions.png diff --git a/wiki/publishing/github.io/pages.png b/src/wiki/publishing/github.io/pages.png similarity index 100% rename from wiki/publishing/github.io/pages.png rename to src/wiki/publishing/github.io/pages.png diff --git a/wiki/publishing/github.io/pygbag.yml b/src/wiki/publishing/github.io/pygbag.yml similarity index 100% rename from wiki/publishing/github.io/pygbag.yml rename to src/wiki/publishing/github.io/pygbag.yml diff --git a/wiki/publishing/github.io/yml.png b/src/wiki/publishing/github.io/yml.png similarity index 100% rename from wiki/publishing/github.io/yml.png rename to src/wiki/publishing/github.io/yml.png diff --git a/wiki/publishing/itch.io/README.md b/src/wiki/publishing/itch.io/README.md similarity index 92% rename from wiki/publishing/itch.io/README.md rename to src/wiki/publishing/itch.io/README.md index a0ad6ca..e1dc79e 100644 --- a/wiki/publishing/itch.io/README.md +++ b/src/wiki/publishing/itch.io/README.md @@ -33,4 +33,4 @@ Though, if you are unable to do so, you can ask for help in the [pygame discord -[contribute to this page](https://github.com/pygame-web/pygame-web.github.io/edit/main/wiki/pygbag/itch.io/README.md) + diff --git a/wiki/pygbag-code/README.md b/src/wiki/pygbag-code/README.md similarity index 98% rename from wiki/pygbag-code/README.md rename to src/wiki/pygbag-code/README.md index 9ad0213..97d027c 100644 --- a/wiki/pygbag-code/README.md +++ b/src/wiki/pygbag-code/README.md @@ -233,5 +233,5 @@ TODO -[contribute to this page](https://github.com/pygame-web/pygame-web.github.io/edit/main/wiki/pygbag-code/README.md) + diff --git a/wiki/pygbag-configuration/README.md b/src/wiki/pygbag-configuration/README.md similarity index 100% rename from wiki/pygbag-configuration/README.md rename to src/wiki/pygbag-configuration/README.md diff --git a/wiki/pygbag-debug/README.md b/src/wiki/pygbag-debug/README.md similarity index 100% rename from wiki/pygbag-debug/README.md rename to src/wiki/pygbag-debug/README.md diff --git a/wiki/pygbag-internals/README.md b/src/wiki/pygbag-internals/README.md similarity index 100% rename from wiki/pygbag-internals/README.md rename to src/wiki/pygbag-internals/README.md diff --git a/wiki/pygbag-script/README.md b/src/wiki/pygbag-script/README.md similarity index 94% rename from wiki/pygbag-script/README.md rename to src/wiki/pygbag-script/README.md index 746a3aa..959168c 100644 --- a/wiki/pygbag-script/README.md +++ b/src/wiki/pygbag-script/README.md @@ -55,4 +55,4 @@ python3 -x index.html ~~follow that issue : https://github.com/psf/black/issues/3214~~ done, now you can use `black -x -l 132` to format your code -[contribute to this page](https://github.com/pygame-web/pygame-web.github.io/edit/main/wiki/pygame-script/README.md) + diff --git a/wiki/pygbag/README.md b/src/wiki/pygbag/README.md similarity index 98% rename from wiki/pygbag/README.md rename to src/wiki/pygbag/README.md index ed9de73..0cf41bc 100644 --- a/wiki/pygbag/README.md +++ b/src/wiki/pygbag/README.md @@ -204,4 +204,4 @@ There is very little because Python-WASM is just a web-friendly version of CPyth ## Conclusion Congratulations for finishing this tutorial! Now you can go ahead and make all your Python games playable in the browser! Thank you for reading. -[Contribute to this page.](https://github.com/pygame-web/pygame-web.github.io/edit/main/wiki/pygbag/README.md) + diff --git a/wiki/python-wasm/README.md b/src/wiki/python-wasm/README.md similarity index 91% rename from wiki/python-wasm/README.md rename to src/wiki/python-wasm/README.md index 6c25c58..fcb04be 100644 --- a/wiki/python-wasm/README.md +++ b/src/wiki/python-wasm/README.md @@ -61,4 +61,4 @@ if __name__ == "__main__": Everything else is probably specific to Pygbag. You can find more information/code [here](https://pygame-web.github.io/wiki/pygbag-code/#pygbag-code-specificssamples). -[Contribute to this page](https://github.com/pygame-web/pygame-web.github.io/edit/main/wiki/python-wasm/README.md) + From d43bbdb63bc9566748ec2d7fff241091eeb4f983 Mon Sep 17 00:00:00 2001 From: wade-cheng Date: Tue, 8 Apr 2025 15:12:56 -0400 Subject: [PATCH 2/9] add github action workflow for mdbook --- .github/workflows/mdbook.yml | 61 ++++++++++++++++++++++++++++++++++++ 1 file changed, 61 insertions(+) create mode 100644 .github/workflows/mdbook.yml diff --git a/.github/workflows/mdbook.yml b/.github/workflows/mdbook.yml new file mode 100644 index 0000000..ba3bcec --- /dev/null +++ b/.github/workflows/mdbook.yml @@ -0,0 +1,61 @@ +# Sample workflow for building and deploying a mdBook site to GitHub Pages +# +# To get started with mdBook see: https://rust-lang.github.io/mdBook/index.html +# +name: Deploy mdBook site to Pages + +on: + # Runs on pushes targeting the default branch + push: + branches: ["main"] + + # Allows you to run this workflow manually from the Actions tab + workflow_dispatch: + +# Sets permissions of the GITHUB_TOKEN to allow deployment to GitHub Pages +permissions: + contents: read + pages: write + id-token: write + +# Allow only one concurrent deployment, skipping runs queued between the run in-progress and latest queued. +# However, do NOT cancel in-progress runs as we want to allow these production deployments to complete. +concurrency: + group: "pages" + cancel-in-progress: false + +jobs: + # Build job + build: + runs-on: ubuntu-latest + env: + MDBOOK_VERSION: 0.4.36 + steps: + - uses: actions/checkout@v4 + - name: Install mdBook and mdbook-admonish + run: | + curl --proto '=https' --tlsv1.2 https://sh.rustup.rs -sSf -y | sh + rustup update + cargo install --version ${MDBOOK_VERSION} mdbook + # cargo install mdbook-admonish + - name: Setup Pages + id: pages + uses: actions/configure-pages@v5 + - name: Build with mdBook + run: mdbook build + - name: Upload artifact + uses: actions/upload-pages-artifact@v3 + with: + path: ./book + + # Deployment job + deploy: + environment: + name: github-pages + url: ${{ steps.deployment.outputs.page_url }} + runs-on: ubuntu-latest + needs: build + steps: + - name: Deploy to GitHub Pages + id: deployment + uses: actions/deploy-pages@v4 From d9e66285abe71eef3cf19fe4efc9edae3fa08eac Mon Sep 17 00:00:00 2001 From: wade-cheng Date: Tue, 8 Apr 2025 15:16:36 -0400 Subject: [PATCH 3/9] add git repo and contrib buttons --- book.toml | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/book.toml b/book.toml index 5b25644..303db01 100644 --- a/book.toml +++ b/book.toml @@ -5,4 +5,7 @@ multilingual = false src = "src" [output.html] -no-section-label = true \ No newline at end of file +no-section-label = true +git-repository-url = "https://github.com/pygame-web/pygame-web.github.io" +git-repository-icon = "fa-github" +edit-url-template = "https://github.com/pygame-web/pygame-web.github.io/edit/main/{path}" \ No newline at end of file From fb31021b6179860ad70a9fc9c4ac3c1e47f46726 Mon Sep 17 00:00:00 2001 From: wade-cheng Date: Tue, 8 Apr 2025 15:19:55 -0400 Subject: [PATCH 4/9] add readme with mdbook build instructions --- README.md | 13 +++++++++++++ 1 file changed, 13 insertions(+) create mode 100644 README.md diff --git a/README.md b/README.md new file mode 100644 index 0000000..2784cbc --- /dev/null +++ b/README.md @@ -0,0 +1,13 @@ +# pygame-web.github.io + +![pygbag logo](assets/pygbag_logo.png?raw=true "Pygbag Logo") + +This is the CDN root used by [Pygbag](https://pypi.org/project/pygbag/). + +## building the website +To build this mdBook website, [install mdBook](https://rust-lang.github.io/mdBook/guide/installation.html) +and run +``` +mdbook serve --open +``` +where the current directory contains `book.toml`. \ No newline at end of file From 8193ed7da4502717061467c41625dcc47af03094 Mon Sep 17 00:00:00 2001 From: wade-cheng Date: Thu, 10 Apr 2025 18:14:48 -0400 Subject: [PATCH 5/9] add admonishments and pagetoc --- .github/workflows/mdbook.yml | 5 +++-- .gitignore | 4 ++++ book.toml | 3 +++ 3 files changed, 10 insertions(+), 2 deletions(-) diff --git a/.github/workflows/mdbook.yml b/.github/workflows/mdbook.yml index ba3bcec..9d2f244 100644 --- a/.github/workflows/mdbook.yml +++ b/.github/workflows/mdbook.yml @@ -32,12 +32,13 @@ jobs: MDBOOK_VERSION: 0.4.36 steps: - uses: actions/checkout@v4 - - name: Install mdBook and mdbook-admonish + - name: Install mdBook and preprocessors run: | curl --proto '=https' --tlsv1.2 https://sh.rustup.rs -sSf -y | sh rustup update cargo install --version ${MDBOOK_VERSION} mdbook - # cargo install mdbook-admonish + cargo install mdbook-admonish + cargo install mdbook-pagetoc - name: Setup Pages id: pages uses: actions/configure-pages@v5 diff --git a/.gitignore b/.gitignore index bcff6e8..42f62cc 100644 --- a/.gitignore +++ b/.gitignore @@ -1,4 +1,8 @@ /.idea +# ignored generated pagetoc files from mdbook-pagetoc +theme/pagetoc.css +theme/pagetoc.js + # for local testing book diff --git a/book.toml b/book.toml index 303db01..006f839 100644 --- a/book.toml +++ b/book.toml @@ -4,7 +4,10 @@ language = "en" multilingual = false src = "src" +[preprocessor.pagetoc] [output.html] +additional-css = ["theme/pagetoc.css"] +additional-js = ["theme/pagetoc.js"] no-section-label = true git-repository-url = "https://github.com/pygame-web/pygame-web.github.io" git-repository-icon = "fa-github" From 30f8f4558bb1e605fc2c8c29fbec310d2deb4046 Mon Sep 17 00:00:00 2001 From: wade-cheng Date: Thu, 10 Apr 2025 18:15:20 -0400 Subject: [PATCH 6/9] delete leftover junk file --- src/chapter_1.md | 1 - 1 file changed, 1 deletion(-) delete mode 100644 src/chapter_1.md diff --git a/src/chapter_1.md b/src/chapter_1.md deleted file mode 100644 index b743fda..0000000 --- a/src/chapter_1.md +++ /dev/null @@ -1 +0,0 @@ -# Chapter 1 From 3df690386aef0b0c95f295a65ea6eb91a26b22ae Mon Sep 17 00:00:00 2001 From: wade-cheng Date: Thu, 10 Apr 2025 18:34:32 -0400 Subject: [PATCH 7/9] generate css for mdbook-admonish --- mdbook-admonish.css | 351 ++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 351 insertions(+) create mode 100644 mdbook-admonish.css diff --git a/mdbook-admonish.css b/mdbook-admonish.css new file mode 100644 index 0000000..88dd2b1 --- /dev/null +++ b/mdbook-admonish.css @@ -0,0 +1,351 @@ +@charset "UTF-8"; +:is(.admonition) { + display: flow-root; + margin: 1.5625em 0; + padding: 0 1.2rem; + color: var(--fg); + page-break-inside: avoid; + background-color: var(--bg); + border: 0 solid black; + border-inline-start-width: 0.4rem; + border-radius: 0.2rem; + box-shadow: 0 0.2rem 1rem rgba(0, 0, 0, 0.05), 0 0 0.1rem rgba(0, 0, 0, 0.1); +} +@media print { + :is(.admonition) { + box-shadow: none; + } +} +:is(.admonition) > * { + box-sizing: border-box; +} +:is(.admonition) :is(.admonition) { + margin-top: 1em; + margin-bottom: 1em; +} +:is(.admonition) > .tabbed-set:only-child { + margin-top: 0; +} +html :is(.admonition) > :last-child { + margin-bottom: 1.2rem; +} + +a.admonition-anchor-link { + display: none; + position: absolute; + left: -1.2rem; + padding-right: 1rem; +} +a.admonition-anchor-link:link, a.admonition-anchor-link:visited { + color: var(--fg); +} +a.admonition-anchor-link:link:hover, a.admonition-anchor-link:visited:hover { + text-decoration: none; +} +a.admonition-anchor-link::before { + content: "ยง"; +} + +:is(.admonition-title, summary.admonition-title) { + position: relative; + min-height: 4rem; + margin-block: 0; + margin-inline: -1.6rem -1.2rem; + padding-block: 0.8rem; + padding-inline: 4.4rem 1.2rem; + font-weight: 700; + background-color: rgba(68, 138, 255, 0.1); + print-color-adjust: exact; + -webkit-print-color-adjust: exact; + display: flex; +} +:is(.admonition-title, summary.admonition-title) p { + margin: 0; +} +html :is(.admonition-title, summary.admonition-title):last-child { + margin-bottom: 0; +} +:is(.admonition-title, summary.admonition-title)::before { + position: absolute; + top: 0.625em; + inset-inline-start: 1.6rem; + width: 2rem; + height: 2rem; + background-color: #448aff; + print-color-adjust: exact; + -webkit-print-color-adjust: exact; + mask-image: url('data:image/svg+xml;charset=utf-8,'); + -webkit-mask-image: url('data:image/svg+xml;charset=utf-8,'); + mask-repeat: no-repeat; + -webkit-mask-repeat: no-repeat; + mask-size: contain; + -webkit-mask-size: contain; + content: ""; +} +:is(.admonition-title, summary.admonition-title):hover a.admonition-anchor-link { + display: initial; +} + +details.admonition > summary.admonition-title::after { + position: absolute; + top: 0.625em; + inset-inline-end: 1.6rem; + height: 2rem; + width: 2rem; + background-color: currentcolor; + mask-image: var(--md-details-icon); + -webkit-mask-image: var(--md-details-icon); + mask-repeat: no-repeat; + -webkit-mask-repeat: no-repeat; + mask-size: contain; + -webkit-mask-size: contain; + content: ""; + transform: rotate(0deg); + transition: transform 0.25s; +} +details[open].admonition > summary.admonition-title::after { + transform: rotate(90deg); +} +summary.admonition-title::-webkit-details-marker { + display: none; +} + +:root { + --md-details-icon: url("data:image/svg+xml;charset=utf-8,"); +} + +:root { + --md-admonition-icon--admonish-note: url("data:image/svg+xml;charset=utf-8,"); + --md-admonition-icon--admonish-abstract: url("data:image/svg+xml;charset=utf-8,"); + --md-admonition-icon--admonish-info: url("data:image/svg+xml;charset=utf-8,"); + --md-admonition-icon--admonish-tip: url("data:image/svg+xml;charset=utf-8,"); + --md-admonition-icon--admonish-success: url("data:image/svg+xml;charset=utf-8,"); + --md-admonition-icon--admonish-question: url("data:image/svg+xml;charset=utf-8,"); + --md-admonition-icon--admonish-warning: url("data:image/svg+xml;charset=utf-8,"); + --md-admonition-icon--admonish-failure: url("data:image/svg+xml;charset=utf-8,"); + --md-admonition-icon--admonish-danger: url("data:image/svg+xml;charset=utf-8,"); + --md-admonition-icon--admonish-bug: url("data:image/svg+xml;charset=utf-8,"); + --md-admonition-icon--admonish-example: url("data:image/svg+xml;charset=utf-8,"); + --md-admonition-icon--admonish-quote: url("data:image/svg+xml;charset=utf-8,"); +} + +:is(.admonition):is(.admonish-note) { + border-color: #448aff; +} + +:is(.admonish-note) > :is(.admonition-title, summary.admonition-title) { + background-color: rgba(68, 138, 255, 0.1); +} +:is(.admonish-note) > :is(.admonition-title, summary.admonition-title)::before { + background-color: #448aff; + mask-image: var(--md-admonition-icon--admonish-note); + -webkit-mask-image: var(--md-admonition-icon--admonish-note); + mask-repeat: no-repeat; + -webkit-mask-repeat: no-repeat; + mask-size: contain; + -webkit-mask-repeat: no-repeat; +} + +:is(.admonition):is(.admonish-abstract, .admonish-summary, .admonish-tldr) { + border-color: #00b0ff; +} + +:is(.admonish-abstract, .admonish-summary, .admonish-tldr) > :is(.admonition-title, summary.admonition-title) { + background-color: rgba(0, 176, 255, 0.1); +} +:is(.admonish-abstract, .admonish-summary, .admonish-tldr) > :is(.admonition-title, summary.admonition-title)::before { + background-color: #00b0ff; + mask-image: var(--md-admonition-icon--admonish-abstract); + -webkit-mask-image: var(--md-admonition-icon--admonish-abstract); + mask-repeat: no-repeat; + -webkit-mask-repeat: no-repeat; + mask-size: contain; + -webkit-mask-repeat: no-repeat; +} + +:is(.admonition):is(.admonish-info, .admonish-todo) { + border-color: #00b8d4; +} + +:is(.admonish-info, .admonish-todo) > :is(.admonition-title, summary.admonition-title) { + background-color: rgba(0, 184, 212, 0.1); +} +:is(.admonish-info, .admonish-todo) > :is(.admonition-title, summary.admonition-title)::before { + background-color: #00b8d4; + mask-image: var(--md-admonition-icon--admonish-info); + -webkit-mask-image: var(--md-admonition-icon--admonish-info); + mask-repeat: no-repeat; + -webkit-mask-repeat: no-repeat; + mask-size: contain; + -webkit-mask-repeat: no-repeat; +} + +:is(.admonition):is(.admonish-tip, .admonish-hint, .admonish-important) { + border-color: #00bfa5; +} + +:is(.admonish-tip, .admonish-hint, .admonish-important) > :is(.admonition-title, summary.admonition-title) { + background-color: rgba(0, 191, 165, 0.1); +} +:is(.admonish-tip, .admonish-hint, .admonish-important) > :is(.admonition-title, summary.admonition-title)::before { + background-color: #00bfa5; + mask-image: var(--md-admonition-icon--admonish-tip); + -webkit-mask-image: var(--md-admonition-icon--admonish-tip); + mask-repeat: no-repeat; + -webkit-mask-repeat: no-repeat; + mask-size: contain; + -webkit-mask-repeat: no-repeat; +} + +:is(.admonition):is(.admonish-success, .admonish-check, .admonish-done) { + border-color: #00c853; +} + +:is(.admonish-success, .admonish-check, .admonish-done) > :is(.admonition-title, summary.admonition-title) { + background-color: rgba(0, 200, 83, 0.1); +} +:is(.admonish-success, .admonish-check, .admonish-done) > :is(.admonition-title, summary.admonition-title)::before { + background-color: #00c853; + mask-image: var(--md-admonition-icon--admonish-success); + -webkit-mask-image: var(--md-admonition-icon--admonish-success); + mask-repeat: no-repeat; + -webkit-mask-repeat: no-repeat; + mask-size: contain; + -webkit-mask-repeat: no-repeat; +} + +:is(.admonition):is(.admonish-question, .admonish-help, .admonish-faq) { + border-color: #64dd17; +} + +:is(.admonish-question, .admonish-help, .admonish-faq) > :is(.admonition-title, summary.admonition-title) { + background-color: rgba(100, 221, 23, 0.1); +} +:is(.admonish-question, .admonish-help, .admonish-faq) > :is(.admonition-title, summary.admonition-title)::before { + background-color: #64dd17; + mask-image: var(--md-admonition-icon--admonish-question); + -webkit-mask-image: var(--md-admonition-icon--admonish-question); + mask-repeat: no-repeat; + -webkit-mask-repeat: no-repeat; + mask-size: contain; + -webkit-mask-repeat: no-repeat; +} + +:is(.admonition):is(.admonish-warning, .admonish-caution, .admonish-attention) { + border-color: #ff9100; +} + +:is(.admonish-warning, .admonish-caution, .admonish-attention) > :is(.admonition-title, summary.admonition-title) { + background-color: rgba(255, 145, 0, 0.1); +} +:is(.admonish-warning, .admonish-caution, .admonish-attention) > :is(.admonition-title, summary.admonition-title)::before { + background-color: #ff9100; + mask-image: var(--md-admonition-icon--admonish-warning); + -webkit-mask-image: var(--md-admonition-icon--admonish-warning); + mask-repeat: no-repeat; + -webkit-mask-repeat: no-repeat; + mask-size: contain; + -webkit-mask-repeat: no-repeat; +} + +:is(.admonition):is(.admonish-failure, .admonish-fail, .admonish-missing) { + border-color: #ff5252; +} + +:is(.admonish-failure, .admonish-fail, .admonish-missing) > :is(.admonition-title, summary.admonition-title) { + background-color: rgba(255, 82, 82, 0.1); +} +:is(.admonish-failure, .admonish-fail, .admonish-missing) > :is(.admonition-title, summary.admonition-title)::before { + background-color: #ff5252; + mask-image: var(--md-admonition-icon--admonish-failure); + -webkit-mask-image: var(--md-admonition-icon--admonish-failure); + mask-repeat: no-repeat; + -webkit-mask-repeat: no-repeat; + mask-size: contain; + -webkit-mask-repeat: no-repeat; +} + +:is(.admonition):is(.admonish-danger, .admonish-error) { + border-color: #ff1744; +} + +:is(.admonish-danger, .admonish-error) > :is(.admonition-title, summary.admonition-title) { + background-color: rgba(255, 23, 68, 0.1); +} +:is(.admonish-danger, .admonish-error) > :is(.admonition-title, summary.admonition-title)::before { + background-color: #ff1744; + mask-image: var(--md-admonition-icon--admonish-danger); + -webkit-mask-image: var(--md-admonition-icon--admonish-danger); + mask-repeat: no-repeat; + -webkit-mask-repeat: no-repeat; + mask-size: contain; + -webkit-mask-repeat: no-repeat; +} + +:is(.admonition):is(.admonish-bug) { + border-color: #f50057; +} + +:is(.admonish-bug) > :is(.admonition-title, summary.admonition-title) { + background-color: rgba(245, 0, 87, 0.1); +} +:is(.admonish-bug) > :is(.admonition-title, summary.admonition-title)::before { + background-color: #f50057; + mask-image: var(--md-admonition-icon--admonish-bug); + -webkit-mask-image: var(--md-admonition-icon--admonish-bug); + mask-repeat: no-repeat; + -webkit-mask-repeat: no-repeat; + mask-size: contain; + -webkit-mask-repeat: no-repeat; +} + +:is(.admonition):is(.admonish-example) { + border-color: #7c4dff; +} + +:is(.admonish-example) > :is(.admonition-title, summary.admonition-title) { + background-color: rgba(124, 77, 255, 0.1); +} +:is(.admonish-example) > :is(.admonition-title, summary.admonition-title)::before { + background-color: #7c4dff; + mask-image: var(--md-admonition-icon--admonish-example); + -webkit-mask-image: var(--md-admonition-icon--admonish-example); + mask-repeat: no-repeat; + -webkit-mask-repeat: no-repeat; + mask-size: contain; + -webkit-mask-repeat: no-repeat; +} + +:is(.admonition):is(.admonish-quote, .admonish-cite) { + border-color: #9e9e9e; +} + +:is(.admonish-quote, .admonish-cite) > :is(.admonition-title, summary.admonition-title) { + background-color: rgba(158, 158, 158, 0.1); +} +:is(.admonish-quote, .admonish-cite) > :is(.admonition-title, summary.admonition-title)::before { + background-color: #9e9e9e; + mask-image: var(--md-admonition-icon--admonish-quote); + -webkit-mask-image: var(--md-admonition-icon--admonish-quote); + mask-repeat: no-repeat; + -webkit-mask-repeat: no-repeat; + mask-size: contain; + -webkit-mask-repeat: no-repeat; +} + +.navy :is(.admonition) { + background-color: var(--sidebar-bg); +} + +.ayu :is(.admonition), +.coal :is(.admonition) { + background-color: var(--theme-hover); +} + +.rust :is(.admonition) { + background-color: var(--sidebar-bg); + color: var(--sidebar-fg); +} +.rust .admonition-anchor-link:link, .rust .admonition-anchor-link:visited { + color: var(--sidebar-fg); +} From 8b0ef68812a226bf815a79dca1e00022ae02e400 Mon Sep 17 00:00:00 2001 From: wade-cheng Date: Thu, 10 Apr 2025 18:38:44 -0400 Subject: [PATCH 8/9] mdbook-admonish install --- book.toml | 9 +++++++-- 1 file changed, 7 insertions(+), 2 deletions(-) diff --git a/book.toml b/book.toml index 006f839..806a9fe 100644 --- a/book.toml +++ b/book.toml @@ -5,10 +5,15 @@ multilingual = false src = "src" [preprocessor.pagetoc] + +[preprocessor.admonish] +command = "mdbook-admonish" +assets_version = "3.0.3" # do not edit: managed by `mdbook-admonish install` + [output.html] -additional-css = ["theme/pagetoc.css"] +additional-css = ["theme/pagetoc.css", "./mdbook-admonish.css"] additional-js = ["theme/pagetoc.js"] no-section-label = true git-repository-url = "https://github.com/pygame-web/pygame-web.github.io" git-repository-icon = "fa-github" -edit-url-template = "https://github.com/pygame-web/pygame-web.github.io/edit/main/{path}" \ No newline at end of file +edit-url-template = "https://github.com/pygame-web/pygame-web.github.io/edit/main/{path}" From c71f3b6a9668a73356db2af4a33439925470a5e3 Mon Sep 17 00:00:00 2001 From: wade-cheng Date: Fri, 11 Apr 2025 17:09:58 -0400 Subject: [PATCH 9/9] document preprocessors --- README.md | 13 ++++++++++++- 1 file changed, 12 insertions(+), 1 deletion(-) diff --git a/README.md b/README.md index 2784cbc..a8a80fc 100644 --- a/README.md +++ b/README.md @@ -10,4 +10,15 @@ and run ``` mdbook serve --open ``` -where the current directory contains `book.toml`. \ No newline at end of file +where the current directory contains `book.toml`. + +To use the [pagetoc](https://github.com/slowsage/mdbook-pagetoc) and +[admonishment](https://github.com/tommilligan/mdbook-admonish) preprocessors, +you need to install some Rust tools: +``` +cargo install mdbook-pagetoc +cargo install mdbook-admonish +``` +Without these tools, the book may not compile. They only provide helpful but +nonessential rendering, so you comment out their respective section in the +`book.toml`. \ No newline at end of file