In CF Classic, it's simple to select predefined styling options for your progress bar, but in CF 2.0, you'll have to use some custom coding or CSS to get the same styling setup.



You can plug this CUSTOM CSS into your CF 2.0 page and as long as you have a PROGRESS BAR ELEMENT on your page, it will add the animated stripes.


The colors are still controlled by your element setting colors:


.progress-bar 
{
  background-image: repeating-linear-gradient(-45deg, transparent, transparent 1.5rem, rgb(255,255,255,.1) 25px, rgb(255,255,255,.1) 50px) !important;
  -webkit-animation:progress 2s linear infinite;
  -moz-animation:progress 2s linear infinite;
  -ms-animation:progress 2s linear infinite;
  animation:progress 2s linear infinite;
  background-size: 150% 100% !important;
}

@-webkit-keyframes progress{
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: -75px 0px;
  }
}
@-moz-keyframes progress{
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: -75px 0px;
  }
}    
@-ms-keyframes progress{
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: -75px 0px;
  }
}    
@keyframes progress{
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: -70px 0px;
  }
}