Image Overflowing Isuue In Animated Instagram Story Category
Now here are two possible solutions of this problem:
1. Make sure the image you are uploading to be displayed as an Insta icon is of square size. The recommended dimensions for the image is 1x1 ( Like 450x450 etc).
2. If you don't want to add image of recommended dimensions then you can modify your code by adding the given code to resolve this issue:
.circle img {height: 70px;}
Change Animated Circle Color In Animated Instagram Story Category
To change the circle color in animated instagram story you have to change your stroke color in your animated instagram section file.
@keyframes stroke-draw {
from {
stroke: red; stroke-dasharray: 1;
}
to {
stroke: aqua; transform: rotate(180deg); stroke-dasharray: 8;
}
}
You can change the stroke color according to your preferences.
Remove Animated Circle From Animated Instagram Story Category
To remove the animated circle from the animated instagram story category you have to remove the given codes from your section file.
.circle svg { fill: none; stroke: #8a3ab9; stroke-linecap: round; stroke-width: 3; stroke-dasharray: 1; stroke-dashoffset: 0; animation: stroke-draw 6s ease-out infinite alternate; }
.circle svg:hover{animation: stroke-draw 10s ease-out infinite alternate; cursor:pointer; }
<svg viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg" style="enable-background: new -580 439 577.9 194" xml:space="preserve" >
<circle cx="50" cy="50" r="40"></circle>
</svg>
