setting date at angle

[SimonW94]

Hi

I'm really new to this so apologies if my descriptions are vague. I've searched high and low for a solution to this and so far it's evaded me. All I'm trying to do is have my date set at an angle so it aligns with the clock face background I've made. I'm able to get the date to display, capable of changing font, colour, size etc but haven't found a way of just rotating it. 

I found what I thought was my solution below from another thread:

<g id="test" transform="translate(50%,50%)">
  <text id="test-text">a test</text>
</g>
 <text id="text-angle"></text>

#test-text {
  x: 50;
  y: 0%;
  font-size: 32;
  font-family: Seville-Regular;
  text-anchor: start;
  fill: white;
}
#text-angle {
 x: 5%;
 y: 90%;
 font-size: 24;
 font-family: Seville-Regular;
 text-length: 32;
 text-anchor: start;
 fill: white;
}

I tried adapting this for the date to show instead of the test text but couldn't get it to work.

Any pointers would be greatly appreciated

[Guy_]

Hi @SimonW94 - the trick is to position the text with small rotation [transform="rotate(1)"] to start with then add a bit [transform="rotate(10)"] of rotation at a time and adjust the X Y coordinates as you go.