docs: add mermaid diagrams redo

docs/lightning-talks/processes/project-workflow.md

@@ -35,6 +35,59 @@ tags:
 
 The function of the Lightning Talks Event is to allow opportunities for members of the community to have an intimate space to present on a tech topic for 5-15 minutes. When live-streaming as a members-only event, speakers can feel more comfortable as it's _their_ community listening and watching. However, their is still opportunity to impact a larger audience once the videos have been processed and put up on YouTube.
 
+Below is the workflow for the Lightning Talks Event.
+
+#### Planning
+
+```mermaid
+%%{init: { "themeVariables": { "fontSize": "20px" }, "flowchart": { "nodeSpacing": 50, "rankSpacing": 60, "padding": 4 } } }%%
+flowchart TB
+  A1[📢 Call for Team] --> A2[👥 Onboard Team]
+  A2 --> A3[📝 Assign Coordinators]
+```
+
+#### CFP
+
+```mermaid
+%%{init: { "themeVariables": { "fontSize": "20px" }, "flowchart": { "nodeSpacing": 50, "rankSpacing": 60, "padding": 4 } } }%%
+flowchart TB
+  B1[📣 CFP Opens] --> B2[🧾 Collect Proposals]
+  B2 --> B0{Enough?}
+  B0 -- Yes --> B3[👩‍💻 Grouping]
+  B0 -- No --> B4[📣 Extend CFP]
+  B4 --> B2
+```
+
+#### Speaker Prep
+
+```mermaid
+%%{init: { "themeVariables": { "fontSize": "20px" }, "flowchart": { "nodeSpacing": 50, "rankSpacing": 70, "padding": 10 } } }%%
+flowchart TB
+  C1[🗂 Organize Talks] --> C2[✅ Checklists]
+  C2 --> C0{Missing?}
+  C0 -- Yes --> C5[📬 Request Info]
+  C5 --> C2
+  C0 -- No --> C3[📸 Speaker Info]
+  C3 --> C4[📁 Shared Folder]
+```
+
+#### Event
+
+```mermaid
+%%{init: { "themeVariables": { "fontSize": "20px" }, "flowchart": { "nodeSpacing": 50, "rankSpacing": 70, "padding": 10 } } }%%
+flowchart TB
+  D1[🧾 Final Prep] --> D2[📨 Directions]
+  D2 --> D3[🧑‍🏫 Talks]
+```
+
+#### Post-Event
+
+```mermaid
+%%{init: { "themeVariables": { "fontSize": "20px" }, "flowchart": { "nodeSpacing": 50, "rankSpacing": 70, "padding": 10 } } }%%
+flowchart TB
+  E1[☁️ Upload to YouTube]
+```
+
 ### Specifics
 
 - 5-15 minutes on one topic

docs/lunch-and-learns/process-docs.md

@@ -31,8 +31,6 @@ tags:
   - 'lunch and learns'
 ---
 
-Below is the entire lifecycle of a Virtual Coffee Lunch & Learn session.
-
 ## Roles
 
 There are several moving parts to making a successful Lunch & Learn. These docs are organized as to not assume one person is doing multiple roles (they could but they don't have to). It will also make it easy to assign roles as needed as our volunteer groups expand and contract.
@@ -85,6 +83,26 @@ Includes Editors and Graphics Coordinator (GC) who handle post-event cleanup of
 
 #### Scheduling Workflow
 
+The following diagram shows the workflow for scheduling a Lunch & Learn.
+
+```mermaid
+%%{init: { "themeVariables": { "fontSize": "18px" }, "flowchart": { "nodeSpacing": 40, "rankSpacing": 60, "padding": 8, "htmlLabels": true } } }%%
+flowchart TB
+  A1[📝 Submit Request] --> A2[📥 Receive Form]
+  A2 --> A3[📅 Check Calendar]
+  A3 --> B1{📅 Dates?}
+  B1 -- Yes --> B2[✅ Confirm Host]
+  B2 --> B3[📧 Confirm Email]
+  B3 --> B4[📅 Add to Cal]
+  B4 --> B5[🗂 Update Issue]
+  B1 -- No --> C1[🔄 Request New Slots]
+  C1 --> C2[📬 Receive Options]
+  C2 --> D1{✅ Options OK?}
+  D1 -- Yes --> A3
+  D1 -- No --> C3[🕒 Set New Deadline]
+  C3 --> C1
+```
+
 1. The LC checks the calendar for availability in order of the Speaker's preferred dates.
 
    a. If any of the Speaker's suggested time slots are available, continue to step 2.

docs/monthly-challenges/facilitators-docs/facilitate-a-challenge.md

@@ -37,6 +37,52 @@ Let us know your availability for the challenge in the reminder thread that drop
 
 If you have ideas for a new challenge(s), you can propose and discuss them in the `#vc-monthly-challenge-team` channel on Slack or open a new [discussion on GitHub](https://github.com/Virtual-Coffee/VC-Community-Docs/discussions).
 
+Below is a diagram the Monthly Challenge workflow.
+
+#### Planning + Coordination
+
+```mermaid
+%%{init: { "themeVariables": { "fontSize": "20px" }, "flowchart": { "nodeSpacing": 50, "rankSpacing": 70, "padding": 10 } } }%%
+flowchart TB
+  A1[📢 Planning] --> A2[👥 Share Time]
+  A2 --> A3[📝 Propose]
+  A3 --> B1[🤝 Plan w/ Hosts]
+```
+
+#### Blog + Website
+
+```mermaid
+%%{init: { "themeVariables": { "fontSize": "20px" }, "flowchart": { "nodeSpacing": 50, "rankSpacing": 70, "padding": 10 } } }%%
+flowchart TB
+  C1[📝 Write Blog] --> C2[🔍 Proofread]
+  C2 --> D0{✅ OK?}
+  D0 -- Yes --> D1[🌐 Update Pages]
+  D0 -- No --> D2[✏️ Revise]
+  D2 --> C2
+```
+
+#### Announcement
+
+```mermaid
+%%{init: { "themeVariables": { "fontSize": "20px" }, "flowchart": { "nodeSpacing": 50, "rankSpacing": 70, "padding": 10 } } }%%
+flowchart TB
+  E1[📢 Update] --> E2[📢 Announce]
+```
+
+#### Check-Ins + Post-Challenge
+
+```mermaid
+%%{init: { "themeVariables": { "fontSize": "20px" }, "flowchart": { "nodeSpacing": 50, "rankSpacing": 70, "padding": 10 } } }%%
+flowchart TB
+  F1[📅 Goals] --> F2[💬 Weekly]
+  F2 --> F3[🤖 Automate]
+  F3 --> G1[💬 Feedback]
+  G1 --> G0{More updates?}
+  G0 -- Yes --> G2[📝 Update Docs]
+  G2 --> G1
+  G0 -- No --> H1[🏁]
+```
+
 ## Before the Challenge
 
 ### Coordinating with the Coffee Table Groups
@@ -105,7 +151,6 @@ Some challenges require daily check-in. You can automate it using the Slack bot.
 
 - Provide feedback in the `#vc-monthly-challenge-team` channel, like what went well and what could've gone better for the challenge. Let us know what support you need and what things you think would be nice to do next time.
 - Update the README file in the challenge's folder with:
-
   - new script templates and things we did for the challenge,
   - the month and year of the challenge,
   - the blog post(s) for the challenge, if any.

docusaurus.config.js

@@ -52,7 +52,11 @@ const config = {
       }),
     ],
   ],
-
+  // These lines enable Mermaid support ✅
+  markdown: {
+    mermaid: true,
+  },
+  themes: ['@docusaurus/theme-mermaid'],
   themeConfig: {
     // Replace with your project's social card
     image: 'img/vc-social-card.png',
@@ -62,6 +66,32 @@ const config = {
         hideable: true,
       },
     },
+    // Site-wide Mermaid defaults for consistent sizing
+    mermaid: {
+      theme: { light: 'neutral', dark: 'neutral' },
+      options: {
+        themeVariables: {
+          fontSize: '20px',
+          fontFamily:
+            "Inter, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', 'Apple Color Emoji', 'Segoe UI Emoji'",
+          lineColor: '#6B7280',
+          primaryColor: '#FFF7D6',
+          primaryTextColor: '#1F2937',
+          primaryBorderColor: '#F59E0B',
+          tertiaryColor: '#E5F3FF',
+          clusterBkg: '#F9FAFB',
+          edgeLabelBackground: '#FFFFFF',
+          nodeBorderRadius: 8,
+        },
+        flowchart: {
+          nodeSpacing: 50,
+          rankSpacing: 70,
+          padding: 10,
+          htmlLabels: true,
+          curve: 'basis',
+        },
+      },
+    },
     navbar: {
       title: 'Virtual Coffee Community Docs',
       logo: {

package.json

@@ -17,17 +17,18 @@
     "check": "prettier --ignore-unknown --list-different --check ."
   },
   "dependencies": {
-    "@docusaurus/core": "3.7.0",
-    "@docusaurus/preset-classic": "3.7.0",
+    "@docusaurus/core": "3.9.2",
+    "@docusaurus/preset-classic": "3.9.2",
+    "@docusaurus/theme-mermaid": "3.9.2",
     "@mdx-js/react": "^3.0.0",
     "clsx": "^2.0.0",
     "prism-react-renderer": "^2.3.0",
-    "react": "^19.0.0",
-    "react-dom": "^19.0.0"
+    "react": "^18.3.1",
+    "react-dom": "^18.3.1"
   },
   "devDependencies": {
-    "@docusaurus/module-type-aliases": "3.7.0",
-    "@docusaurus/types": "3.7.0",
+    "@docusaurus/module-type-aliases": "3.9.2",
+    "@docusaurus/types": "3.9.2",
     "prettier": "^2.2.1"
   },
   "browserslist": {