You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@ambari.apache.org by ab...@apache.org on 2015/04/29 11:07:08 UTC
[2/2] ambari git commit: AMBARI-10820 Slider widget needs slight
refactoring along with padding fixes. (ababiichuk)
AMBARI-10820 Slider widget needs slight refactoring along with padding fixes. (ababiichuk)
Project: http://git-wip-us.apache.org/repos/asf/ambari/repo
Commit: http://git-wip-us.apache.org/repos/asf/ambari/commit/a39eb7d3
Tree: http://git-wip-us.apache.org/repos/asf/ambari/tree/a39eb7d3
Diff: http://git-wip-us.apache.org/repos/asf/ambari/diff/a39eb7d3
Branch: refs/heads/trunk
Commit: a39eb7d3bc158844e62d59af620d98740518e12b
Parents: 7be88f6
Author: aBabiichuk <ab...@cybervisiontech.com>
Authored: Wed Apr 29 11:43:06 2015 +0300
Committer: aBabiichuk <ab...@cybervisiontech.com>
Committed: Wed Apr 29 11:43:06 2015 +0300
----------------------------------------------------------------------
ambari-web/app/styles/application.less | 3 +-
ambari-web/app/styles/widgets.less | 42 ++++++++++++++------
.../widgets/slider_config_widget_view.js | 6 +--
3 files changed, 33 insertions(+), 18 deletions(-)
----------------------------------------------------------------------
http://git-wip-us.apache.org/repos/asf/ambari/blob/a39eb7d3/ambari-web/app/styles/application.less
----------------------------------------------------------------------
diff --git a/ambari-web/app/styles/application.less b/ambari-web/app/styles/application.less
index fdea9e5..271771d 100644
--- a/ambari-web/app/styles/application.less
+++ b/ambari-web/app/styles/application.less
@@ -5631,10 +5631,11 @@ input[type="radio"].align-checkbox, input[type="checkbox"].align-checkbox {
margin: 0 -20px;
.config-section {
height: 100%;
- padding: 0 30px 20px 30px;
+ padding: 18px;
border: 1px solid #aaa;
vertical-align: top;
h4 {
+ margin: 0px;
font-size: 22px;
font-weight: 400;
}
http://git-wip-us.apache.org/repos/asf/ambari/blob/a39eb7d3/ambari-web/app/styles/widgets.less
----------------------------------------------------------------------
diff --git a/ambari-web/app/styles/widgets.less b/ambari-web/app/styles/widgets.less
index dd75d66..b4dc883 100644
--- a/ambari-web/app/styles/widgets.less
+++ b/ambari-web/app/styles/widgets.less
@@ -20,21 +20,25 @@
@undo-btn-margin: 10px;
@combo-widget-width: 100px;
@green: #6ebd45;
+@slider-light-grey: #e6e6e6;
+@slider-dark-grey: #aaaaaa;
@slider-widget-border-color: #999;
@slider-widget-width: 220px;
@slider-widget-tooltip-background-color: @green;
-@slider-widget-selection-background-color: @green;
+@slider-widget-selection-background-color: @slider-dark-grey;
@slider-widget-body-height: 10px;
-@slider-widget-body-background-color: #ccc;
-@slider-widget-tick-height: 8px;
+@slider-widget-body-background-color: @slider-light-grey;
+@slider-widget-tick-height: 6px;
@slider-widget-tick-width: 1px;
-@slider-widget-tick-background-color: #808080;
-@slider-widget-tick-label-color: #aaa;
+@slider-widget-tick-background-color: @slider-dark-grey;
+@slider-widget-tick-label-color: @slider-dark-grey;
@slider-widget-tooltip-background: @slider-widget-tooltip-background-color;
@slider-widget-disabled-selection-background-color: lighten(@slider-widget-selection-background-color, 20%);
+
@widget-config-override-action-color: #cbcbcb;
@widget-config-override-action-active-color: #acacac;
+
@toggle-widget-handle-background-color: #f3f3f3;
@toggle-widget-text-color: #fff;
@toggle-widget-text-size: 12px;
@@ -105,6 +109,7 @@
.widget-config-label {
display: inline-block;
+ padding-bottom: 13px;
margin-bottom: 15px;
}
.slider-track {
@@ -119,7 +124,7 @@
.slider.slider-horizontal {
width: @slider-widget-width;
.tooltip {
- margin-top: -23px;
+ margin-top: -24px;
opacity: 1;
font-size: 10px;
line-height: 14px;
@@ -158,29 +163,34 @@
margin-left: -1px;
}
&.slider-tick-default {
- margin-top: -22px;
- &:before {
- height: 53px;
- }
+ width: 0;
+ height: 0;
+ border-left: 5px solid transparent;
+ border-right: 5px solid transparent;
+ border-bottom: 5px solid @slider-dark-grey;
+ margin-left: -5px;
> span {
color: @slider-widget-tick-label-color;
font-size: 10px;
}
+ &::before {
+ display: none;
+ }
}
}
&.slider-disabled {
.tooltip-arrow {
- border-top-color: @slider-widget-body-background-color;
+ border-top-color: lighten(@green, 20%);;
}
.tooltip-inner {
- background-color: @slider-widget-body-background-color;
+ background-color: lighten(@green, 20%);;
}
}
}
.slider-handle {
margin-top: -4px !important;
height: 14px;
- width: 2px;
+ width: 3px;
margin-left: -1px !important;
background-color: @slider-widget-selection-background-color;
background-image: none;
@@ -229,6 +239,12 @@
.slider-selection {
background-color: @slider-widget-disabled-selection-background-color;
}
+ .slider-track {
+ div.slider-handle {
+ background-image: none;
+ background-color: @slider-widget-disabled-selection-background-color;
+ }
+ }
}
.spinner-input-widget {
http://git-wip-us.apache.org/repos/asf/ambari/blob/a39eb7d3/ambari-web/app/views/common/configs/widgets/slider_config_widget_view.js
----------------------------------------------------------------------
diff --git a/ambari-web/app/views/common/configs/widgets/slider_config_widget_view.js b/ambari-web/app/views/common/configs/widgets/slider_config_widget_view.js
index a27ce61..394ad6a 100644
--- a/ambari-web/app/views/common/configs/widgets/slider_config_widget_view.js
+++ b/ambari-web/app/views/common/configs/widgets/slider_config_widget_view.js
@@ -367,10 +367,8 @@ App.SliderConfigWidgetView = App.ConfigWidgetView.extend({
return false;
});
// create label for default value and align it
-
- defaultSliderTick.append('<span>{0}</span>'.format(recommendedValue + this.get('unitLabel')));
- defaultSliderTick.find('span').css('marginLeft', -defaultSliderTick.find('span').width()/2 + 'px');
-
+ // defaultSliderTick.append('<span>{0}</span>'.format(recommendedValue + this.get('unitLabel')));
+ // defaultSliderTick.find('span').css('marginLeft', -defaultSliderTick.find('span').width()/2 + 'px');
// if mirrored value was added need to hide the tick for it
if (recommendedValueMirroredId) {
sliderTicks.eq(recommendedValueMirroredId).hide();