diff --git a/ui/app/components/stepper-input.js b/ui/app/components/stepper-input.js index 09db48532..871d74729 100644 --- a/ui/app/components/stepper-input.js +++ b/ui/app/components/stepper-input.js @@ -9,7 +9,7 @@ const ESC = 27; @classic @classNames('stepper-input') -@classNameBindings('class') +@classNameBindings('class', 'disabled:is-disabled') export default class StepperInput extends Component { min = 0; max = 10; diff --git a/ui/app/styles/components/stepper-input.scss b/ui/app/styles/components/stepper-input.scss index 3d48f91ea..605934693 100644 --- a/ui/app/styles/components/stepper-input.scss +++ b/ui/app/styles/components/stepper-input.scss @@ -7,8 +7,10 @@ line-height: 1; border-radius: $radius; padding-left: 0.75em; - whitespace: nowrap; + white-space: nowrap; height: 2.25em; + font-size: $body-size; + vertical-align: top; .stepper-input-label { display: flex; @@ -75,4 +77,26 @@ } } } + + &.is-small { + font-size: $size-small; + } + + &.is-medium { + font-size: $size-medium; + } + + &.is-large { + font-size: $size-large; + } + + &.is-disabled { + opacity: 0.5; + + .stepper-input-input { + opacity: 1; + color: $grey; + background-color: $white; + } + } } diff --git a/ui/app/templates/components/stepper-input.hbs b/ui/app/templates/components/stepper-input.hbs index 70f7c024c..80440a605 100644 --- a/ui/app/templates/components/stepper-input.hbs +++ b/ui/app/templates/components/stepper-input.hbs @@ -5,6 +5,7 @@ min={{min}} max={{max}} value={{internalValue}} + disabled={{disabled}} class="stepper-input-input" onKeyDown={{action "resetTextInput"}} onChange={{action "setValue"}}> @@ -12,7 +13,7 @@ data-test-stepper-decrement role="button" class="stepper-input-stepper button {{class}}" - disabled={{lte internalValue min}} + disabled={{or disabled (lte internalValue min)}} onclick={{action "decrement"}}> {{x-icon "minus-plain"}} @@ -20,7 +21,7 @@ data-test-stepper-increment role="button" class="stepper-input-stepper button {{class}}" - disabled={{gte internalValue max}} + disabled={{or disabled (gte internalValue max)}} onclick={{action "increment"}}> {{x-icon "plus-plain"}} diff --git a/ui/app/templates/jobs/job/task-group.hbs b/ui/app/templates/jobs/job/task-group.hbs index ac438fc88..8cd257711 100644 --- a/ui/app/templates/jobs/job/task-group.hbs +++ b/ui/app/templates/jobs/job/task-group.hbs @@ -10,7 +10,12 @@