From 8e45862439b2e7ca5264d05672253a76d4e65919 Mon Sep 17 00:00:00 2001 From: Jared Tabor Date: Thu, 11 Feb 2016 17:20:03 -0800 Subject: [PATCH] Number input styling --- awx/ui/client/legacy-styles/forms.less | 33 ++++++++++++++++++++++++++ awx/ui/client/src/shared/directives.js | 6 +++++ 2 files changed, 39 insertions(+) diff --git a/awx/ui/client/legacy-styles/forms.less b/awx/ui/client/legacy-styles/forms.less index a9854adb97..5b017169fd 100644 --- a/awx/ui/client/legacy-styles/forms.less +++ b/awx/ui/client/legacy-styles/forms.less @@ -157,6 +157,39 @@ border:1px solid @field-border-sel; } +.ui-spinner{ + height: 30px; + background-color: @field-secondary-bg; + border-radius: 5px; + border:1px solid @field-border; + color: @field-input-text; +} + +.ui-spinner-input{ + color: @field-input-text; + background-color: @field-secondary-bg; +} + +.ui-spinner-input:focus{ + outline: none; +} + +.ui-spinner-button{ + border-left:1px solid @field-border!important; + background-color: @field-button-bg !important; +} + +.ui-spinner-button:hover{ + background-color:@field-button-hov !important; + cursor: pointer!important; +} + +.Form-numberInputButton{ + color: @field-label!important; + font-size: 14px; + +} + .Form-dropDown { height: 30px !important; background-color: @field-secondary-bg!important; diff --git a/awx/ui/client/src/shared/directives.js b/awx/ui/client/src/shared/directives.js index 357988c986..54e955605a 100644 --- a/awx/ui/client/src/shared/directives.js +++ b/awx/ui/client/src/shared/directives.js @@ -733,6 +733,10 @@ angular.module('AWDirectives', ['RestServices', 'Utilities', 'JobsHelper']) max: elm.attr('max'), numberFormat: "d", disabled: (elm.attr('readonly')) ? true : false, + icons: { + down: "Form-numberInputButton fa fa-angle-down", + up: "Form-numberInputButton fa fa-angle-up" + }, spin: function(e, u) { ctrl.$setViewValue(u.value); ctrl.$setValidity('required',true); @@ -753,6 +757,8 @@ angular.module('AWDirectives', ['RestServices', 'Utilities', 'JobsHelper']) opts.disabled = true; } $(elm).spinner(opts); + $('.ui-icon').text(''); + $(".ui-icon").removeClass('ui-icon ui-icon-triangle-1-n ui-icon-triangle-1-s'); $(elm).on("click", function () { $(elm).select(); });