pupilfirst/pupilfirst

<svg class="student-overlay__doughnut-chart <%= color %>"  viewBox="0 0 36 36">
  <path class="student-overlay__doughnut-chart-bg" d="M18 2.0845 a 15.9155 15.9155 0 0 1 0 31.831 a 15.9155 15.9155 0 0 1 0 -31.831"></path>
  <path class="student-overlay__doughnut-chart-stroke" d="M18 2.0845 a 15.9155 15.9155 0 0 1 0 31.831 a 15.9155 15.9155 0 0 1 0 -31.831" stroke-dasharray="<%= percentage %>, 100"></path>
  <text class="student-overlay__doughnut-chart-text font-semibold" x="50%" y="58%"><%= percentage %>%</text>
</svg>