/* NumberSpinner - namespace "dijitSpinner" * * Styling NumberSpinner mainly includes: * * 1. Arrows * Outer containers: .dijitSpinnerButtonContainer|.dijitSpinnerButtonInner - for border, padding and position * Arrows: .dijitArrowButton|.dijitUpArrowButton.|dijitDownArrowButton * Inner container: .dijitArrowButtonInner - for border, padding, width|height and background image * * 2. Hover state * .dijitUpArrowButtonHover|.dijitDownArrowButtonHover .* - for background color|image * * 3. Active state * .dijitUpArrowButtonActive|.dijitDownArrowButtonActive .* - for border, padding, margin and background color|image * * 4. Focused state * .dijitSpinnerFocused .* - for background color|image * * 5. Disabled state * .dijitSpinnerDisabled .* - for background color|image */ .flat .dijitSpinner .dijitSpinnerButtonContainer { overflow: hidden; position: relative; width: auto; padding: 0; border: 1px solid #9e9e9e; } .flat .dijitSpinner .dijitSpinnerButtonInner { width: 30px; padding: 4px 0 !important; margin: 0; } .flat .dijitSpinner .dijitArrowButton { border-style: solid; border-width: 1px; border-color: #9e9e9e; padding: 4px; border-radius: 3px; line-height: 20px; cursor: pointer; -webkit-transition: all 0.05s linear; -moz-transition: all 0.05s linear; -o-transition: all 0.05s linear; -ms-transition: all 0.05s linear; transition: all 0.05s linear; background: #fff; border-radius: 0; border: 0; width: auto; overflow: hidden; left: 0; right: 0; padding: 0; } .flat .dijitSpinner .dijitArrowButton:before { content: none; } .flat .dijitSpinner .dijitUpArrowButton { border-top-right-radius: 2.000000000000001px; } .flat .dijitSpinner .dijitDownArrowButton { border-bottom-right-radius: 2.000000000000001px; } .flat .dijitSpinner .dijitUpArrowButtonHover, .flat .dijitSpinner .dijitDownArrowButtonHover { -webkit-transition: all 0.1s; -moz-transition: all 0.1s; -o-transition: all 0.1s; -ms-transition: all 0.1s; transition: all 0.1s; background: #f2f2f2; border-color: #d9d9d9; } .flat .dijitSpinner .dijitDownArrowButtonActive, .flat .dijitSpinner .dijitUpArrowButtonActive { -webkit-transition: none; -moz-transition: none; -o-transition: none; -ms-transition: none; transition: none; outline: none; -webkit-box-shadow: inset 0 3px 5px rgba(0,0,0,0.05); box-shadow: inset 0 3px 5px rgba(0,0,0,0.05); background: #e0e0e0; border-color: #b3b3b3; } .flat .dijitSpinner .dijitArrowButtonInner { line-height: 16px; display: block; } .flat .dijitSpinner .dijitArrowButtonInner .dijitInputField { padding: 0; } .flat .dijitSpinner .dijitArrowButtonInner:before { content: "\f003"; } .flat .dijitSpinner .dijitDownArrowButton .dijitArrowButtonInner:before { content: "\f002"; } .flat .dijitSpinnerDisabled .dijitDownArrowButton, .flat .dijitSpinnerDisabled .dijitUpArrowButton { cursor: default; color: #9e9e9e; background-color: #f5f5f5; border-color: #e3e3e3; } .flat .alt-primary .dijitSpinnerButtonContainer { border-color: #1e88e5; } .flat .alt-success .dijitSpinnerButtonContainer { border-color: #43a047; } .flat .alt-info .dijitSpinnerButtonContainer { border-color: #03a9f4; } .flat .alt-warning .dijitSpinnerButtonContainer { border-color: #fb8c00; } .flat .alt-danger .dijitSpinnerButtonContainer { border-color: #e53935; } .flat .alt-inverse .dijitSpinnerButtonContainer { border-color: #616161; }