From 055663cb4e4d48aa2e9a0bbc95b367037d135e85 Mon Sep 17 00:00:00 2001 From: Tom van Woudenberg Date: Fri, 29 Nov 2024 10:46:04 +0100 Subject: [PATCH] extended badges --- book/basic-features/hypothesis.md | 2 +- book/basic-features/utterances.md | 2 +- book/external/TeachBooks | 2 +- book/features/HTML_javascript.md | 2 ++ book/features/adding_HTML_elements.md | 2 ++ book/features/h5p.md | 2 ++ book/features/live_code.ipynb | 2 ++ book/features/overview.md | 13 ++++++++++--- 8 files changed, 21 insertions(+), 6 deletions(-) diff --git a/book/basic-features/hypothesis.md b/book/basic-features/hypothesis.md index 3ab0050..1d490ce 100644 --- a/book/basic-features/hypothesis.md +++ b/book/basic-features/hypothesis.md @@ -1,6 +1,6 @@ # Making comments on the website: Hypothesis -{bdg-success}`Javascript overlay` {bdg-success}`Chrome Extension` +{bdg-warning}`Javascript overlay` {bdg-success}`Chrome Extension` Hypothesis is a third-party application that allows anyone to make publicly visible comments on a website (once you create a free account). This section explains how to use and install the extension. As this tool requires an account with a third-party, we advise to use our [local-annotator](../external/annotater/README.md) with similar capabilities but which store annotations locally. By default Hypothesis stores annotations publicly, which might confuse other students. diff --git a/book/basic-features/utterances.md b/book/basic-features/utterances.md index 7f0f7f5..9ec87f1 100644 --- a/book/basic-features/utterances.md +++ b/book/basic-features/utterances.md @@ -1,6 +1,6 @@ # Discussions in your book: Utterances -{bdg-success}`Javascript script` +{bdg-muted}`Javascript script` [Utterances 🔮](https://utteranc.es/) is a lightweight open-source widget which allows you, your colleages and your students to discuss stuff in a blog post in your book. It is build on GitHub issues, so requires a GitHub repository, although the book can be hosted anywhere (so also on GitLab). diff --git a/book/external/TeachBooks b/book/external/TeachBooks index 209dc7c..4a2e754 160000 --- a/book/external/TeachBooks +++ b/book/external/TeachBooks @@ -1 +1 @@ -Subproject commit 209dc7ceae034edd8ab43c0377e77466fdf15f1c +Subproject commit 4a2e75494b213c9a03615087bab2788f6188da2f diff --git a/book/features/HTML_javascript.md b/book/features/HTML_javascript.md index 491ce51..4192375 100644 --- a/book/features/HTML_javascript.md +++ b/book/features/HTML_javascript.md @@ -5,6 +5,8 @@ This section is useful for user type 5. ``` +{bdg-info}`iframe` + In this section, we will discuss how to [create](creating_basic_HTML_elements.md) and [embed](adding_HTML_elements.md) interactive HTML/Javascript elements created in HTML/JavaScript in a TeachBook. These HTML/Javascript element work very fluently and don't require a python kernel running in the background. This could be for example interactive 3d figures: diff --git a/book/features/adding_HTML_elements.md b/book/features/adding_HTML_elements.md index 41f3a9c..deab9f0 100644 --- a/book/features/adding_HTML_elements.md +++ b/book/features/adding_HTML_elements.md @@ -1,5 +1,7 @@ # Adding interactive HTML/JavaScript elements +{bdg-info}`iframe` + In this section, we will discuss how to embed interactive elements created in HTML/JavaScript in a TeachBook. If you are interested in learning how to create these elements yourself, we will discuss an example in the [next article](creating_basic_HTML_elements.md). As an example, let us discuss how to embed an interactive 3D model of a subsurface environment I created: diff --git a/book/features/h5p.md b/book/features/h5p.md index 853b822..015b2ad 100644 --- a/book/features/h5p.md +++ b/book/features/h5p.md @@ -5,6 +5,8 @@ This section is useful for user type 3-5. ``` +{bdg-info}`iframe` + ## Instruction H5p elements are interactive HTML-blocks which can be embedded in a Jupyter Book using an iframe. An H5p element can be created in the [TU Delft portal on the H5p website](https://tudelft.h5p.com/content) (sign in via Brightspace to H5p required first). The iframe code can be copied at Edit - Publish - Public - Embed code. This html code can be directly added to your markdown file: diff --git a/book/features/live_code.ipynb b/book/features/live_code.ipynb index d553b43..a923219 100644 --- a/book/features/live_code.ipynb +++ b/book/features/live_code.ipynb @@ -11,6 +11,8 @@ "This section is useful for user type 5.\n", "```\n", "\n", + "{bdg-primary}`Sphinx Extension`\n", + "\n", "Our book has been enable to run Python code live in the browser (thanks Max!). This extension makes code cells in your `.ipynb` book pages editable and executable by the reader! Opposed to the original sphinx-thebe extensions, our extension runs python in the reader's browser and doesn't rely on an external webserver for the python kernel. We highly recommend this extension as it allows you to use the strength of combining text/figures and code of a jupyter book with interactivity!\n", "\n", "This page contains some installation instructions and the other sections show how to use this functionality to create interactive figures and feedback on code\n", diff --git a/book/features/overview.md b/book/features/overview.md index bde9e86..de7ea78 100644 --- a/book/features/overview.md +++ b/book/features/overview.md @@ -4,9 +4,16 @@ As TeachBooks, we collect a suite of existing open-source software and keep our Since the list of TeachBook features is getting quite long, we have grouped them in categories: -Additionally, not all features are built using the same type of sourcecode. For transparency, tags will help differentiate between the different backgrounds of the features. +Additionally, not all features are built using the same type of sourcecode. For transparency, tags will help differentiate between the different backgrounds of the features: +- {bdg-warning}`Javascript overlay` +- {bdg-success}`Chrome Extension` +- {bdg-muted}`GitHub App and Javascript script` +- {bdg-secondary}`Python Package` +- {bdg-light}`GitHub Reusable Action` +- {bdg-dark}`Git Workflow` +- {bdg-primary}`Sphinx Extension` +- {bdg-info}`iframe` Finally, the purpose, installation process and usage of each features is elaborated on in the respective sub-sections. -To see examples for these features, go to the [Examples chapter](../examples/overview.md). - +To see examples for these features, go to the [Examples chapter](../examples/overview.md). \ No newline at end of file