Fixes #1211: ISlider: Provide proper feedback (current value) to user when moving handle

svn changeset:10477/svn branch:6.2

9 files changed, 64 insertions, 4 deletions

diff --git a/WebContent/VAADIN/themes/base/slider/slider.css b/WebContent/VAADIN/themes/base/slider/slider.css
index 7df6a4d667..5ee6cbf31c 100644
--- a/WebContent/VAADIN/themes/base/slider/slider.css
+++ b/WebContent/VAADIN/themes/base/slider/slider.css
@@ -38,6 +38,21 @@
 	margin-left: -5px;
 }
 
+.v-slider-feedback {
+	padding: 2px 5px;
+	background: #444;
+	color: #fff;
+	font-size: 11px;
+	line-height: 13px;
+	font-weight: bold;
+	font-family: Arial, Helvetica, sans-serif;
+	border-radius: 4px;
+	-webkit-border-radius: 4px;
+	-moz-border-radius: 4px;
+	margin: -2px 0 0 2px;
+	text-shadow: 0 1px 0 #000;
+}
+
 /* Disabled by default
 .v-slider-error .v-slider-base {
 	background: #FFE0E0;
diff --git a/WebContent/VAADIN/themes/base/styles.css b/WebContent/VAADIN/themes/base/styles.css
index 2c508ca59e..cafbc018ca 100644
--- a/WebContent/VAADIN/themes/base/styles.css
+++ b/WebContent/VAADIN/themes/base/styles.css
@@ -1151,6 +1151,21 @@ div.v-progressindicator-indeterminate-disabled {
 	margin-left: -5px;
 }
 
+.v-slider-feedback {
+	padding: 2px 5px;
+	background: #444;
+	color: #fff;
+	font-size: 11px;
+	line-height: 13px;
+	font-weight: bold;
+	font-family: Arial, Helvetica, sans-serif;
+	border-radius: 4px;
+	-webkit-border-radius: 4px;
+	-moz-border-radius: 4px;
+	margin: -2px 0 0 2px;
+	text-shadow: 0 1px 0 #000;
+}
+
 /* Disabled by default
 .v-slider-error .v-slider-base {
 	background: #FFE0E0;
diff --git a/WebContent/VAADIN/themes/reindeer/common/img/vertical-sprites-ie6.png b/WebContent/VAADIN/themes/reindeer/common/img/vertical-sprites-ie6.png
index c11ee47f9e..ec72a8b6a3 100644
--- a/WebContent/VAADIN/themes/reindeer/common/img/vertical-sprites-ie6.png
+++ b/WebContent/VAADIN/themes/reindeer/common/img/vertical-sprites-ie6.png
diff --git a/WebContent/VAADIN/themes/reindeer/common/img/vertical-sprites.png b/WebContent/VAADIN/themes/reindeer/common/img/vertical-sprites.png
index 4a4537ac06..c0e29a99f5 100644
--- a/WebContent/VAADIN/themes/reindeer/common/img/vertical-sprites.png
+++ b/WebContent/VAADIN/themes/reindeer/common/img/vertical-sprites.png
diff --git a/WebContent/VAADIN/themes/reindeer/slider/img/knob-pressed.png b/WebContent/VAADIN/themes/reindeer/slider/img/knob-pressed.png
index 3ea2724e77..d5afcb71a0 100644
--- a/WebContent/VAADIN/themes/reindeer/slider/img/knob-pressed.png
+++ b/WebContent/VAADIN/themes/reindeer/slider/img/knob-pressed.png
diff --git a/WebContent/VAADIN/themes/reindeer/slider/slider.css b/WebContent/VAADIN/themes/reindeer/slider/slider.css
index 33ce41ca72..cb5a0f7dbe 100644
--- a/WebContent/VAADIN/themes/reindeer/slider/slider.css
+++ b/WebContent/VAADIN/themes/reindeer/slider/slider.css
@@ -17,7 +17,7 @@
 	height: 10px;
 	margin-top: -5px;
 }
-.v-slider-handle:active {
+.v-slider-handle-active {
 	background-image: url(img/knob-pressed.png); /** sprite-ref: verticals */
 }
 .v-slider-vertical {
diff --git a/WebContent/VAADIN/themes/reindeer/styles.css b/WebContent/VAADIN/themes/reindeer/styles.css
index ee9629160e..88e27aacf6 100644
--- a/WebContent/VAADIN/themes/reindeer/styles.css
+++ b/WebContent/VAADIN/themes/reindeer/styles.css
@@ -1151,6 +1151,21 @@ div.v-progressindicator-indeterminate-disabled {
 	margin-left: -5px;
 }
 
+.v-slider-feedback {
+	padding: 2px 5px;
+	background: #444;
+	color: #fff;
+	font-size: 11px;
+	line-height: 13px;
+	font-weight: bold;
+	font-family: Arial, Helvetica, sans-serif;
+	border-radius: 4px;
+	-webkit-border-radius: 4px;
+	-moz-border-radius: 4px;
+	margin: -2px 0 0 2px;
+	text-shadow: 0 1px 0 #000;
+}
+
 /* Disabled by default
 .v-slider-error .v-slider-base {
 	background: #FFE0E0;
@@ -3650,7 +3665,7 @@ td.v-datefield-calendarpanel-nextyear {
 	height: 10px;
 	margin-top: -5px;
 }
-.v-slider-handle:active {
+.v-slider-handle-active {
   background-image: url(common/img/vertical-sprites.png);
   -background-image: url(common/img/vertical-sprites-ie6.png);
   background-position: left -895px;
diff --git a/WebContent/VAADIN/themes/runo/slider/slider.css b/WebContent/VAADIN/themes/runo/slider/slider.css
index 5665a2aaee..07b10dfa17 100644
--- a/WebContent/VAADIN/themes/runo/slider/slider.css
+++ b/WebContent/VAADIN/themes/runo/slider/slider.css
@@ -51,7 +51,7 @@
 	height: 12px;
 	margin-left: -5px;
 }
-.v-slider-vertical .v-slider-handle:hover {
+.v-slider-vertical .v-slider-handle-active {
 	background-position: left bottom;
 }
 
diff --git a/WebContent/VAADIN/themes/runo/styles.css b/WebContent/VAADIN/themes/runo/styles.css
index 0ae0f686f0..5626fae70d 100644
--- a/WebContent/VAADIN/themes/runo/styles.css
+++ b/WebContent/VAADIN/themes/runo/styles.css
@@ -1151,6 +1151,21 @@ div.v-progressindicator-indeterminate-disabled {
 	margin-left: -5px;
 }
 
+.v-slider-feedback {
+	padding: 2px 5px;
+	background: #444;
+	color: #fff;
+	font-size: 11px;
+	line-height: 13px;
+	font-weight: bold;
+	font-family: Arial, Helvetica, sans-serif;
+	border-radius: 4px;
+	-webkit-border-radius: 4px;
+	-moz-border-radius: 4px;
+	margin: -2px 0 0 2px;
+	text-shadow: 0 1px 0 #000;
+}
+
 /* Disabled by default
 .v-slider-error .v-slider-base {
 	background: #FFE0E0;
@@ -2755,7 +2770,7 @@ div.v-tree-node-leaf {
 	height: 12px;
 	margin-left: -5px;
 }
-.v-slider-vertical .v-slider-handle:hover {
+.v-slider-vertical .v-slider-handle-active {
 	background-position: left bottom;
 }