feat: add content contribution guide

eleventy.config.js

@@ -21,10 +21,14 @@ const customCollections = require("./eleventy.config.collection.js");
 module.exports = function (eleventyConfig) {
 	// eleventyConfig.addPlugin(pluginSyntaxHighlight);
 	// const highlighter = eleventyConfig.markdownHighlighter;
+	eleventyConfig.ignores.add("./src/courses/*/*/files/**/*");
 	eleventyConfig.addMarkdownHighlighter((str, language) => {
 		if (language === "mermaid") {
 			return `<pre class="mermaid">${str}</pre>`;
 		}
+		if (language === "") {
+			language = "plaintext";
+		}
 		return hljs.highlight(str, { language }).value;
 		// return highlighter(str, language);
 	});
@@ -50,8 +54,7 @@ module.exports = function (eleventyConfig) {
 		"./node_modules/alpinejs/dist/cdn.min.js": "/js/alpine.js",
 		"./node_modules/@alpinejs/intersect/dist/cdn.min.js":
 			"/js/alpine.intersect.js",
-		"./node_modules/@alpinejs/persist/dist/cdn.min.js":
-			"/js/alpine.persist.js",
+		"./node_modules/@alpinejs/persist/dist/cdn.min.js": "/js/alpine.persist.js",
 		"./node_modules/hotkeys-js/dist/hotkeys.js": "/js/hotkeys.js",
 		"./node_modules/mermaid/dist/mermaid.js": "/js/mermaid.js",
 		"./node_modules/typed.js/dist/typed.umd.js": "/js/typed.umd.js",

public/css/tailwind.css

@@ -1962,6 +1962,11 @@ h4 {
   padding-right: 0.5rem;
 }
 
+.px-3 {
+  padding-left: 0.75rem;
+  padding-right: 0.75rem;
+}
+
 .px-4 {
   padding-left: 1rem;
   padding-right: 1rem;

src/courses/content-contribution-guide/1.1-mermaid-graphs/files/main.md

@@ -0,0 +1,6 @@
+Mermaid with HTML
+
+```mermaid
+flowchart TB
+    A["<a href='https://www.google.com'>google</a>"] -->|Get money| B["Do<br/>Something"]
+```

src/courses/content-contribution-guide/1.1-mermaid-graphs/index.md

@@ -0,0 +1,29 @@
+---
+lesson_name: Mermaid Graphs
+code_editor: True
+code_execution: False
+adding_file_allowed: False
+section: Markdown Examples
+file_groups:
+  - common: false
+    files:
+    - file_name: main.md
+      file_type: plaintext
+      id: 469
+      is_closable: false
+      is_edit_focus: true
+      is_editable: true
+      is_hidden: false
+      is_main: true
+      is_test_file: false
+      source: main.md
+    id: 1
+    name: markdown
+
+---
+Mermaid with HTML
+
+```mermaid
+flowchart TB
+    A["<a href='https://www.google.com'>google</a>"] -->|Get money| B["Do<br/>Something"]
+```

src/courses/content-contribution-guide/1.2-collapsible/files/content.md

@@ -0,0 +1,40 @@
+### Collapsible content
+
+```markdown
+#### With content hidden
+
+<details><summary>Toggle me!</summary>Peek a boo!</details>
+
+#### With content showing
+
+<details open>
+<summary>Shopping list</summary>
+
+* Vegetables
+* Fruits
+* Fish
+</details>
+```
+
+#### With content hidden
+
+<details><summary>Toggle me!</summary>Peek a boo!</details>
+
+#### With content showing
+
+<details open>
+<summary>Solution</summary>
+<pre><code class="hljs language-python"><span class="hljs-built_in">print</span>(<span class="hljs-string">"This is amazing!"</span>)
+</code></pre>
+</details>
+
+
+#### With content showing
+
+<details open>
+<summary></summary>
+
+* Vegetables
+* Fruits
+* Fish
+</details>

src/courses/content-contribution-guide/1.2-collapsible/index.md

@@ -0,0 +1,62 @@
+---
+lesson_name: Collapsible
+code_editor: True
+code_execution: False
+adding_file_allowed: False
+file_groups:
+  - common: false
+    files:
+    - file_name: content.md
+      file_type: auto-detect
+      id: 473
+      is_closable: false
+      is_edit_focus: true
+      is_editable: true
+      is_hidden: false
+      is_main: true
+      is_test_file: false
+      source: content.md
+    id: 1
+    name: Markdown
+
+---
+### Collapsible content
+
+```markdown
+#### With content hidden
+
+<details><summary>Toggle me!</summary>Peek a boo!</details>
+
+#### With content showing
+
+<details open>
+<summary>Shopping list</summary>
+
+* Vegetables
+* Fruits
+* Fish
+</details>
+```
+
+#### With content hidden
+
+<details><summary>Toggle me!</summary>Peek a boo!</details>
+
+#### With content showing
+
+<details open>
+<summary>Solution</summary>
+<pre><code class="hljs language-python"><span class="hljs-built_in">print</span>(<span class="hljs-string">"This is amazing!"</span>)
+</code></pre>
+</details>
+
+
+#### With content showing
+
+<details open>
+<summary></summary>
+
+* Vegetables
+* Fruits
+* Fish
+</details>

src/courses/content-contribution-guide/1.3-extension-examples/files/content.md

@@ -0,0 +1,129 @@
+# Keys
+
+++ctrl+alt+delete++
+
+# Emoji
+
+:smile: :heart: :thumbsup:
+
+# Details
+
+/// details | Some summary
+attrs: {class: border border-red-500 px-3 cursor-pointer mb-4}
+type: warning
+
+Some content
+///
+
+#### Opening as default
+
+/// details | Some summary
+attrs: {class: border border-red-500 px-3 cursor-pointer mb-4}
+open: True
+type: warning
+
+Something
+///
+
+# Alerts
+
+<div class="alert-info">
+This is the content
+
+```python
+print("OKAY")
+```
+
+</div>
+
+<div class="alert-warning">
+This is the content
+
+```python
+print("OKAY")
+```
+
+</div>
+
+<div class="alert-danger">
+This is the content
+
+```python
+print("OKAY")
+```
+
+</div>
+
+# Code blocks {.mt-4}
+
+Paragraph.
+
+```
+a fenced block
+```
+
+Another paragraph.
+
+> ```
+>   a fenced block
+> ```
+
+> with blank lines
+
+````
+### Code blocks inside list
+
+- &#32;
+  ```
+  a fenced block
+  ```
+
+Definition
+: &#32;
+  ```
+  a fenced block
+  ```
+
+### Code block with line numbers
+
+#### With class
+
+
+# Mermaid
+
+```mermaid
+pie title NETFLIX
+       "Time spent looking for movie" : 90
+       "Time spent watching it" : 10
+````
+
+```mermaid
+sequenceDiagram
+    participant web as Web Browser
+    participant blog as Blog Service
+    participant account as Account Service
+    participant mail as Mail Service
+    participant db as Storage
+
+    Note over web,db: The user must be logged in to submit blog posts
+    web->>+account: Logs in using credentials
+    account->>db: Query stored accounts
+    db->>account: Respond with query result
+
+    alt Credentials not found
+        account->>web: Invalid credentials
+    else Credentials found
+        account->>-web: Successfully logged in
+
+        Note over web,db: When the user is authenticated, they can now submit new posts
+        web->>+blog: Submit new post
+        blog->>db: Store post data
+
+        par Notifications
+            blog--)mail: Send mail to blog subscribers
+            blog--)db: Store in-site notifications
+        and Response
+            blog-->>-web: Successfully posted
+        end
+    end
+```