<svg class="spotlight-circle__container spotlight-circle spotlight-circle--arches-blue" data-spotlight-circle xmlns="http://www.w3.org/2000/svg" viewBox="0 0 824 616">
<path class="spotlight-circle__path" id="path--spotlight-circle--default"
fill="none" stroke="#000"
stroke-miterlimit="10" stroke-width="4" stroke-dasharray="10 20.1" data-spotlight-circle-path
/>
<circle class="spotlight-circle__shape" id="spotlight-circle--default"
cx="0" cy="0" r="100" stroke="#FF552E" stroke-width="2"
data-spotlight-circle-id="spotlight-circle--default"
data-spotlight-circle-animation="animation2"
data-spotlight-circle-duration="3s"
data-spotlight-circle-show-path="true"
>
</circle>
</svg>
<svg class="spotlight-circle__container spotlight-circle spotlight-circle--{{ color| default('arches-blue') }}"
data-spotlight-circle
xmlns="http://www.w3.org/2000/svg" viewBox="0 0 {{ viewBoxWidth }} {{ viewBoxHeight }}"
>
<path class="spotlight-circle__path" id="path--{{ id | default('spotlight-circle--default') }}"
fill="none" stroke="{{ showPath == true ? "#000" : "none" }}"
stroke-miterlimit="10" stroke-width="4" stroke-dasharray="10 20.1" data-spotlight-circle-path
/>
<circle class="spotlight-circle__shape" id="{{ id | default('spotlight-circle--default') }}"
cx="0" cy="0" r="{{ size }}" stroke="#FF552E" stroke-width="{{ stroke | default('2') }}"
data-spotlight-circle-id="{{ id | default('spotlight-circle--default') }}"
data-spotlight-circle-animation="{{ animation | default('animation1') }}"
data-spotlight-circle-duration="{{ duration | default('3s') }}"
data-spotlight-circle-show-path="{{ showPath | default('false') }}"
>
</circle>
</svg>
{
"siteUnit": "network",
"departmentName": "Network",
"background": "light",
"animation": "animation2",
"color": "arches-blue",
"duration": "3s",
"showPath": true,
"size": "100",
"stroke": "2",
"viewBoxHeight": "616",
"viewBoxWidth": "824",
"hidden": true
}
.spotlight-circle
--circleColor illiniOrange
&--arches-blue
--circleColor archesBlue
&--arches-blue-lighter
--circleColor archesBlueLighter
&--heritage-orange
--circleColor heritageOrange
&--illini-orange
--circleColor illiniOrange
&--industrial-blue
--circleColor industrialBlue
bottom 0
height 100%
left 0
overflow visible
position absolute
right 0
top 0
width 100%
z-index 1
&__shape
fill transparent
opacity 0
stroke var(--circleColor)
transition opacity 0.3s ease
&--animated
opacity 1
There are no notes for this item.