update CI diagram: adjust styles, add group background, refine layouts and arrows

allnes · allnes · commit f7f87dbf56f7 · 2025-10-24T19:13:48.000+02:00
diff --git a/docs/_static/ci_graph.svg b/docs/_static/ci_graph.svg
@@ -2,15 +2,17 @@
 <svg xmlns="http://www.w3.org/2000/svg" width="1200" height="600" viewBox="0 0 1200 600">
   <defs>
     <style>
-      .primary { fill: #eaf2ff; stroke: #1b4f9c; stroke-width: 1.8; }
-      .secondary { fill: #f6f7f9; stroke: #6b7280; stroke-width: 1.4; }
-      .artifact { fill: #e8f5e9; stroke: #2e7d32; stroke-width: 1.4; }
+      .primary { fill: #eaf2ff; stroke: #1b4f9c; stroke-width: 2.2; }
+      .secondary { fill: #f6f7f9; stroke: #6b7280; stroke-width: 1.8; }
+      .artifact { fill: #e8f5e9; stroke: #2e7d32; stroke-width: 1.8; }
       .group { fill: none; stroke: #9ca3af; stroke-dasharray: 6 4; }
-      .label { font-family: "Segoe UI", Roboto, Helvetica, Arial, sans-serif; font-size: 15px; fill: #0f172a; }
-      .small { font-size: 13px; fill: #111827; }
-      .legend { font-size: 16px; fill: #374151; font-weight: 600; }
+      .label { font-family: "Segoe UI", Roboto, Helvetica, Arial, sans-serif; font-size: 18px; fill: #0f172a; }
+      .small { font-size: 18px; fill: #111827; }
+      .legend { font-size: 20px; fill: #374151; font-weight: 600; }
+      .legend-big { font-size: 26px; fill: #374151; font-weight: 700; }
       .group-bg { fill: #eef2ff; opacity: 0.45; stroke: none; }
-      .arrow { stroke: #111827; stroke-width: 1.8; fill: none; marker-end: url(#arrowHead); }
+      .group-bg-main { fill: #f8fafc; opacity: 0.6; stroke: none; }
+      .arrow { stroke: #111827; stroke-width: 2.2; fill: none; marker-end: url(#arrowHead); }
     </style>
     <marker id="arrowHead" markerWidth="12" markerHeight="12" refX="10" refY="3" orient="auto" markerUnits="strokeWidth">
       <path d="M0,0 L10,3 L0,6 Z" fill="#111827" />
@@ -19,28 +21,30 @@
 
   <!-- Main pipeline title -->
   <text class="legend" x="70" y="24">Main pipeline</text>
+  <!-- Main pipeline background (soft gray tint) -->
+  <rect class="group-bg-main" x="30" y="40" width="900" height="540" rx="12" ry="12" />
 
   <!-- pre-commit -->
-  <rect class="primary" x="70" y="50" rx="8" ry="8" width="220" height="46" />
-  <text class="label" x="180" y="78" text-anchor="middle">pre-commit (format + lint)</text>
+  <rect class="primary" x="70" y="50" rx="8" ry="8" width="260" height="54" />
+  <text class="label" x="200" y="78" text-anchor="middle">pre-commit (format + lint)</text>
 
   <!-- OS builds/tests row -->
   <rect class="primary" x="40" y="150" rx="8" ry="8" width="260" height="54" />
   <text class="label" x="170" y="178" text-anchor="middle">
-    <tspan x="170" dy="-6">Ubuntu (GCC+Clang)</tspan>
-    <tspan x="170" dy="16">build + tests</tspan>
+    <tspan x="170" dy="-8">Ubuntu (GCC+Clang)</tspan>
+    <tspan x="170" dy="18">build + tests</tspan>
   </text>
 
   <rect class="primary" x="340" y="150" rx="8" ry="8" width="220" height="54" />
   <text class="label" x="450" y="178" text-anchor="middle">
-    <tspan x="450" dy="-6">macOS (Clang)</tspan>
-    <tspan x="450" dy="16">build + tests</tspan>
+    <tspan x="450" dy="-8">macOS (Clang)</tspan>
+    <tspan x="450" dy="18">build + tests</tspan>
   </text>
 
   <rect class="primary" x="600" y="150" rx="8" ry="8" width="260" height="54" />
   <text class="label" x="730" y="178" text-anchor="middle">
-    <tspan x="730" dy="-6">Windows (MSVC/Clang‑CL)</tspan>
-    <tspan x="730" dy="16">build + tests</tspan>
+    <tspan x="730" dy="-8">Windows (MSVC/Clang‑CL)</tspan>
+    <tspan x="730" dy="18">build + tests</tspan>
   </text>
 
   <!-- Coverage (from Ubuntu) -->
@@ -50,83 +54,87 @@
   <!-- Performance stats (Linux + macOS) -->
   <rect class="artifact" x="340" y="280" rx="8" ry="8" width="220" height="50" />
   <text class="label" x="450" y="305" text-anchor="middle">
-    <tspan x="450" dy="-6">Performance stats</tspan>
-    <tspan x="450" dy="16">(Linux + macOS)</tspan>
+    <tspan x="450" dy="-8">Performance stats</tspan>
+    <tspan x="450" dy="18">(Linux + macOS)</tspan>
   </text>
 
   <!-- Scoreboard build (uses perf) -->
   <rect class="artifact" x="340" y="370" rx="8" ry="8" width="220" height="50" />
   <text class="label" x="450" y="395" text-anchor="middle">
-    <tspan x="450" dy="-6">Scoreboard build</tspan>
-    <tspan x="450" dy="16">(from perf artifacts)</tspan>
+    <tspan x="450" dy="-8">Scoreboard build</tspan>
+    <tspan x="450" dy="18">(from perf artifacts)</tspan>
   </text>
 
-  <!-- Docs (Doxygen -> Sphinx) group -->
-  <rect class="group" x="600" y="260" width="260" height="220" rx="10" ry="10" />
-  <text class="legend" x="730" y="276" text-anchor="middle">Docs</text>
-  <rect class="secondary" x="640" y="290" rx="6" ry="6" width="180" height="48" />
-  <text class="small" x="730" y="316" text-anchor="middle">Doxygen XML</text>
-  <rect class="secondary" x="640" y="350" rx="6" ry="6" width="180" height="48" />
-  <text class="small" x="730" y="376" text-anchor="middle">Sphinx (EN / RU)</text>
+  <!-- Docs (Doxygen -> Sphinx) group with tinted background like Additional -->
+  <rect class="group-bg" x="590" y="250" width="280" height="260" rx="12" ry="12" />
+  <rect class="group" x="600" y="255" width="260" height="235" rx="10" ry="10" />
+  <text class="legend legend-big" x="730" y="290" text-anchor="middle">Docs</text>
+  <rect class="secondary" x="625" y="312" rx="6" ry="6" width="210" height="50" />
+  <text class="small" x="730" y="338" text-anchor="middle">Doxygen XML</text>
+  <rect class="secondary" x="625" y="372" rx="6" ry="6" width="210" height="50" />
+  <text class="small" x="730" y="398" text-anchor="middle">Sphinx (EN / RU)</text>
 
   <!-- Pages deploy -->
   <rect class="primary" x="340" y="500" rx="8" ry="8" width="300" height="60" />
   <text class="label" x="490" y="530" text-anchor="middle">
-    <tspan x="490" dy="-6">Pages deploy</tspan>
-    <tspan x="490" dy="16">(Docs + Scoreboard + Coverage)</tspan>
+    <tspan x="490" dy="-8">Pages deploy</tspan>
+    <tspan x="490" dy="18">(Docs + Scoreboard + Coverage)</tspan>
   </text>
 
   <!-- Arrows main flow -->
-  <!-- Curved arrows from pre-commit -->
-  <path class="arrow" d="M 230 90 C 210 110, 190 130, 170 150" />
-  <path class="arrow" d="M 250 96 C 250 120, 250 135, 250 150" />
-  <path class="arrow" d="M 270 90 C 340 110, 540 130, 730 150" />
-
-  <!-- Ubuntu -> Coverage -->
-  <path class="arrow" d="M 170 204 C 170 230, 170 255, 170 280" />
-  <!-- Ubuntu -> Perf -->
-  <path class="arrow" d="M 300 200 C 340 230, 400 255, 450 280" />
-  <!-- macOS -> Perf -->
-  <path class="arrow" d="M 450 204 C 450 230, 450 255, 450 280" />
+  <!-- Arrows from pre-commit bottom center to OS top centers (straight) -->
+  <path class="arrow" d="M 200 104 L 170 150" />
+  <path class="arrow" d="M 200 104 L 450 150" />
+  <path class="arrow" d="M 200 104 L 730 150" />
+
+  <!-- Ubuntu -> Coverage (straight) -->
+  <path class="arrow" d="M 170 204 L 170 280" />
+  <!-- Ubuntu -> Perf (straight) -->
+  <path class="arrow" d="M 170 204 L 450 280" />
+  <!-- macOS -> Perf (straight) -->
+  <path class="arrow" d="M 450 204 L 450 280" />
   <!-- windows (no direct to perf) intentionally omitted -->
 
-  <!-- Perf -> Scoreboard -->
-  <path class="arrow" d="M 450 330 C 450 345, 450 360, 450 370" />
+  <!-- Perf -> Scoreboard (straight) -->
+  <path class="arrow" d="M 450 330 L 450 370" />
 
-  <!-- Docs arrows: Doxygen -> Sphinx -->
-  <path class="arrow" d="M 730 338 C 730 345, 730 350, 730 350" />
+  <!-- Docs arrows: (removed by request) -->
 
-  <!-- Inputs to Pages: Coverage, Scoreboard, Sphinx -->
-  <path class="arrow" d="M 170 330 C 260 400, 360 470, 490 500" />
-  <path class="arrow" d="M 450 420 C 460 450, 470 480, 490 500" />
-  <path class="arrow" d="M 730 398 C 660 450, 590 490, 490 500" />
+
+  <!-- Inputs to Pages: Coverage, Scoreboard (straight) -->
+  <path class="arrow" d="M 170 330 L 490 500" />
+  <path class="arrow" d="M 450 420 L 490 500" />
 
   <!-- Additional workflows column -->
   <!-- Additional background (soft tint) -->
-  <rect class="group-bg" x="950" y="30" width="230" height="440" rx="12" ry="12" />
-  <rect class="group" x="960" y="40" width="210" height="420" rx="10" ry="10" />
-  <text class="legend" x="1065" y="60" text-anchor="middle">Additional</text>
+  <rect class="group-bg" x="940" y="20" width="250" height="500" rx="12" ry="12" />
+  <rect class="group" x="950" y="30" width="230" height="480" rx="10" ry="10" />
+  <text class="legend legend-big" x="1065" y="56" text-anchor="middle">Additional</text>
+
+  <!-- Additional micro-legend (compact, two lines) -->
+  <text class="small" x="1065" y="90" text-anchor="middle">Legend: PR / schedule</text>
+  <text class="small" x="1065" y="114" text-anchor="middle">weekly / master</text>
 
-  <rect class="secondary" x="975" y="90" rx="6" ry="6" width="180" height="36" />
-  <text class="small" x="1065" y="110" text-anchor="middle">clang-tidy (PR)</text>
+  <rect class="secondary" x="960" y="150" rx="6" ry="6" width="210" height="40" />
+  <text class="small" x="1065" y="174" text-anchor="middle">clang-tidy (PR)</text>
 
-  <rect class="secondary" x="975" y="132" rx="6" ry="6" width="180" height="36" />
-  <text class="small" x="1065" y="152" text-anchor="middle">CodeQL (schedule)</text>
+  <rect class="secondary" x="960" y="202" rx="6" ry="6" width="210" height="40" />
+  <text class="small" x="1065" y="226" text-anchor="middle">CodeQL (schedule)</text>
 
-  <rect class="secondary" x="975" y="174" rx="6" ry="6" width="180" height="36" />
-  <text class="small" x="1065" y="194" text-anchor="middle">OpenSSF Scorecard</text>
+  <rect class="secondary" x="960" y="254" rx="6" ry="6" width="210" height="40" />
+  <text class="small" x="1065" y="278" text-anchor="middle">OpenSSF Scorecard</text>
 
-  <rect class="secondary" x="975" y="216" rx="6" ry="6" width="180" height="36" />
-  <text class="small" x="1065" y="236" text-anchor="middle">Docker image</text>
+  <rect class="secondary" x="960" y="306" rx="6" ry="6" width="210" height="40" />
+  <text class="small" x="1065" y="330" text-anchor="middle">Docker image</text>
 
-  <rect class="secondary" x="975" y="258" rx="6" ry="6" width="180" height="36" />
-  <text class="small" x="1065" y="278" text-anchor="middle">Nightly (stale PRs)</text>
+  <rect class="secondary" x="960" y="358" rx="6" ry="6" width="210" height="40" />
+  <text class="small" x="1065" y="382" text-anchor="middle">Nightly (stale PRs)</text>
 
-  <rect class="secondary" x="975" y="300" rx="6" ry="6" width="180" height="36" />
-  <text class="small" x="1065" y="320" text-anchor="middle">Labeler (PR)</text>
+  <rect class="secondary" x="960" y="410" rx="6" ry="6" width="210" height="40" />
+  <text class="small" x="1065" y="434" text-anchor="middle">Labeler (PR)</text>
 
-  <rect class="secondary" x="975" y="342" rx="6" ry="6" width="180" height="36" />
-  <text class="small" x="1065" y="362" text-anchor="middle">Update pre-commit</text>
+  <rect class="secondary" x="960" y="462" rx="6" ry="6" width="210" height="40" />
+  <text class="small" x="1065" y="486" text-anchor="middle">Update pre-commit</text>
 
   <!-- Legend -->
   <text class="legend" x="70" y="585">Flow: pre-commit → Ubuntu/macOS/Windows → Coverage/Perf → Docs/Scoreboard → Pages</text>
