Module 5 exercises C, D, & E

assets/styles/style.css

@@ -9,3 +9,42 @@ body {
 [aria-label="Document Outline"] {
   max-height: calc(100vh - 100px) !important;
 }
+
+.myst-static-input-wrapper {
+  border: 1px solid #ccc;
+}
+
+.myst-static-input-wrapper::before {
+  content: "📥 MyST input";
+  display: block;
+  background-color: #f5f5f5;
+  border-bottom: 1px solid #ccc;
+  padding: 8px 12px;
+  font-weight: bold;
+  font-size: 14px;
+  color: #333;
+  margin: 0;
+}
+
+.myst-static-output-wrapper {
+  border: 1px solid #ccc;
+  margin-bottom: 20px;
+}
+
+.myst-static-output-wrapper::before {
+  content: "📤 MyST output";
+  display: block;
+  background-color: #f5f5f5;
+  border-bottom: 1px solid #ccc;
+  padding: 8px 12px;
+  font-weight: bold;
+  font-size: 14px;
+  color: #333;
+  margin: 0;
+}
+
+.myst-static-content {
+  padding-left: 12px;
+  padding-right: 12px;
+  margin: 0;
+}

for-instructors/helpers.md

@@ -0,0 +1,25 @@
+# 🪄 Helpers
+
+This repository includes a `plugin-custom-directives.mjs` file which defines custom
+directives that will save some time authoring certain repeated elements.
+
+## Git commit checkpoint directive
+
+```{myst:static}
+:::{gitCommitCheckpoint} my commit message
+:::
+```
+
+
+## "You should notice..." directive
+
+``````{myst:static}
+:::{youShouldNotice}
+...the `{youShouldNotice}` directive fully supports markdown in the body.
+This means you can, for example include some code:
+
+```python
+print("Some code!")
+```
+:::
+``````

for-instructors/style-guide.md

@@ -209,6 +209,30 @@ E.g.:
 :::
 ```
 
+**As a shortcut, you can use the `{youShouldNotice}` directive.**
+See [](./helpers.md).
+
+
+#### Committing
+
+Use 💾 in a callout to indicate that the user should stop and do a commit now.
+Provide the full set of commands the user should run.
+
+``````{myst}
+:::{important} 💾 Commit & push to GitHub
+:icon: false
+
+```bash
+git add .
+git commit -m "Commit message"
+git push -u origin main
+```
+:::
+``````
+
+**As a shortcut, you can use the `{gitCommitCheckpoint}` directive.**
+See [](./helpers.md).
+
 
 ### Voice / language