-
Dallon Feldner authored
* Symlink-friendly path resolution I was having difficulties using a local copy of `react-scripts` and `npm link`ing it into a real world project. This change resolves paths relative to the current working directory (that is, most likely the directory of the app) rather than assuming a certain directory structure. * Fix relative paths in post-eject case because I'm an idiot * Renamed resolveLib to resolveOwn
d2baa3c4
layout: page
title: Progress
Stylize the HTML5 <progress>
element with a few extra classes and some crafty browser-specific CSS. Be sure to read up on the browser support.
Example
{% example html %} 0% 25% 50% 75% 100% {% endexample %}
IE9 support
Internet Explorer 9 doesn't support the HTML5 <progress>
element, but we can work around that.
{% example html %}
Contextual alternatives
Progress bars use some of the same button and alert classes for consistent styles.
{% example html %} 25% 50% 75% 100% {% endexample %}
Striped
Uses a gradient to create a striped effect.
{% example html %} 10% 25% 50% 75% 100% {% endexample %}
Animated stripes
The striped gradient can also be animated. Add .progress-animated
to .progress
to animate the stripes right to left via CSS3 animations.
Animated progress bars do not work in IE9 and Opera 12 as they don't support CSS3 animations.
{% highlight html %} 25% {% endhighlight %}