So I had worked up and example for this thread. Today I noticed that when you click on svg component, you're greeted with some interesting graphics.
It could be something I've done incorrectly, but I thought I would report it here none the less. Not drastic enough that I feel a formal bug report is needed until someone confirms that I haven't caused this with myself.
Stylesheet CSS:
:root {
--spinner-animation-speed: 1s;
}
@keyframes spin {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}
.psc-spinner {
animation: spin var(--spinner-animation-speed) linear infinite;
}
View JSON:
{
"custom": {},
"params": {},
"props": {
"defaultSize": {
"height": 422,
"width": 573
}
},
"root": {
"children": [
{
"meta": {
"name": "blank"
},
"position": {
"height": 176,
"width": 155,
"x": 183,
"y": 106
},
"props": {
"elements": [
{
"elements": [
{
"elements": [
{
"offset": "0%",
"stopColor": "value",
"type": "stop"
},
{
"offset": "25%",
"stopColor": "#07c",
"stopOpacity": "75%",
"type": "stop"
},
{
"offset": "50%",
"stopColor": "#07c",
"stopOpacity": "50%",
"type": "stop"
},
{
"offset": "75%",
"stopColor": "#07c",
"stopOpacity": "25%",
"type": "stop"
},
{
"offset": "100%",
"stopColor": "#07c",
"stopOpacity": "5%",
"type": "stop"
}
],
"id": "fade",
"type": "linearGradient",
"x1": "1%",
"x2": "80%",
"y1": "95%",
"y2": "15%"
}
],
"type": "defs"
},
{
"cx": 24,
"cy": 24,
"fill": "transparent",
"r": 22,
"stroke": {
"paint": "url(#fade)",
"width": 4
},
"type": "circle"
}
],
"style": {
"classes": "spinner"
},
"viewBox": "0 0 48 48"
},
"type": "ia.shapes.svg"
}
],
"meta": {
"name": "root"
},
"type": "ia.container.coord"
}
}