diff --git a/server/files/javascript/progress.js b/server/files/javascript/progress.js
index 357fe4cd6..840e8b5a5 100755
--- a/server/files/javascript/progress.js
+++ b/server/files/javascript/progress.js
@@ -4,12 +4,39 @@ semantic.progress = {};
semantic.progress.ready = function() {
var
- $progress = $('.definition .ui.progress').not('.success, .error, .warning'),
- $stateProgress = $('.definition .ui.success.progress, .ui.warning.progress, .ui.error.progress')
+ $progress = $('.definition .ui.progress').not('.success, .error, .warning, .indicating'),
+ $indicating = $('.definition .ui.indicating.progress'),
+ $indicatingButton = $('.definition .indicating.example .button'),
+ $stateProgress = $('.definition .ui.success.progress, .ui.warning.progress, .ui.error.progress')
;
setTimeout(function() {
+ $indicatingButton
+ .on('click', function() {
+ var
+ $progress = $(this).closest('.example').find('.progress')
+ ;
+ if( $(this).hasClass('increment') ) {
+ $progress.progress('increment');
+ }
+ else {
+ $progress.progress('decrement');
+ }
+ })
+ ;
+
+ $indicating
+ .progress({
+ label : false,
+ total : 10,
+ text : {
+ active: '{percent}% Funded',
+ success: 'Project Funded!'
+ }
+ })
+ ;
+
$progress
.progress({
showActivity: false,
diff --git a/src/definitions/elements/button.less b/src/definitions/elements/button.less
index d9c379dda..e143ab471 100755
--- a/src/definitions/elements/button.less
+++ b/src/definitions/elements/button.less
@@ -583,10 +583,7 @@
.ui.icon.button > .icon {
opacity: @iconButtonOpacity;
margin: 0em;
- vertical-align: top;
-}
-.ui.icon.buttons .button > .icon,
-.ui.icon.button > .icon {
+ vertical-align: baseline;
height: 0em;
}
diff --git a/src/definitions/modules/progress.less b/src/definitions/modules/progress.less
index fb2362631..4610ae9a0 100755
--- a/src/definitions/modules/progress.less
+++ b/src/definitions/modules/progress.less
@@ -37,17 +37,40 @@
margin: @lastMargin;
}
-/* Indicating Variation
-
-.ui.progress .bar[style^="width:1"],
-.ui.progress .bar[style^="width:2"],
-.ui.progress .bar[style^="width:3"],
-.ui.progress .bar[style^="width: 1"],
-.ui.progress .bar[style^="width: 2"],
-.ui.progress .bar[style^="width: 3"], {
- background-color: #F43114;
+/* Indicating */
+.ui.indicating.progress .bar[style^="width: 3"]{
+ background-color: #D9A65C;
+}
+.ui.indicating.progress .bar[style^="width: 4"],
+.ui.indicating.progress .bar[style^="width: 5"] {
+ background-color: #E6BB48;
+}
+.ui.indicating.progress .bar[style^="width: 6"] {
+ background-color: #DDC928;
+}
+.ui.indicating.progress .bar[style^="width: 7"],
+.ui.indicating.progress .bar[style^="width: 8"] {
+ background-color: #B4D95C;
+}
+.ui.indicating.progress .bar[style^="width: 9"],
+.ui.indicating.progress .bar[style^="width: 100"] {
+ background-color: #66DA81;
+}
+
+/* Single Digits Last */
+.ui.indicating.progress .bar[style^="width: 1%"],
+.ui.indicating.progress .bar[style^="width: 2%"],
+.ui.indicating.progress .bar[style^="width: 3%"],
+.ui.indicating.progress .bar[style^="width: 4%"],
+.ui.indicating.progress .bar[style^="width: 5%"],
+.ui.indicating.progress .bar[style^="width: 6%"],
+.ui.indicating.progress .bar[style^="width: 7%"],
+.ui.indicating.progress .bar[style^="width: 8%"],
+.ui.indicating.progress .bar[style^="width: 9%"],
+.ui.indicating.progress .bar[style^="width: 1"],
+.ui.indicating.progress .bar[style^="width: 2"] {
+ background-color: #D95C5C;
}
-*/
/*******************************
Content