Gist for NS specs coverage

coverage.svg

  <svg
    xmlns="http://www.w3.org/2000/svg"
    width="600"
    height="270"
    viewBox="0 0 600 270"
    fill="none"
  >
    
  <style>
    .header {
      font: 600 18px 'Segoe UI', Ubuntu, Sans-Serif;
      fill: #000;
    }
    .group-name {
      font: 400 12px 'Segoe UI', Ubuntu, Sans-Serif;
      fill: #333
    }
  </style>

    <rect x="0.5" y="0.5" rx="4.5" height="99%" stroke="#e4e2e2" width="599" fill="#fffefe" stroke-opacity="1" />
    <g transform="translate(300, 25)">
      <text x="0" y="0" class="header" alignment-baseline="middle" text-anchor="middle">Test Coverage</text>
    </g>
    <g transform="translate(0, 55)">
      <svg x="25">
    <g transform="translate(0, 0)">
      <text x="2" y="15" class="group-name">Services   |   98%   |   18556/18857</text>
      <svg width="205" x="0" y="25">
        <rect rx="5" ry="5" x="0" y="0" width="205" height="8" fill="#ddd"/>
        <rect
          height="8"
          fill="#50C878"
          rx="5"
          ry="5"
          x="0"
          y="0"
          width="98.4%"
        />
      </svg>
    </g>
  

    <g transform="translate(345, 0)">
      <text x="2" y="15" class="group-name">Controllers   |   91%   |   603/666</text>
      <svg width="205" x="0" y="25">
        <rect rx="5" ry="5" x="0" y="0" width="205" height="8" fill="#ddd"/>
        <rect
          height="8"
          fill="#50C878"
          rx="5"
          ry="5"
          x="0"
          y="0"
          width="90.54%"
        />
      </svg>
    </g>
  

    <g transform="translate(0, 40)">
      <text x="2" y="15" class="group-name">Models   |   95%   |   7856/8232</text>
      <svg width="205" x="0" y="25">
        <rect rx="5" ry="5" x="0" y="0" width="205" height="8" fill="#ddd"/>
        <rect
          height="8"
          fill="#50C878"
          rx="5"
          ry="5"
          x="0"
          y="0"
          width="95.43%"
        />
      </svg>
    </g>
  

    <g transform="translate(345, 40)">
      <text x="2" y="15" class="group-name">Jobs   |   98%   |   2873/2945</text>
      <svg width="205" x="0" y="25">
        <rect rx="5" ry="5" x="0" y="0" width="205" height="8" fill="#ddd"/>
        <rect
          height="8"
          fill="#50C878"
          rx="5"
          ry="5"
          x="0"
          y="0"
          width="97.56%"
        />
      </svg>
    </g>
  

    <g transform="translate(0, 80)">
      <text x="2" y="15" class="group-name">Libraries   |   88%   |   1385/1578</text>
      <svg width="205" x="0" y="25">
        <rect rx="5" ry="5" x="0" y="0" width="205" height="8" fill="#ddd"/>
        <rect
          height="8"
          fill="#50C878"
          rx="5"
          ry="5"
          x="0"
          y="0"
          width="87.77%"
        />
      </svg>
    </g>
  

    <g transform="translate(345, 80)">
      <text x="2" y="15" class="group-name">Ungrouped   |   96%   |   15824/16494</text>
      <svg width="205" x="0" y="25">
        <rect rx="5" ry="5" x="0" y="0" width="205" height="8" fill="#ddd"/>
        <rect
          height="8"
          fill="#50C878"
          rx="5"
          ry="5"
          x="0"
          y="0"
          width="95.94%"
        />
      </svg>
    </g>
  </svg>
    </g>
    <g transform="translate(25, 200)">
      <rect rx="2" ry="2" width="550" height="2" fill="#000"/>
    </g>
    <g transform="translate(0, 220)">
      <svg x="25">
        
    <g transform="translate(0, 0)">
      <text x="2" y="15" class="group-name">Total   |   97%   |   47097/48772</text>
      <svg width="205" x="0" y="25">
        <rect rx="5" ry="5" x="0" y="0" width="205" height="8" fill="#ddd"/>
        <rect
          height="8"
          fill="#50C878"
          rx="5"
          ry="5"
          x="0"
          y="0"
          width="96.57%"
        />
      </svg>
    </g>
  
      </svg>
    </g>
  </svg>