Mixed Diagram Test

This page tests both mermaid and goat diagrams to ensure they render correctly.

Mermaid Flowchart

graph TD
    A[Start] --> B{Is it working?}
    B -->|Yes| C[Great!]
    B -->|No| D[Debug]
    D --> B
    C --> E[End]

Goat ASCII Diagram

+--------------------+
| Mermaid Diagrams   |
| (Rendered as SVG)  |
+--------------------+
          |
          v
+--------------------+
| Goat Diagrams      |
| (ASCII Art)        |
+--------------------+

Another Mermaid Diagram

sequenceDiagram
    participant A as Alice
    participant B as Bob
    A->>B: Hello Bob!
    B-->>A: Hello Alice!

Another Goat Diagram

[Frontend] --> [Backend] --> [Database]
    ^             |
    |             v
[Cache] <----  [Queue]

Regular Code Block

function test() {
    console.log("This should be syntax highlighted");
    return "success";
}

This test should show:

• ✅ Mermaid diagrams rendered as interactive SVG
• ✅ Goat diagrams rendered as styled ASCII art
• ✅ Regular code blocks with syntax highlighting