pulsating Border
Draw an animated rectangular border around the UI component using the pulsating border:
Design
.itemMain {
border {
type: pulsating;
start-color: #0f0;
end-color: #000;
back-and-forth: true;
repeat: true;
}
}
CSS attributes:
| CSS Attribute | Default | Values | Explanation | Since |
|---|---|---|---|---|
| width | 1 | integer | The width of the border. | 1.3 |
| start-color | white | color | The color at the beginning of the animation sequence. | 1.3 |
| end-color | gray | color | The color at the end of the animation sequence. | 1.3 |
| steps | 8 | integer | The number of animation phases. | 1.3 |
| repeat | true | true, false | Indicates if the animation should start again. | 1.3 |
| back-and-forth | true | true, false | Set to true if the color should move back from the end-color to the start-color when the animation reaches the end-color. | 1.3 |