ci-observer/ci-observer-handover/contexts/CODEX_CONTEXT.md

Codex Work Context (Wolkabout GHA Diagram)

Project

• Repo: /home/nikola/codex-cli
• Task: Create/iterate Wolkabout GHA pipeline SVG with 2D and 3D variants.

Latest User Request

• Keep the current 2D diagram unchanged.
• Produce a separate 3D version where all elements except text are skewed (nagnuto), and 3D depth is stronger.

Key Output Files

• 2D (approved):
  • /home/nikola/codex-cli/Wolkabout-platform-pipeline-GHA-v3.svg
  • /home/nikola/codex-cli/Wolkabout-platform-pipeline-GHA-v3.png
• 3D (working version, skewed):
  • /home/nikola/codex-cli/Wolkabout-platform-pipeline-GHA-v3-3d.svg
  • /home/nikola/codex-cli/Wolkabout-platform-pipeline-GHA-v3-3d.png

What Was Done (Summary)

• Built a richer 2D diagram with 3 lanes (IoT, ArgoCD, WTF), per-workflow card details, start/end chevrons, subtle lane backgrounds, and rectangular handoff arrows that route along outer edges.
• Added runner/env/deploy info and detailed step descriptions based on workflow files in:
  • /home/nikola/WA-git/IoT-Platform-Core/.github/workflows/all-in-one.yml
  • /home/nikola/WA-git/IoT-Platform-Core/.github/workflows/unit-tests.yml
  • /home/nikola/WA-git/argocd/.github/workflows/deploy-be.yml (branch: atest1)
  • /home/nikola/WA-git/Wolkabout-Test-Framework/.github/workflows/new-parallel-wtf.yml
• Handoff arrows updated to rectangular paths:
  • M 2530 300 L 2530 440 L 30 440 L 30 590 L 40 590
  • M 2530 590 L 2530 780 L 30 780 L 30 900 L 40 900
• Increased lane background visibility and added deeper card shadows + gradient fills.

3D Variant Adjustments

• Created a new file: Wolkabout-platform-pipeline-GHA-v3-3d.svg.
• Applied stronger depth via:
  • Card gradient (#1a2742 -> #0a0f18)
  • Deeper shadow filters card-shadow-deep and card-shadow-soft
  • Heavier shadow on start/end tags (flow-shadow) with offset
• Applied global skew so everything except text tilts:
  • Wrapped all content in <g id="tilt" transform="skewX(-6)"> ... </g>
  • Added transform="skewX(6)" to every <text ...> to keep text visually upright.

Notes on Tools/Warnings

• inkscape export used to generate PNGs.
• Inkscape warns about unimplemented style property 109 (safe to ignore).

Next Steps / Open Items

• Validate the 3D skew visual to confirm the tilt is strong enough.
• If needed: increase skew (e.g., skewX(-8) or -10) and adjust text counter-skew.
• Optional: add more 3D depth (side faces) if requested.

Location of Current 3D Edits in SVG

• Global skew group added near root:
  • <g id="tilt" transform="skewX(-6)"> wrapping the entire scene
  • Closing </g> before </svg>
• Text counter-skew applied by replacing <text ...> with <text transform="skewX(6)" ...>.