Fix progress text multiline flow, make default style more flat, fix some conditions on 100% complete

src/definitions/modules/progress.js

@@ -197,6 +197,18 @@ $.fn.progress = function(parameters) {
           }
         },
 
+        is: {
+          success: function() {
+            return $module.hasClass(className.success);
+          },
+          warning: function() {
+            return $module.hasClass(className.warning);
+          },
+          error: function() {
+            return $module.hasClass(className.error);
+          }
+        },
+
         set: {
           barWidth: function(value) {
             $bar
@@ -245,7 +257,7 @@ $.fn.progress = function(parameters) {
             }
             module.set.barWidth(percent);
             module.set.barLabel();
-            if(percent === 100 && settings.autoSuccess) {
+            if(percent === 100 && settings.autoSuccess && !(module.is.warning() || module.is.error())) {
               module.debug('Automatically triggering success at 100%');
               module.set.success();
             }
@@ -279,6 +291,8 @@ $.fn.progress = function(parameters) {
             text = text || settings.text.success;
             module.debug('Setting success state');
             $module.addClass(className.success);
+            $module.removeClass(className.warning);
+            $module.removeClass(className.error);
             module.complete();
             if(text) {
               module.set.label(text);
@@ -288,6 +302,8 @@ $.fn.progress = function(parameters) {
             text = text || settings.text.warning;
             module.debug('Setting warning state');
             $module.addClass(className.warning);
+            $module.removeClass(className.success);
+            $module.removeClass(className.error);
             module.complete();
             if(text) {
               module.set.label(text);
@@ -297,6 +313,8 @@ $.fn.progress = function(parameters) {
             text = text || settings.text.error;
             module.debug('Setting error state');
             $module.addClass(className.error);
+            $module.removeClass(className.success);
+            $module.removeClass(className.warning);
             module.complete();
             if(text) {
               module.set.label(text);

src/themes/packages/basic/modules/progress.overrides

@@ -0,0 +1,3 @@
+/*******************************
+            Progress
+*******************************/

src/themes/packages/basic/modules/progress.variables

@@ -0,0 +1,15 @@
+/*******************************
+            Progress
+*******************************/
+
+@background: transparent;
+@border: none;
+@padding: 0em;
+
+@progressLeft: 0em;
+@progressWidth: 100%;
+@progressTextAlign: center;
+
+@labelFontWeight: normal;
+@labelTextAlign: left;
+@labelHeight: 1.5em;

src/themes/packages/classic/modules/progress.overrides

@@ -0,0 +1,3 @@
+/*******************************
+            Progress
+*******************************/

src/themes/packages/classic/modules/progress.variables

@@ -0,0 +1,5 @@
+/*******************************
+            Progress
+*******************************/
+
+@border: none;

src/themes/packages/default/modules/progress.variables

@@ -12,8 +12,8 @@
 @firstMargin: 0em 0em (@labelHeight + @verticalSpacing);
 @lastMargin: 0em 0em (@labelHeight);
 
-@background: @offWhite;
-@border: 1px solid @borderColor;
+@background: @subtleTransparentBlack;
+@border: none;
 @boxShadow: none;
 @padding: 0.325em;
 @borderRadius: 0.325em;
@@ -43,14 +43,14 @@
 @progressTextAlign: left;
 
 @labelWidth: 100%;
-@labelHeight: 1.75em;
+@labelHeight: 1.25em;
 @labelSize: 1em;
 @labelPosition: absolute;
-@labelTop: auto;
-@labelRight: auto;
+@labelTop: 100%;
 @labelLeft: 0%;
-@labelBottom: -@labelHeight;
-@labelOffset: 0em;
+@labelRight: auto;
+@labelBottom: auto;
+@labelOffset: (@labelHeight - 1em);
 @labelColor: @textColor;
 @labelTextShadow: none;
 @labelFontWeight: bold;