12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364 |
- /* ProgressBar
- *
- * Styling of the ProgressBar consists of the following:
- *
- * 1. the base progress bar
- * .dijitProgressBar - sets margins for the progress bar
- *
- * 2. the empty bar
- * .dijitProgressBarEmpty - sets background img and color for bar or parts of bar that are not finished yet
- * Also sets border color for whole bar
- *
- * 3. tile mode
- * .dijitProgressBarTile
- * inner container for finished portion when in 'tile' (image) mode
- *
- * 4. full bar mode
- * .dijitProgressBarFull
- * adds border to right side of the filled portion of bar
- *
- * 5. text for label of bar
- * .dijitProgressBarLabel - sets text color, which must contrast with both the "Empty" and "Full" parts.
- *
- * 6. indeterminate mode
- * .dijitProgressBarIndeterminate .dijitProgressBarTile
- * sets animated gif for the progress bar in 'indeterminate' mode
- */
-
- @import "variables";
-
- .claro .dijitProgressBar {
- margin:2px 0 2px 0;
- }
- .claro .dijitProgressBarEmpty {
- /* outer container and background of the bar that's not finished yet*/
- background-color: @progressbar-empty-background-color;
- border-color: @progressbar-border-color;
- }
- .claro .dijitProgressBarTile {
- /* inner container for finished portion when in 'tile' (image) mode */
- background-color: @progressbar-full-background-color;
- // gradient background using CSS gradient, with fallback to image for IE
- background-image: url("images/progressBarFull.png");
- background-repeat: repeat-x;
- .alpha-white-gradient(0.93,0px, 0.41,1px, 0.7,2px, 0,100%);
- background-attachment: scroll; // override strange "fixed" setting from dijit.css
- }
- .dj_ie6 .claro .dijitProgressBarTile {
- background-image: none;
- }
- .claro .dijitProgressBarFull {
- border-right:1px solid @progressbar-border-color;
- .transition-property(width);
- .transition-duration(.25s);
- }
- .claro .dijitProgressBarLabel {
- /* Set to a color that contrasts with both the "Empty" and "Full" parts. */
- color: @progressbar-text-color;
- }
- .claro .dijitProgressBarIndeterminate .dijitProgressBarTile {
- /* use an animated gif for the progress bar in 'indeterminate' mode;
- background-color won't appear unless user has turned off background images */
- background: @bar-background-color url(@image-progressbar-anim) repeat-x top;
- }
|