/** * Creates a visual theme for a {@link #scale small} Button. * * @param {string} $ui * The name of the UI being created. Can not included spaces or special punctuation * (used in CSS class names). * * @param {number} [$border-radius=$button-small-border-radius] * The border-radius of the button * * @param {number} [$border-width=$button-small-border-width] * The border-width of the button * * @param {color} [$border-color=$button-default-border-color] * The border-color of the button * * @param {color} [$border-color-over=$button-default-border-color-over] * The border-color of the button when the cursor is over the button * * @param {color} [$border-color-focus=$button-default-border-color-focus] * The border-color of the button when focused * * @param {color} [$border-color-pressed=$button-default-border-color-pressed] * The border-color of the button when pressed * * @param {color} [$border-color-focus-over=$button-default-border-color-focus-over] * The border-color of the button when the button is focused and the cursor is over the * button * * @param {color} [$border-color-focus-pressed=$button-default-border-color-focus-pressed] * The border-color of the button when focused and pressed * * @param {color} [$border-color-disabled=$button-default-border-color-disabled] * The border-color of the button when disabled * * @param {number} [$padding=$button-small-padding] * The amount of padding inside the border of the button on all sides * * @param {number} [$text-padding=$button-small-text-padding] * The amount of horizontal space to add to the left and right of the button text * * @param {color} [$background-color=$button-default-background-color] * The background-color of the button * * @param {color} [$background-color-over=$button-default-background-color-over] * The background-color of the button when the cursor is over the button * * @param {color} [$background-color-focus=$button-default-background-color-focus] * The background-color of the button when focused * * @param {color} [$background-color-pressed=$button-default-background-color-pressed] * The background-color of the button when pressed * * @param {color} [$background-color-focus-over=$button-default-background-color-focus-over] * The background-color of the button when the button is focused and the cursor is over * the button * * @param {color} [$background-color-focus-pressed=$button-default-background-color-focus-pressed] * The background-color of the button when focused and pressed * * @param {color} [$background-color-disabled=$button-default-background-color-disabled] * The background-color of the button when disabled * * @param {string/list} [$background-gradient=$button-default-background-gradient] * The background-gradient for the button. Can be either the name of a predefined gradient * or a list of color stops. Used as the `$type` parameter for {@link Global_CSS#background-gradient}. * * @param {string/list} [$background-gradient-over=$button-default-background-gradient-over] * The background-gradient to use when the cursor is over the button. Can be either the * name of a predefined gradient or a list of color stops. Used as the `$type` parameter * for {@link Global_CSS#background-gradient}. * * @param {string/list} [$background-gradient-focus=$button-default-background-gradient-focus] * The background-gradient to use when the the button is focused. Can be either the name * of a predefined gradient or a list of color stops. Used as the `$type` parameter for * {@link Global_CSS#background-gradient}. * * @param {string/list} [$background-gradient-pressed=$button-default-background-gradient-pressed] * The background-gradient to use when the the button is pressed. Can be either the name * of a predefined gradient or a list of color stops. Used as the `$type` parameter for * {@link Global_CSS#background-gradient}. * * @param {string} [$background-gradient-focus-over=$button-default-background-gradient-focus-over] * The background-gradient to use when the the button is focused and the cursor is over * the button. Can be either the name of a predefined gradient or a list of color stops. * Used as the `$type` parameter for {@link Global_CSS#background-gradient}. * * @param {string} [$background-gradient-focus-pressed=$button-default-background-gradient-focus-pressed] * The background-gradient to use when the the button is focused and pressed. Can be * either the name of a predefined gradient or a list of color stops. Used as the `$type` * parameter for {@link Global_CSS#background-gradient}. * * @param {string/list} [$background-gradient-disabled=$button-default-background-gradient-disabled] * The background-gradient to use when the the button is disabled. Can be either the name * of a predefined gradient or a list of color stops. Used as the `$type` parameter for * {@link Global_CSS#background-gradient}. * * @param {color} [$color=$button-default-color] * The text color of the button * * @param {color} [$color-over=$button-default-color-over] * The text color of the button when the cursor is over the button * * @param {color} [$color-focus=$button-default-color-focus] * The text color of the button when the button is focused * * @param {color} [$color-pressed=$button-default-color-pressed] * The text color of the button when the button is pressed * * @param {color} [$color-focus-over=$button-default-color-focus-over] * The text color of the button when the button is focused and the cursor is over the button * * @param {color} [$color-focus-pressed=$button-default-color-focus-pressed] * The text color of the button when the button is focused and pressed * * @param {color} [$color-disabled=$button-default-color-disabled] * The text color of the button when the button is disabled * * @param {number/list} [$inner-border-width=$button-default-inner-border-width] * The inner border-width of the button * * @param {number/list} [$inner-border-width-over=$button-default-inner-border-width-over] * The inner border-width of the button when the cursor is over the button * * @param {number/list} [$inner-border-width-focus=$button-default-inner-border-width-focus] * The inner border-width of the button when focused * * @param {number/list} [$inner-border-width-pressed=$button-default-inner-border-width-pressed] * The inner border-width of the button when pressed * * @param {number/list} [$inner-border-width-focus-over=$button-default-inner-border-width-focus-over] * The inner border-width of the button when the button is focused and the cursor is over * the button * * @param {number/list} [$inner-border-width-focus-pressed=$button-default-inner-border-width-focus-pressed] * The inner border-width of the button when focused and pressed * * @param {number/list} [$inner-border-width-disabled=$button-default-inner-border-width-disabled] * The inner border-width of the button when disabled * * @param {color} [$inner-border-color=$button-default-inner-border-color] * The inner border-color of the button * * @param {color} [$inner-border-color-over=$button-default-inner-border-color-over] * The inner border-color of the button when the cursor is over the button * * @param {color} [$inner-border-color-focus=$button-default-inner-border-color-focus] * The inner border-color of the button when focused * * @param {color} [$inner-border-color-pressed=$button-default-inner-border-color-pressed] * The inner border-color of the button when pressed * * @param {color} [$inner-border-color-focus-over=$button-default-inner-border-color-focus-over] * The inner border-color of the button when the button is focused and the cursor is over * the button * * @param {color} [$inner-border-color-focus-pressed=$button-default-inner-border-color-focus-pressed] * The inner border-color of the button when focused and pressed * * @param {color} [$inner-border-color-disabled=$button-default-inner-border-color-disabled] * The inner border-color of the button when disabled * * @param {number} [$body-outline-width-focus=$button-default-body-outline-width-focus] * The body outline width of the button when focused * * @param {number} [$body-outline-style-focus=$button-default-body-outline-style-focus] * The body outline-style of the button when focused * * @param {number} [$body-outline-color-focus=$button-default-body-outline-color-focus] * The body outline color of the button when focused * * @param {number} [$font-size=$button-small-font-size] * The font-size of the button * * @param {number} [$font-size-over=$button-small-font-size-over] * The font-size of the button when the cursor is over the button * * @param {number} [$font-size-focus=$button-small-font-size-focus] * The font-size of the button when the button is focused * * @param {number} [$font-size-pressed=$button-small-font-size-pressed] * The font-size of the button when the button is pressed * * @param {number} [$font-size-focus-over=$button-small-font-size-focus-over] * The font-size of the button when the button is focused and the cursor is over the * button * * @param {number} [$font-size-focus-pressed=$button-small-font-size-focus-pressed] * The font-size of the button when the button is focused and pressed * * @param {number} [$font-size-disabled=$button-small-font-size-disabled] * The font-size of the button when the button is disabled * * @param {string} [$font-weight=$button-small-font-weight] * The font-weight of the button * * @param {string} [$font-weight-over=$button-small-font-weight-over] * The font-weight of the button when the cursor is over the button * * @param {string} [$font-weight-focus=$button-small-font-weight-focus] * The font-weight of the button when the button is focused * * @param {string} [$font-weight-pressed=$button-small-font-weight-pressed] * The font-weight of the button when the button is pressed * * @param {string} [$font-weight-focus-over=$button-small-font-weight-focus-over] * The font-weight of the button when the button is focused and the cursor is over the * button * * @param {string} [$font-weight-focus-pressed=$button-small-font-weight-focus-pressed] * The font-weight of the button when the button is focused and pressed * * @param {string} [$font-weight-disabled=$button-small-font-weight-disabled] * The font-weight of the button when the button is disabled * * @param {string} [$font-family=$button-small-font-family] * The font-family of the button * * @param {string} [$font-family-over=$button-small-font-family-over] * The font-family of the button when the cursor is over the button * * @param {string} [$font-family-focus=$button-small-font-family-focus] * The font-family of the button when the button is focused * * @param {string} [$font-family-pressed=$button-small-font-family-pressed] * The font-family of the button when the button is pressed * * @param {string} [$font-family-focus-over=$button-small-font-family-focus-over] * The font-family of the button when the button is focused and the cursor is over the * button * * @param {string} [$font-family-focus-pressed=$button-small-font-family-focus-pressed] * The font-family of the button when the button is focused and pressed * * @param {string} [$font-family-disabled=$button-small-font-family-disabled] * The font-family of the button when the button is disabled * * @param {number} [$line-height=$button-small-line-height] * The line-height of the button text * * @param {number} [$icon-size=$button-small-icon-size] * The size of the button icon * * @param {number} [$glyph-font-size=$button-small-glyph-font-size] * The font-size for the button glyph * * @param {number} [$icon-spacing=$button-small-icon-spacing] * The space between the button's icon and text * * @param {color} [$glyph-color=$button-default-glyph-color] * The color of the button's {@link #glyph} icon * * @param {number} [$glyph-opacity=$button-default-glyph-opacity] * The opacity of the button's {@link #glyph} icon * * @param {number} [$arrow-width=$button-small-arrow-width] * The width of the button's {@link #cfg-menu} arrow * * @param {number} [$arrow-height=$button-small-arrow-height] * The height of the button's {@link #cfg-menu} arrow * * @param {string/list} [$arrow-glyph=$button-small-arrow-glyph] * Glyph for the button arrow when when {@link Global_CSS#$enable-font-icons} is `true`. * * @param {string/list} [$arrow-glyph-color=$button-default-arrow-glyph-color] * Glyph color for the button arrow when when {@link Global_CSS#$enable-font-icons} is `true`. * * @param {number} [$split-width=$button-small-split-width] * The width of a {@link Ext.button.Split Split Button}'s arrow * * @param {number} [$split-height=$button-small-split-height] * The height of a {@link Ext.button.Split Split Button}'s arrow * * @param {number} [$split-line-width=$button-small-split-line-width] * The default width for a {@link Ext.button.Split Split Button}'s line. * Themes that include the line in the arrow background image should set this to 0 * * @param {color} [$split-line-color=$button-default-split-line-color] * The color for a {@link Ext.button.Split Split Button}'s line. * Only applicable when `$split-line-width` is greater than 0. * * @param {boolean} [$include-ui-menu-arrows=$button-include-ui-menu-arrows] * True to include the UI name in the file name of the {@link #cfg-menu} * arrow icon. Set this to false to share the same arrow bewteen multiple UIs. * * @param {boolean} [$include-ui-split-arrows=$button-include-ui-split-arrows] * True to include the UI name in the file name of the {@link Ext.button.Split Split Button}'s * arrow icon. Set this to false to share the same arrow bewteen multiple UIs. * * @param {boolean} [$include-split-noline-arrows=$button-include-split-noline-arrows] * True to add a "-noline" suffix to the file name of the {@link Ext.button.Split Split Button}'s * arrow icon. Used for hiding the split line when toolbar buttons are in their default * state. * * @param {boolean} [$include-split-over-arrows=$button-include-split-over-arrows] * True to use a separate icon for {@link Ext.button.Split Split Button}s when the cursor * is over the button. The over icon file name will have a "-o" suffix * * @param {number} [$opacity-disabled=$button-opacity-disabled] * The opacity of the button when it is disabled * * @param {number} [$inner-opacity-disabled=$button-inner-opacity-disabled] * The opacity of the button's text and icon elements when when the button is disabled * * @member Ext.button.Button */@mixin extjs-button-small-ui( $ui, $border-radius: $button-small-border-radius, $border-width: $button-small-border-width, $border-color: null, $border-color-over: null, $border-color-focus: null, $border-color-pressed: null, $border-color-focus-over: null, $border-color-focus-pressed: null, $border-color-disabled: null, $padding: $button-small-padding, $text-padding: $button-small-text-padding, $background-color: null, $background-color-over: null, $background-color-focus: null, $background-color-pressed: null, $background-color-focus-over: null, $background-color-focus-pressed: null, $background-color-disabled: null, $background-gradient: $button-default-background-gradient, $background-gradient-over: $button-default-background-gradient-over, $background-gradient-focus: $button-default-background-gradient-focus, $background-gradient-pressed: $button-default-background-gradient-pressed, $background-gradient-focus-over: $button-default-background-gradient-focus-over, $background-gradient-focus-pressed: $button-default-background-gradient-focus-pressed, $background-gradient-disabled: $button-default-background-gradient-disabled, $color: null, $color-over: null, $color-focus: null, $color-pressed: null, $color-focus-over: null, $color-focus-pressed: null, $color-disabled: null, $inner-border-width: null, $inner-border-width-over: null, $inner-border-width-focus: null, $inner-border-width-pressed: null, $inner-border-width-focus-over: null, $inner-border-width-focus-pressed: null, $inner-border-width-disabled: null, $inner-border-color: null, $inner-border-color-over: null, $inner-border-color-focus: null, $inner-border-color-pressed: null, $inner-border-color-focus-over: null, $inner-border-color-focus-pressed: null, $inner-border-color-disabled: null, $body-outline-width-focus: $button-default-body-outline-width-focus, $body-outline-style-focus: $button-default-body-outline-style-focus, $body-outline-color-focus: $button-default-body-outline-color-focus, $font-size: null, $font-size-over: null, $font-size-focus: null, $font-size-pressed: null, $font-size-focus-over: null, $font-size-focus-pressed: null, $font-size-disabled: null, $font-weight: null, $font-weight-over: null, $font-weight-focus: null, $font-weight-pressed: null, $font-weight-focus-over: null, $font-weight-focus-pressed: null, $font-weight-disabled: null, $font-family: null, $font-family-over: null, $font-family-focus: null, $font-family-pressed: null, $font-family-focus-over: null, $font-family-focus-pressed: null, $font-family-disabled: null, $line-height: $button-small-line-height, $icon-size: $button-small-icon-size, $glyph-font-size: $button-small-glyph-font-size, $icon-spacing: $button-small-icon-spacing, $glyph-color: $button-default-glyph-color, $glyph-opacity: $button-default-glyph-opacity, $arrow-width: $button-small-arrow-width, $arrow-height: $button-small-arrow-height, $arrow-glyph: $button-small-arrow-glyph, $arrow-glyph-color: $button-default-arrow-glyph-color, $split-width: $button-small-split-width, $split-height: $button-small-split-height, $split-line-width: $button-small-split-line-width, $split-line-color: $button-default-split-line-color, $include-ui-menu-arrows: $button-include-ui-menu-arrows, $include-ui-split-arrows: $button-include-ui-split-arrows, $include-split-noline-arrows: $button-include-split-noline-arrows, $include-split-over-arrows: $button-include-split-over-arrows, $opacity-disabled: $button-opacity-disabled, $inner-opacity-disabled: $button-inner-opacity-disabled ) { @if $border-color == null { $border-color: $button-default-border-color; @if $border-color-over == null { $border-color-over: $button-default-border-color-over; } @if $border-color-focus == null { $border-color-focus: $button-default-border-color-focus; } @if $border-color-pressed == null { $border-color-pressed: $button-default-border-color-pressed; } @if $border-color-focus-over == null { $border-color-focus-over: $button-default-border-color-focus-over; } @if $border-color-focus-pressed == null { $border-color-focus-pressed: $button-default-border-color-focus-pressed; } @if $border-color-disabled == null { $border-color-disabled: $button-default-border-color-disabled; } } @else { @if $border-color-over == null { $border-color-over: button-default-border-color-over($border-color); } @if $border-color-focus == null { $border-color-focus: button-default-border-color-focus($border-color); } @if $border-color-pressed == null { $border-color-pressed: button-default-border-color-pressed($border-color); } @if $border-color-focus-over == null { $border-color-focus-over: $border-color-over; } @if $border-color-focus-pressed == null { $border-color-focus-pressed: $border-color-pressed; } @if $border-color-disabled == null { $border-color-disabled: button-default-border-color-disabled($border-color); } } @if $background-color == null { $background-color: $button-default-background-color; @if $background-color-over == null { $background-color-over: $button-default-background-color-over; } @if $background-color-focus == null { $background-color-focus: $button-default-background-color-focus; } @if $background-color-pressed == null { $background-color-pressed: $button-default-background-color-pressed; } @if $background-color-focus-over == null { $background-color-focus-over: $button-default-background-color-focus-over; } @if $background-color-focus-pressed == null { $background-color-focus-pressed: $button-default-background-color-focus-pressed; } @if $background-color-disabled == null { $background-color-disabled: $button-default-background-color-disabled; } } @else { @if $background-color-over == null { $background-color-over: button-default-background-color-over($background-color); } @if $background-color-focus == null { $background-color-focus: button-default-background-color-focus($background-color); } @if $background-color-pressed == null { $background-color-pressed: button-default-background-color-pressed($background-color); } @if $background-color-focus-over == null { $background-color-focus-over: $background-color-over; } @if $background-color-focus-pressed == null { $background-color-focus-pressed: $background-color-pressed; } @if $background-color-disabled == null { $background-color-disabled: button-default-background-color-disabled($background-color); } } @if $color == null { $color: $button-default-color; @if $color-over == null { $color-over: $button-default-color-over; } @if $color-focus == null { $color-focus: $button-default-color-focus; } @if $color-pressed == null { $color-pressed: $button-default-color-pressed; } @if $color-focus-over == null { $color-focus-over: $button-default-color-focus-over; } @if $color-focus-pressed == null { $color-focus-pressed: $button-default-color-focus-pressed; } @if $color-disabled == null { $color-disabled: $button-default-color-disabled; } } @else { @if $color-over == null { $color-over: button-default-color-over($color); } @if $color-focus == null { $color-focus: button-default-color-focus($color); } @if $color-pressed == null { $color-pressed: button-default-color-pressed($color); } @if $color-focus-over == null { $color-focus-over: $color-over; } @if $color-focus-pressed == null { $color-focus-pressed: $color-pressed; } @if $color-disabled == null { $color-disabled: button-default-color-disabled($color); } } @if $inner-border-width == null { $inner-border-width: $button-default-inner-border-width; @if $inner-border-width-over == null { $inner-border-width-over: $button-default-inner-border-width-over; } @if $inner-border-width-focus == null { $inner-border-width-focus: $button-default-inner-border-width-focus; } @if $inner-border-width-pressed == null { $inner-border-width-pressed: $button-default-inner-border-width-pressed; } @if $inner-border-width-focus-over == null { $inner-border-width-focus-over: $button-default-inner-border-width-focus-over; } @if $inner-border-width-focus-pressed == null { $inner-border-width-focus-pressed: $button-default-inner-border-width-focus-pressed; } @if $inner-border-width-disabled == null { $inner-border-width-disabled: $button-default-inner-border-width-disabled; } } @else { @if $inner-border-width-over == null { $inner-border-width-over: $inner-border-width; } @if $inner-border-width-focus == null { $inner-border-width-focus: $inner-border-width; } @if $inner-border-width-pressed == null { $inner-border-width-pressed: $inner-border-width; } @if $inner-border-width-focus-over == null { $inner-border-width-focus-over: $inner-border-width-over; } @if $inner-border-width-focus-pressed == null { $inner-border-width-focus-pressed: $inner-border-width-pressed; } @if $inner-border-width-disabled == null { $inner-border-width-disabled: $inner-border-width; } } @if $inner-border-color == null { $inner-border-color: $button-default-inner-border-color; @if $inner-border-color-over == null { $inner-border-color-over: $button-default-inner-border-color-over; } @if $inner-border-color-focus == null { $inner-border-color-focus: $button-default-inner-border-color-focus; } @if $inner-border-color-pressed == null { $inner-border-color-pressed: $button-default-inner-border-color-pressed; } @if $inner-border-color-focus-over == null { $inner-border-color-focus-over: $button-default-inner-border-color-focus-over; } @if $inner-border-color-focus-pressed == null { $inner-border-color-focus-pressed: $button-default-inner-border-color-focus-pressed; } @if $inner-border-color-disabled == null { $inner-border-color-disabled: $button-default-inner-border-color-disabled; } } @else { @if $inner-border-color-over == null { $inner-border-color-over: button-default-inner-border-color-over($background-color-over, $color-over); } @if $inner-border-color-focus == null { $inner-border-color-focus: button-default-inner-border-color-focus($background-color-focus, $color-focus); } @if $inner-border-color-pressed == null { $inner-border-color-pressed: button-default-inner-border-color-pressed($background-color-pressed, $color-pressed); } @if $inner-border-color-focus-over == null { $inner-border-color-focus-over: button-default-inner-border-color-focus-over($background-color-focus-over, $color-focus-over); } @if $inner-border-color-focus-pressed == null { $inner-border-color-focus-pressed: button-default-inner-border-color-focus-pressed($background-color-focus-pressed, $color-focus-pressed); } @if $inner-border-color-disabled == null { $inner-border-color-disabled: button-default-inner-border-color-disabled($background-color-disabled, $color-disabled); } } @if $font-size == null { $font-size: $button-small-font-size; @if $font-size-over == null { $font-size-over: $button-small-font-size-over; } @if $font-size-focus == null { $font-size-focus: $button-small-font-size-focus; } @if $font-size-pressed == null { $font-size-pressed: $button-small-font-size-pressed; } @if $font-size-focus-over == null { $font-size-focus-over: $button-small-font-size-focus-over; } @if $font-size-focus-pressed == null { $font-size-focus-pressed: $button-small-font-size-focus-pressed; } @if $font-size-disabled == null { $font-size-disabled: $button-small-font-size-disabled; } } @else { @if $font-size-over == null { $font-size-over: $font-size; } @if $font-size-focus == null { $font-size-focus: $font-size; } @if $font-size-pressed == null { $font-size-pressed: $font-size; } @if $font-size-focus-over == null { $font-size-focus-over: $font-size-over; } @if $font-size-focus-pressed == null { $font-size-focus-pressed: $font-size-pressed; } @if $font-size-disabled == null { $font-size-disabled: $font-size; } } @if $font-weight == null { $font-weight: $button-small-font-weight; @if $font-weight-over == null { $font-weight-over: $button-small-font-weight-over; } @if $font-weight-focus == null { $font-weight-focus: $button-small-font-weight-focus; } @if $font-weight-pressed == null { $font-weight-pressed: $button-small-font-weight-pressed; } @if $font-weight-focus-over == null { $font-weight-focus-over: $button-small-font-weight-focus-over; } @if $font-weight-focus-pressed == null { $font-weight-focus-pressed: $button-small-font-weight-focus-pressed; } @if $font-weight-disabled == null { $font-weight-disabled: $button-small-font-weight-disabled; } } @else { @if $font-weight-over == null { $font-weight-over: $font-weight; } @if $font-weight-focus == null { $font-weight-focus: $font-weight; } @if $font-weight-pressed == null { $font-weight-pressed: $font-weight; } @if $font-weight-focus-over == null { $font-weight-focus-over: $font-weight-over; } @if $font-weight-focus-pressed == null { $font-weight-focus-pressed: $font-weight-pressed; } @if $font-weight-disabled == null { $font-weight-disabled: $font-weight; } } @if $font-family == null { $font-family: $button-small-font-family; @if $font-family-over == null { $font-family-over: $button-small-font-family-over; } @if $font-family-focus == null { $font-family-focus: $button-small-font-family-focus; } @if $font-family-pressed == null { $font-family-pressed: $button-small-font-family-pressed; } @if $font-family-focus-over == null { $font-family-focus-over: $button-small-font-family-focus-over; } @if $font-family-focus-pressed == null { $font-family-focus-pressed: $button-small-font-family-focus-pressed; } @if $font-family-disabled == null { $font-family-disabled: $button-small-font-family-disabled; } } @else { @if $font-family-over == null { $font-family-over: $font-family; } @if $font-family-focus == null { $font-family-focus: $font-family; } @if $font-family-pressed == null { $font-family-pressed: $font-family; } @if $font-family-focus-over == null { $font-family-focus-over: $font-family-over; } @if $font-family-focus-pressed == null { $font-family-focus-pressed: $font-family-pressed; } @if $font-family-disabled == null { $font-family-disabled: $font-family; } } @include extjs-button-ui( $ui: '#{$ui}-small', $border-radius: $border-radius, $border-width: $border-width, $border-color: $border-color, $border-color-over: $border-color-over, $border-color-focus: $border-color-focus, $border-color-pressed: $border-color-pressed, $border-color-focus-over: $border-color-focus-over, $border-color-focus-pressed: $border-color-focus-pressed, $border-color-disabled: $border-color-disabled, $padding: $padding, $text-padding: $text-padding, $background-color: $background-color, $background-color-over: $background-color-over, $background-color-focus: $background-color-focus, $background-color-pressed: $background-color-pressed, $background-color-focus-over: $background-color-focus-over, $background-color-focus-pressed: $background-color-focus-pressed, $background-color-disabled: $background-color-disabled, $background-gradient: $background-gradient, $background-gradient-over: $background-gradient-over, $background-gradient-focus: $background-gradient-focus, $background-gradient-pressed: $background-gradient-pressed, $background-gradient-focus-over: $background-gradient-focus-over, $background-gradient-focus-pressed: $background-gradient-focus-pressed, $background-gradient-disabled: $background-gradient-disabled, $color: $color, $color-over: $color-over, $color-focus: $color-focus, $color-pressed: $color-pressed, $color-focus-over: $color-focus-over, $color-focus-pressed: $color-focus-pressed, $color-disabled: $color-disabled, $inner-border-width: $inner-border-width, $inner-border-width-over: $inner-border-width-over, $inner-border-width-focus: $inner-border-width-focus, $inner-border-width-pressed: $inner-border-width-pressed, $inner-border-width-focus-over: $inner-border-width-focus-over, $inner-border-width-focus-pressed: $inner-border-width-focus-pressed, $inner-border-width-disabled: $inner-border-width-disabled, $inner-border-color: $inner-border-color, $inner-border-color-over: $inner-border-color-over, $inner-border-color-focus: $inner-border-color-focus, $inner-border-color-pressed: $inner-border-color-pressed, $inner-border-color-focus-over: $inner-border-color-focus-over, $inner-border-color-focus-pressed: $inner-border-color-focus-pressed, $inner-border-color-disabled: $inner-border-color-disabled, $body-outline-width-focus: $body-outline-width-focus, $body-outline-style-focus: $body-outline-style-focus, $body-outline-color-focus: $body-outline-color-focus, $font-size: $font-size, $font-size-over: $font-size-over, $font-size-focus: $font-size-focus, $font-size-pressed: $font-size-pressed, $font-size-focus-over: $font-size-focus-over, $font-size-focus-pressed: $font-size-focus-pressed, $font-size-disabled: $font-size-disabled, $font-weight: $font-weight, $font-weight-over: $font-weight-over, $font-weight-focus: $font-weight-focus, $font-weight-pressed: $font-weight-pressed, $font-weight-focus-over: $font-weight-focus-over, $font-weight-focus-pressed: $font-weight-focus-pressed, $font-weight-disabled: $font-weight-disabled, $font-family: $font-family, $font-family-over: $font-family-over, $font-family-focus: $font-family-focus, $font-family-pressed: $font-family-pressed, $font-family-focus-over: $font-family-focus-over, $font-family-focus-pressed: $font-family-focus-pressed, $font-family-disabled: $font-family-disabled, $line-height: $line-height, $icon-size: $icon-size, $glyph-font-size: $glyph-font-size, $icon-spacing: $icon-spacing, $glyph-color: $glyph-color, $glyph-opacity: $glyph-opacity, $arrow-width: $arrow-width, $arrow-height: $arrow-height, $arrow-glyph: $arrow-glyph, $arrow-glyph-color: $arrow-glyph-color, $split-width: $split-width, $split-height: $split-height, $split-line-width: $split-line-width, $split-line-color: $split-line-color, $include-ui-menu-arrows: $include-ui-menu-arrows, $include-ui-split-arrows: $include-ui-split-arrows, $include-split-noline-arrows: $include-split-noline-arrows, $include-split-over-arrows: $include-split-over-arrows, $opacity-disabled: $opacity-disabled, $inner-opacity-disabled: $inner-opacity-disabled );} /** * Creates a visual theme for a {@link #scale small} toolbar Button. * * @param {string} $ui * The name of the UI being created. Can not included spaces or special punctuation * (used in CSS class names). * * @param {number} [$border-radius=$button-small-border-radius] * The border-radius of the button * * @param {number} [$border-width=$button-small-border-width] * The border-width of the button * * @param {color} [$border-color=$button-toolbar-border-color] * The border-color of the button * * @param {color} [$border-color-over=$button-toolbar-border-color-over] * The border-color of the button when the cursor is over the button * * @param {color} [$border-color-focus=$button-toolbar-border-color-focus] * The border-color of the button when focused * * @param {color} [$border-color-pressed=$button-toolbar-border-color-pressed] * The border-color of the button when pressed * * @param {color} [$border-color-focus-over=$button-toolbar-border-color-focus-over] * The border-color of the button when the button is focused and the cursor is over the * button * * @param {color} [$border-color-focus-pressed=$button-toolbar-border-color-focus-pressed] * The border-color of the button when focused and pressed * * @param {color} [$border-color-disabled=$button-toolbar-border-color-disabled] * The border-color of the button when disabled * * @param {number} [$padding=$button-small-padding] * The amount of padding inside the border of the button on all sides * * @param {number} [$text-padding=$button-small-text-padding] * The amount of horizontal space to add to the left and right of the button text * * @param {color} [$background-color=$button-toolbar-background-color] * The background-color of the button * * @param {color} [$background-color-over=$button-toolbar-background-color-over] * The background-color of the button when the cursor is over the button * * @param {color} [$background-color-focus=$button-toolbar-background-color-focus] * The background-color of the button when focused * * @param {color} [$background-color-pressed=$button-toolbar-background-color-pressed] * The background-color of the button when pressed * * @param {color} [$background-color-focus-over=$button-toolbar-background-color-focus-over] * The background-color of the button when the button is focused and the cursor is over * the button * * @param {color} [$background-color-focus-pressed=$button-toolbar-background-color-focus-pressed] * The background-color of the button when focused and pressed * * @param {color} [$background-color-disabled=$button-toolbar-background-color-disabled] * The background-color of the button when disabled * * @param {string/list} [$background-gradient=$button-toolbar-background-gradient] * The background-gradient for the button. Can be either the name of a predefined gradient * or a list of color stops. Used as the `$type` parameter for {@link Global_CSS#background-gradient}. * * @param {string/list} [$background-gradient-over=$button-toolbar-background-gradient-over] * The background-gradient to use when the cursor is over the button. Can be either the * name of a predefined gradient or a list of color stops. Used as the `$type` parameter * for {@link Global_CSS#background-gradient}. * * @param {string/list} [$background-gradient-focus=$button-toolbar-background-gradient-focus] * The background-gradient to use when the the button is focused. Can be either the name * of a predefined gradient or a list of color stops. Used as the `$type` parameter for * {@link Global_CSS#background-gradient}. * * @param {string/list} [$background-gradient-pressed=$button-toolbar-background-gradient-pressed] * The background-gradient to use when the the button is pressed. Can be either the name * of a predefined gradient or a list of color stops. Used as the `$type` parameter for * {@link Global_CSS#background-gradient}. * * @param {string} [$background-gradient-focus-over=$button-toolbar-background-gradient-focus-over] * The background-gradient to use when the the button is focused and the cursor is over * the button. Can be either the name of a predefined gradient or a list of color stops. * Used as the `$type` parameter for {@link Global_CSS#background-gradient}. * * @param {string} [$background-gradient-focus-pressed=$button-toolbar-background-gradient-focus-pressed] * The background-gradient to use when the the button is focused and pressed. Can be * either the name of a predefined gradient or a list of color stops. Used as the `$type` * parameter for {@link Global_CSS#background-gradient}. * * @param {string/list} [$background-gradient-disabled=$button-toolbar-background-gradient-disabled] * The background-gradient to use when the the button is disabled. Can be either the name * of a predefined gradient or a list of color stops. Used as the `$type` parameter for * {@link Global_CSS#background-gradient}. * * @param {color} [$color=$button-toolbar-color] * The text color of the button * * @param {color} [$color-over=$button-toolbar-color-over] * The text color of the button when the cursor is over the button * * @param {color} [$color-focus=$button-toolbar-color-focus] * The text color of the button when the button is focused * * @param {color} [$color-pressed=$button-toolbar-color-pressed] * The text color of the button when the button is pressed * * @param {color} [$color-focus-over=$button-toolbar-color-focus-over] * The text color of the button when the button is focused and the cursor is over the button * * @param {color} [$color-focus-pressed=$button-toolbar-color-focus-pressed] * The text color of the button when the button is focused and pressed * * @param {color} [$color-disabled=$button-toolbar-color-disabled] * The text color of the button when the button is disabled * * @param {number/list} [$inner-border-width=$button-toolbar-inner-border-width] * The inner border-width of the button * * @param {number/list} [$inner-border-width-over=$button-toolbar-inner-border-width-over] * The inner border-width of the button when the cursor is over the button * * @param {number/list} [$inner-border-width-focus=$button-toolbar-inner-border-width-focus] * The inner border-width of the button when focused * * @param {number/list} [$inner-border-width-pressed=$button-toolbar-inner-border-width-pressed] * The inner border-width of the button when pressed * * @param {number/list} [$inner-border-width-focus-over=$button-toolbar-inner-border-width-focus-over] * The inner border-width of the button when the button is focused and the cursor is over * the button * * @param {number/list} [$inner-border-width-focus-pressed=$button-toolbar-inner-border-width-focus-pressed] * The inner border-width of the button when focused and pressed * * @param {number/list} [$inner-border-width-disabled=$button-toolbar-inner-border-width-disabled] * The inner border-width of the button when disabled * * @param {color} [$inner-border-color=$button-toolbar-inner-border-color] * The inner border-color of the button * * @param {color} [$inner-border-color-over=$button-toolbar-inner-border-color-over] * The inner border-color of the button when the cursor is over the button * * @param {color} [$inner-border-color-focus=$button-toolbar-inner-border-color-focus] * The inner border-color of the button when focused * * @param {color} [$inner-border-color-pressed=$button-toolbar-inner-border-color-pressed] * The inner border-color of the button when pressed * * @param {color} [$inner-border-color-focus-over=$button-toolbar-inner-border-color-focus-over] * The inner border-color of the button when the button is focused and the cursor is over * the button * * @param {color} [$inner-border-color-focus-pressed=$button-toolbar-inner-border-color-focus-pressed] * The inner border-color of the button when focused and pressed * * @param {color} [$inner-border-color-disabled=$button-toolbar-inner-border-color-disabled] * The inner border-color of the button when disabled * * @param {number} [$body-outline-width-focus=$button-toolbar-body-outline-width-focus] * The body outline width of the button when focused * * @param {number} [$body-outline-style-focus=$button-toolbar-body-outline-style-focus] * The body outline-style of the button when focused * * @param {number} [$body-outline-color-focus=$button-toolbar-body-outline-color-focus] * The body outline color of the button when focused * * @param {number} [$font-size=$button-small-font-size] * The font-size of the button * * @param {number} [$font-size-over=$button-small-font-size-over] * The font-size of the button when the cursor is over the button * * @param {number} [$font-size-focus=$button-small-font-size-focus] * The font-size of the button when the button is focused * * @param {number} [$font-size-pressed=$button-small-font-size-pressed] * The font-size of the button when the button is pressed * * @param {number} [$font-size-focus-over=$button-small-font-size-focus-over] * The font-size of the button when the button is focused and the cursor is over the * button * * @param {number} [$font-size-focus-pressed=$button-small-font-size-focus-pressed] * The font-size of the button when the button is focused and pressed * * @param {number} [$font-size-disabled=$button-small-font-size-disabled] * The font-size of the button when the button is disabled * * @param {string} [$font-weight=$button-small-font-weight] * The font-weight of the button * * @param {string} [$font-weight-over=$button-small-font-weight-over] * The font-weight of the button when the cursor is over the button * * @param {string} [$font-weight-focus=$button-small-font-weight-focus] * The font-weight of the button when the button is focused * * @param {string} [$font-weight-pressed=$button-small-font-weight-pressed] * The font-weight of the button when the button is pressed * * @param {string} [$font-weight-focus-over=$button-small-font-weight-focus-over] * The font-weight of the button when the button is focused and the cursor is over the * button * * @param {string} [$font-weight-focus-pressed=$button-small-font-weight-focus-pressed] * The font-weight of the button when the button is focused and pressed * * @param {string} [$font-weight-disabled=$button-small-font-weight-disabled] * The font-weight of the button when the button is disabled * * @param {string} [$font-family=$button-small-font-family] * The font-family of the button * * @param {string} [$font-family-over=$button-small-font-family-over] * The font-family of the button when the cursor is over the button * * @param {string} [$font-family-focus=$button-small-font-family-focus] * The font-family of the button when the button is focused * * @param {string} [$font-family-pressed=$button-small-font-family-pressed] * The font-family of the button when the button is pressed * * @param {string} [$font-family-focus-over=$button-small-font-family-focus-over] * The font-family of the button when the button is focused and the cursor is over the * button * * @param {string} [$font-family-focus-pressed=$button-small-font-family-focus-pressed] * The font-family of the button when the button is focused and pressed * * @param {string} [$font-family-disabled=$button-small-font-family-disabled] * The font-family of the button when the button is disabled * * @param {number} [$line-height=$button-small-line-height] * The line-height of the button text * * @param {number} [$icon-size=$button-small-icon-size] * The size of the button icon * * @param {number} [$glyph-font-size=$button-small-glyph-font-size] * The font-size for the button glyph * * @param {number} [$icon-spacing=$button-small-icon-spacing] * The space between the button's icon and text * * @param {color} [$glyph-color=$button-toolbar-glyph-color] * The color of the button's {@link #glyph} icon * * @param {number} [$glyph-opacity=$button-toolbar-glyph-opacity] * The opacity of the button's {@link #glyph} icon * * @param {number} [$arrow-width=$button-small-arrow-width] * The width of the button's {@link #cfg-menu} arrow * * @param {number} [$arrow-height=$button-small-arrow-height] * The height of the button's {@link #cfg-menu} arrow * * @param {string/list} [$arrow-glyph=$button-small-arrow-glyph] * Glyph for the button arrow when when {@link Global_CSS#$enable-font-icons} is `true`. * * @param {string/list} [$arrow-glyph-color=$button-toolbar-arrow-glyph-color] * Glyph color for the button arrow when when {@link Global_CSS#$enable-font-icons} is `true`. * * @param {number} [$split-width=$button-small-split-width] * The width of a {@link Ext.button.Split Split Button}'s arrow * * @param {number} [$split-height=$button-small-split-height] * The height of a {@link Ext.button.Split Split Button}'s arrow * * @param {number} [$split-line-width=$button-small-split-line-width] * The default width for a {@link Ext.button.Split Split Button}'s line. * Themes that include the line in the arrow background image should set this to 0 * * @param {color} [$split-line-color=$button-toolbar-split-line-color] * The color for a {@link Ext.button.Split Split Button}'s line. * Only applicable when `$split-line-width` is greater than 0. * * @param {boolean} [$include-ui-menu-arrows=$button-include-ui-menu-arrows] * True to include the UI name in the file name of the {@link #cfg-menu} * arrow icon. Set this to false to share the same arrow bewteen multiple UIs. * * @param {boolean} [$include-ui-split-arrows=$button-include-ui-split-arrows] * True to include the UI name in the file name of the {@link Ext.button.Split Split Button}'s * arrow icon. Set this to false to share the same arrow bewteen multiple UIs. * * @param {boolean} [$include-split-noline-arrows=$button-toolbar-include-split-noline-arrows] * True to add a "-noline" suffix to the file name of the {@link Ext.button.Split Split Button}'s * arrow icon. Used for hiding the split line when toolbar buttons are in their default * state. * * @param {boolean} [$include-split-over-arrows=$button-include-split-over-arrows] * True to use a separate icon for {@link Ext.button.Split Split Button}s when the cursor * is over the button. The over icon file name will have a "-o" suffix * * @param {number} [$opacity-disabled=$button-toolbar-opacity-disabled] * The opacity of the button when it is disabled * * @param {number} [$inner-opacity-disabled=$button-toolbar-inner-opacity-disabled] * The opacity of the button's text and icon elements when when the button is disabled * * @member Ext.button.Button */@mixin extjs-button-toolbar-small-ui( $ui, $border-radius: $button-small-border-radius, $border-width: $button-small-border-width, $border-color: null, $border-color-over: null, $border-color-focus: null, $border-color-pressed: null, $border-color-focus-over: null, $border-color-focus-pressed: null, $border-color-disabled: null, $padding: $button-small-padding, $text-padding: $button-small-text-padding, $background-color: null, $background-color-over: null, $background-color-focus: null, $background-color-pressed: null, $background-color-focus-over: null, $background-color-focus-pressed: null, $background-color-disabled: null, $background-gradient: $button-toolbar-background-gradient, $background-gradient-over: $button-toolbar-background-gradient-over, $background-gradient-focus: $button-toolbar-background-gradient-focus, $background-gradient-pressed: $button-toolbar-background-gradient-pressed, $background-gradient-focus-over: $button-toolbar-background-gradient-focus-over, $background-gradient-focus-pressed: $button-toolbar-background-gradient-focus-pressed, $background-gradient-disabled: $button-toolbar-background-gradient-disabled, $color: null, $color-over: null, $color-focus: null, $color-pressed: null, $color-focus-over: null, $color-focus-pressed: null, $color-disabled: null, $inner-border-width: null, $inner-border-width-over: null, $inner-border-width-focus: null, $inner-border-width-pressed: null, $inner-border-width-focus-over: null, $inner-border-width-focus-pressed: null, $inner-border-width-disabled: null, $inner-border-color: null, $inner-border-color-over: null, $inner-border-color-focus: null, $inner-border-color-pressed: null, $inner-border-color-focus-over: null, $inner-border-color-focus-pressed: null, $inner-border-color-disabled: null, $body-outline-width-focus: $button-toolbar-body-outline-width-focus, $body-outline-style-focus: $button-toolbar-body-outline-style-focus, $body-outline-color-focus: $button-toolbar-body-outline-color-focus, $font-size: null, $font-size-over: null, $font-size-focus: null, $font-size-pressed: null, $font-size-focus-over: null, $font-size-focus-pressed: null, $font-size-disabled: null, $font-weight: null, $font-weight-over: null, $font-weight-focus: null, $font-weight-pressed: null, $font-weight-focus-over: null, $font-weight-focus-pressed: null, $font-weight-disabled: null, $font-family: null, $font-family-over: null, $font-family-focus: null, $font-family-pressed: null, $font-family-focus-over: null, $font-family-focus-pressed: null, $font-family-disabled: null, $line-height: $button-small-line-height, $icon-size: $button-small-icon-size, $glyph-font-size: $button-small-glyph-font-size, $icon-spacing: $button-small-icon-spacing, $glyph-color: $button-toolbar-glyph-color, $glyph-opacity: $button-toolbar-glyph-opacity, $arrow-width: $button-small-arrow-width, $arrow-height: $button-small-arrow-height, $arrow-glyph: $button-small-arrow-glyph, $arrow-glyph-color: $button-toolbar-arrow-glyph-color, $split-width: $button-small-split-width, $split-height: $button-small-split-height, $split-line-width: $button-small-split-line-width, $split-line-color: $button-toolbar-split-line-color, $include-ui-menu-arrows: $button-include-ui-menu-arrows, $include-ui-split-arrows: $button-include-ui-split-arrows, $include-split-noline-arrows: $button-toolbar-include-split-noline-arrows, $include-split-over-arrows: $button-include-split-over-arrows, $opacity-disabled: $button-toolbar-opacity-disabled, $inner-opacity-disabled: $button-toolbar-inner-opacity-disabled ) { @if $border-color == null { $border-color: $button-toolbar-border-color; @if $border-color-over == null { $border-color-over: $button-toolbar-border-color-over; } @if $border-color-focus == null { $border-color-focus: $button-toolbar-border-color-focus; } @if $border-color-pressed == null { $border-color-pressed: $button-toolbar-border-color-pressed; } @if $border-color-focus-over == null { $border-color-focus-over: $button-toolbar-border-color-focus-over; } @if $border-color-focus-pressed == null { $border-color-focus-pressed: $button-toolbar-border-color-focus-pressed; } @if $border-color-disabled == null { $border-color-disabled: $button-toolbar-border-color-disabled; } } @else { @if $border-color-over == null { $border-color-over: button-toolbar-border-color-over($border-color); } @if $border-color-focus == null { $border-color-focus: button-toolbar-border-color-focus($border-color); } @if $border-color-pressed == null { $border-color-pressed: button-toolbar-border-color-pressed($border-color); } @if $border-color-focus-over == null { $border-color-focus-over: $border-color-over; } @if $border-color-focus-pressed == null { $border-color-focus-pressed: $border-color-pressed; } @if $border-color-disabled == null { $border-color-disabled: button-toolbar-border-color-disabled($border-color); } } @if $background-color == null { $background-color: $button-toolbar-background-color; @if $background-color-over == null { $background-color-over: $button-toolbar-background-color-over; } @if $background-color-focus == null { $background-color-focus: $button-toolbar-background-color-focus; } @if $background-color-pressed == null { $background-color-pressed: $button-toolbar-background-color-pressed; } @if $background-color-focus-over == null { $background-color-focus-over: $button-toolbar-background-color-focus-over; } @if $background-color-focus-pressed == null { $background-color-focus-pressed: $button-toolbar-background-color-focus-pressed; } @if $background-color-disabled == null { $background-color-disabled: $button-toolbar-background-color-disabled; } } @else { @if $background-color-over == null { $background-color-over: button-toolbar-background-color-over($background-color); } @if $background-color-focus == null { $background-color-focus: button-toolbar-background-color-focus($background-color); } @if $background-color-pressed == null { $background-color-pressed: button-toolbar-background-color-pressed($background-color); } @if $background-color-focus-over == null { $background-color-focus-over: $background-color-over; } @if $background-color-focus-pressed == null { $background-color-focus-pressed: $background-color-pressed; } @if $background-color-disabled == null { $background-color-disabled: button-toolbar-background-color-disabled($background-color); } } @if $color == null { $color: $button-toolbar-color; @if $color-over == null { $color-over: $button-toolbar-color-over; } @if $color-focus == null { $color-focus: $button-toolbar-color-focus; } @if $color-pressed == null { $color-pressed: $button-toolbar-color-pressed; } @if $color-focus-over == null { $color-focus-over: $button-toolbar-color-focus-over; } @if $color-focus-pressed == null { $color-focus-pressed: $button-toolbar-color-focus-pressed; } @if $color-disabled == null { $color-disabled: $button-toolbar-color-disabled; } } @else { @if $color-over == null { $color-over: button-toolbar-color-over($color); } @if $color-focus == null { $color-focus: button-toolbar-color-focus($color); } @if $color-pressed == null { $color-pressed: button-toolbar-color-pressed($color); } @if $color-focus-over == null { $color-focus-over: $color-over; } @if $color-focus-pressed == null { $color-focus-pressed: $color-pressed; } @if $color-disabled == null { $color-disabled: button-toolbar-color-disabled($color); } } @if $inner-border-width == null { $inner-border-width: $button-toolbar-inner-border-width; @if $inner-border-width-over == null { $inner-border-width-over: $button-toolbar-inner-border-width-over; } @if $inner-border-width-focus == null { $inner-border-width-focus: $button-toolbar-inner-border-width-focus; } @if $inner-border-width-pressed == null { $inner-border-width-pressed: $button-toolbar-inner-border-width-pressed; } @if $inner-border-width-focus-over == null { $inner-border-width-focus-over: $button-toolbar-inner-border-width-focus-over; } @if $inner-border-width-focus-pressed == null { $inner-border-width-focus-pressed: $button-toolbar-inner-border-width-focus-pressed; } @if $inner-border-width-disabled == null { $inner-border-width-disabled: $button-toolbar-inner-border-width-disabled; } } @else { @if $inner-border-width-over == null { $inner-border-width-over: $inner-border-width; } @if $inner-border-width-focus == null { $inner-border-width-focus: $inner-border-width; } @if $inner-border-width-pressed == null { $inner-border-width-pressed: $inner-border-width; } @if $inner-border-width-focus-over == null { $inner-border-width-focus-over: $inner-border-width-over; } @if $inner-border-width-focus-pressed == null { $inner-border-width-focus-pressed: $inner-border-width-pressed; } @if $inner-border-width-disabled == null { $inner-border-width-disabled: $inner-border-width; } } @if $inner-border-color == null { $inner-border-color: $button-toolbar-inner-border-color; @if $inner-border-color-over == null { $inner-border-color-over: $button-toolbar-inner-border-color-over; } @if $inner-border-color-focus == null { $inner-border-color-focus: $button-toolbar-inner-border-color-focus; } @if $inner-border-color-pressed == null { $inner-border-color-pressed: $button-toolbar-inner-border-color-pressed; } @if $inner-border-color-focus-over == null { $inner-border-color-focus-over: $button-toolbar-inner-border-color-focus-over; } @if $inner-border-color-focus-pressed == null { $inner-border-color-focus-pressed: $button-toolbar-inner-border-color-focus-pressed; } @if $inner-border-color-disabled == null { $inner-border-color-disabled: $button-toolbar-inner-border-color-disabled; } } @else { @if $inner-border-color-over == null { $inner-border-color-over: button-toolbar-inner-border-color-over($background-color-over, $color-over); } @if $inner-border-color-focus == null { $inner-border-color-focus: button-toolbar-inner-border-color-focus($background-color-focus, $color-focus); } @if $inner-border-color-pressed == null { $inner-border-color-pressed: button-toolbar-inner-border-color-pressed($background-color-pressed, $color-pressed); } @if $inner-border-color-focus-over == null { $inner-border-color-focus-over: button-toolbar-inner-border-color-focus-over($background-color-focus-over, $color-focus-over); } @if $inner-border-color-focus-pressed == null { $inner-border-color-focus-pressed: button-toolbar-inner-border-color-focus-pressed($background-color-focus-pressed, $color-focus-pressed) } @if $inner-border-color-disabled == null { $inner-border-color-disabled: button-toolbar-inner-border-color-disabled($background-color-disabled, $color-disabled); } } @if $font-size == null { $font-size: $button-small-font-size; @if $font-size-over == null { $font-size-over: $button-small-font-size-over; } @if $font-size-focus == null { $font-size-focus: $button-small-font-size-focus; } @if $font-size-pressed == null { $font-size-pressed: $button-small-font-size-pressed; } @if $font-size-focus-over == null { $font-size-focus-over: $button-small-font-size-focus-over; } @if $font-size-focus-pressed == null { $font-size-focus-pressed: $button-small-font-size-focus-pressed; } @if $font-size-disabled == null { $font-size-disabled: $button-small-font-size-disabled; } } @else { @if $font-size-over == null { $font-size-over: $font-size; } @if $font-size-focus == null { $font-size-focus: $font-size; } @if $font-size-pressed == null { $font-size-pressed: $font-size; } @if $font-size-focus-over == null { $font-size-focus-over: $font-size-over; } @if $font-size-focus-pressed == null { $font-size-focus-pressed: $font-size-pressed; } @if $font-size-disabled == null { $font-size-disabled: $font-size; } } @if $font-weight == null { $font-weight: $button-small-font-weight; @if $font-weight-over == null { $font-weight-over: $button-small-font-weight-over; } @if $font-weight-focus == null { $font-weight-focus: $button-small-font-weight-focus; } @if $font-weight-pressed == null { $font-weight-pressed: $button-small-font-weight-pressed; } @if $font-weight-focus-over == null { $font-weight-focus-over: $button-small-font-weight-focus-over; } @if $font-weight-focus-pressed == null { $font-weight-focus-pressed: $button-small-font-weight-focus-pressed; } @if $font-weight-disabled == null { $font-weight-disabled: $button-small-font-weight-disabled; } } @else { @if $font-weight-over == null { $font-weight-over: $font-weight; } @if $font-weight-focus == null { $font-weight-focus: $font-weight; } @if $font-weight-pressed == null { $font-weight-pressed: $font-weight; } @if $font-weight-focus-over == null { $font-weight-focus-over: $font-weight-over; } @if $font-weight-focus-pressed == null { $font-weight-focus-pressed: $font-weight-pressed; } @if $font-weight-disabled == null { $font-weight-disabled: $font-weight; } } @if $font-family == null { $font-family: $button-small-font-family; @if $font-family-over == null { $font-family-over: $button-small-font-family-over; } @if $font-family-focus == null { $font-family-focus: $button-small-font-family-focus; } @if $font-family-pressed == null { $font-family-pressed: $button-small-font-family-pressed; } @if $font-family-focus-over == null { $font-family-focus-over: $button-small-font-family-focus-over; } @if $font-family-focus-pressed == null { $font-family-focus-pressed: $button-small-font-family-focus-pressed; } @if $font-family-disabled == null { $font-family-disabled: $button-small-font-family-disabled; } } @else { @if $font-family-over == null { $font-family-over: $font-family; } @if $font-family-focus == null { $font-family-focus: $font-family; } @if $font-family-pressed == null { $font-family-pressed: $font-family; } @if $font-family-focus-over == null { $font-family-focus-over: $font-family-over; } @if $font-family-focus-pressed == null { $font-family-focus-pressed: $font-family-pressed; } @if $font-family-disabled == null { $font-family-disabled: $font-family; } } @include extjs-button-ui( $ui: '#{$ui}-toolbar-small', $border-radius: $border-radius, $border-width: $border-width, $border-color: $border-color, $border-color-over: $border-color-over, $border-color-focus: $border-color-focus, $border-color-pressed: $border-color-pressed, $border-color-focus-over: $border-color-focus-over, $border-color-focus-pressed: $border-color-focus-pressed, $border-color-disabled: $border-color-disabled, $padding: $padding, $text-padding: $text-padding, $background-color: $background-color, $background-color-over: $background-color-over, $background-color-focus: $background-color-focus, $background-color-pressed: $background-color-pressed, $background-color-focus-over: $background-color-focus-over, $background-color-focus-pressed: $background-color-focus-pressed, $background-color-disabled: $background-color-disabled, $background-gradient: $background-gradient, $background-gradient-over: $background-gradient-over, $background-gradient-focus: $background-gradient-focus, $background-gradient-pressed: $background-gradient-pressed, $background-gradient-focus-over: $background-gradient-focus-over, $background-gradient-focus-pressed: $background-gradient-focus-pressed, $background-gradient-disabled: $background-gradient-disabled, $color: $color, $color-over: $color-over, $color-focus: $color-focus, $color-pressed: $color-pressed, $color-focus-over: $color-focus-over, $color-focus-pressed: $color-focus-pressed, $color-disabled: $color-disabled, $inner-border-width: $inner-border-width, $inner-border-width-over: $inner-border-width-over, $inner-border-width-focus: $inner-border-width-focus, $inner-border-width-pressed: $inner-border-width-pressed, $inner-border-width-focus-over: $inner-border-width-focus-over, $inner-border-width-focus-pressed: $inner-border-width-focus-pressed, $inner-border-width-disabled: $inner-border-width-disabled, $inner-border-color: $inner-border-color, $inner-border-color-over: $inner-border-color-over, $inner-border-color-focus: $inner-border-color-focus, $inner-border-color-pressed: $inner-border-color-pressed, $inner-border-color-focus-over: $inner-border-color-focus-over, $inner-border-color-focus-pressed: $inner-border-color-focus-pressed, $inner-border-color-disabled: $inner-border-color-disabled, $body-outline-width-focus: $body-outline-width-focus, $body-outline-style-focus: $body-outline-style-focus, $body-outline-color-focus: $body-outline-color-focus, $font-size: $font-size, $font-size-over: $font-size-over, $font-size-focus: $font-size-focus, $font-size-pressed: $font-size-pressed, $font-size-focus-over: $font-size-focus-over, $font-size-focus-pressed: $font-size-focus-pressed, $font-size-disabled: $font-size-disabled, $font-weight: $font-weight, $font-weight-over: $font-weight-over, $font-weight-focus: $font-weight-focus, $font-weight-pressed: $font-weight-pressed, $font-weight-focus-over: $font-weight-focus-over, $font-weight-focus-pressed: $font-weight-focus-pressed, $font-weight-disabled: $font-weight-disabled, $font-family: $font-family, $font-family-over: $font-family-over, $font-family-focus: $font-family-focus, $font-family-pressed: $font-family-pressed, $font-family-focus-over: $font-family-focus-over, $font-family-focus-pressed: $font-family-focus-pressed, $font-family-disabled: $font-family-disabled, $line-height: $line-height, $icon-size: $icon-size, $glyph-font-size: $glyph-font-size, $icon-spacing: $icon-spacing, $glyph-color: $glyph-color, $glyph-opacity: $glyph-opacity, $arrow-width: $arrow-width, $arrow-height: $arrow-height, $arrow-glyph: $arrow-glyph, $arrow-glyph-color: $arrow-glyph-color, $split-width: $split-width, $split-height: $split-height, $split-line-width: $split-line-width, $split-line-color: $split-line-color, $include-ui-menu-arrows: $include-ui-menu-arrows, $include-ui-split-arrows: $include-ui-split-arrows, $include-split-noline-arrows: $include-split-noline-arrows, $include-split-over-arrows: $include-split-over-arrows, $opacity-disabled: $opacity-disabled, $inner-opacity-disabled: $inner-opacity-disabled );}