Page 1 of 1

Sprints Badges are still not showing.

Posted: Mon May 21, 2018 3:11 pm
by bcavnaugh
Sprints Badges are still not showing for any completed Sprint this year.

Re: Sprints Badges are still not showing.

Posted: Fri Sep 28, 2018 8:16 pm
by Ken_g6
After several weeks I was finally approved to post here, and I just remembered why I registered in the first place. Since you seem to be having trouble making sprint badges, I wanted to suggest a way to make badges that's more automated. Like, say, an SVG.

Code: Select all

<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 160 160" height="160" width="160">
<defs>
<!-- Given circle at x,y radius r,
  d="Mx,(y-r)Ar,r 0 1,0 (x+r),y" -->
  <path d="M80,15A65,65 0 1,0 145,80" id="proj" />
  <!-- Given circle at x,y radius r,
  d="M(x-r),yAr,r 0 1,1 x,(y+r)" -->
  <path d="M25,80A55,55 0 1,1 80,135" id="fb" />
  <style>
    text { 
      fill: #E0BE00;
      font-size: 16px;
      font-family: sans-serif;
      font-weight: 900; 
    }
    .team {
      font-weight: normal;
      fill: #000;
    }
  </style>
</defs>
<circle cx="80" cy="80" r="75" stroke="#E0BE00" stroke-width="10" fill="#FFD700" />
<!-- dx = Pi*r/2 -->
<text dx="86.4" class="fb" text-anchor="middle">
<textPath xlink:href="#fb">Formula BOINC</textPath>
</text>
<image x="72" y="40" width="16" height="16" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAIAAACQkWg2AAACM0lEQVR4AV1RQ2CcXRQ99335Yoxj2+bgZ3fFstY+TpbZ1+6y2IWb2l4Vo9o2V3U77/Z7cXKecXHuwRjIwPgOGsTYRoCgnjS1iLE91Jaft/PTDn7Wyc/b5PNOftZus9IdEDtd0uVml4edLbeB/aRhzBffbeA7tXy73uihF22Xhm1/xcbItHRpipcm0y9LvGEjPc4DE1GIb5QrgztN8m6tb8C2d23O6rgYCe0d8Ah4AHxC2G/QbQAEBb6Rfnx35uQREH02+xfCNsJSqL4RxCazMhgDB+y+Ifv/zbH/OePmNJstVv1ASjKbTR5NB4GIEvRwLi6+Nukw9KxtjG7oRbu8XZ2bGvkkJydktbDLLZ1/sdsdcroMGhfGDQi/vabfvvhQ0G6Y8YsO5aKwkDVdAlIQE5iIne4zBEBAPfvsP/ym774Ew/LKkOXv6EhOS39JeALcJ/GA8A5gp+exMghTuvzwxnlHLMoagqCvNiXIyKidwDLQIpAxdxBeQTyZrMovv9k/aDcnmBYsmFdRUbbdkSQdjj4IpZMQAExCPElKuk/j0uOHz+IdtpviE3p7ewuKCk9nZrAjkd1O6XKxotuk9E7PvAWAVMdPn+XKkM1stvZ0dxKBC0pkVKRiDMFEIVLUnwADRIoDoAy8gw6Lybpq1YqKMJ31iPuEBxDG/FDxRgA4ClFO0KCA/5pEValeW1vb3t6ZSVob0VJgObAEWCZoMYRBPQnC4/EAAqQqBWBSlVkQmppo8uEPMmLMsDNcmd8AAAAASUVORK5CYII=" />

<!-- dx = Pi*r -->
<text dx="204.2" class="proj" text-anchor="middle">
<textPath xlink:href="#proj">World Community Grid</textPath>
</text>

<text class="team" x="50%" y="80" width="130" height="auto" dy="-.3em" text-anchor="middle" alignment-baseline="middle">The Very Best</text>
<text class="team" x="50%" y="80" width="130" height="auto" dy=".8em" text-anchor="middle" alignment-baseline="middle">Team Of All</text>
<text x="50%" y="80" width="130" height="auto" dy="2.2em" text-anchor="middle" alignment-baseline="middle">2018</text>

</svg>
That's an example gold medal for WCG, because WCG has a long name. You can change the text and it will center automatically (assuming it fits). You can also change the colors wherever they appear. The one thing I couldn't figure out with SVG is how to wrap text, so long team names must be split manually.

Here's a screenshot of what it looks like in Chromium:

Image

Firefox has wider letter spacing, but it works too.