/** * @class Ext.field.Slider */ /** * @var {number/list} * Slider Field padding */$sliderfield-padding: dynamic(5px 0 4px); /** * @var {number/list} * Slider Field padding in the {@link Global_CSS#$enable-big big} sizing scheme */$sliderfield-padding-big: dynamic(2px 0); /** * @var {color} * Slider Field {@link #boxLabel} text color */$sliderfield-box-label-color: dynamic($field-box-label-color); /** * @var {string/number} * Slider Field {@link #boxLabel} font-weight */$sliderfield-box-label-font-weight: dynamic($field-box-label-font-weight); /** * @var {number} * Slider Field {@link #boxLabel} font-size */$sliderfield-box-label-font-size: dynamic($field-box-label-font-size); /** * @var {number} * Slider Field {@link #boxLabel} font-size in the {@link Global_CSS#$enable-big big} sizing scheme */$sliderfield-box-label-font-size-big: dynamic($field-box-label-font-size-big); /** * @var {number} * Slider Field {@link #boxLabel} line-height */$sliderfield-box-label-line-height: dynamic($field-box-label-line-height); /** * @var {number} * Slider Field {@link #boxLabel} line-height in the {@link Global_CSS#$enable-big big} sizing scheme */$sliderfield-box-label-line-height-big: dynamic($field-box-label-line-height-big); /** * @var {string} * Slider Field {@link #boxLabel} font-family */$sliderfield-box-label-font-family: dynamic($field-box-label-font-family); /** * @var {number/list} * Slider Field {@link #boxLabel} padding * The padding box will be flipped horizontally when {@link #boxLabelAlign} is `before` */$sliderfield-box-label-padding: dynamic(top($field-box-label-padding) right($field-box-label-padding) bottom($field-box-label-padding) 6px); /** * @var {number/list} * Slider Field {@link #boxLabel} padding in the {@link Global_CSS#$enable-big big} sizing scheme * The padding box will be flipped horizontally when {@link #boxLabelAlign} is `before` */$sliderfield-box-label-padding-big: dynamic(top($field-box-label-padding-big) right($field-box-label-padding-big) bottom($field-box-label-padding-big) 8px); /** * @var {number} * Slider Field body width */$sliderfield-body-width: dynamic(100px); /** * @var {number} * Slider Field body width in the {@link Global_CSS#$enable-big big} sizing scheme */$sliderfield-body-width-big: dynamic(150px); /** * Creates a visual theme for a Slider Field * * @param {string} $ui * The name of the UI being created. Can not included spaces or special punctuation * (used in CSS class names). * * @param {String} [$xtype=sliderfield] (protected) The {@link Ext.Class#xtype} to use * in CSS selectors. For use by UI mixins of derived classes. * * @param {number/list} $padding * Slider Field padding * * @param {number/list} $padding-big * Slider Field padding in the {@link Global_CSS#$enable-big big} sizing scheme * * @param {color} $box-label-color * Slider Field {@link #boxLabel} text color * * @param {string/number} $box-label-font-weight * Slider Field {@link #boxLabel} font-weight * * @param {number} $box-label-font-size * Slider Field {@link #boxLabel} font-size * * @param {number} $box-label-font-size-big * Slider Field {@link #boxLabel} font-size in the {@link Global_CSS#$enable-big big} sizing scheme * * @param {number} $box-label-line-height * Slider Field {@link #boxLabel} line-height * * @param {number} $box-label-line-height-big * Slider Field {@link #boxLabel} line-height in the {@link Global_CSS#$enable-big big} sizing scheme * * @param {string} $box-label-font-family * Slider Field {@link #boxLabel} font-family * * @param {number/list} $box-label-padding * Slider Field {@link #boxLabel} padding * The padding box will be flipped horizontally when {@link #boxLabelAlign} is `before` * * @param {number/list} $box-label-padding-big * Slider Field {@link #boxLabel} padding in the {@link Global_CSS#$enable-big big} sizing scheme * The padding box will be flipped horizontally when {@link #boxLabelAlign} is `before` * * @param {number} $body-width * Slider Field body width * * @param {number} $body-width-big * Slider Field body width in the {@link Global_CSS#$enable-big big} sizing scheme */@mixin sliderfield-ui( $ui: null, $xtype: sliderfield, $padding: null, $padding-big: null, $box-label-color: null, $box-label-font-weight: null, $box-label-font-size: null, $box-label-font-size-big: null, $box-label-line-height: null, $box-label-line-height-big: null, $box-label-font-family: null, $box-label-padding: null, $box-label-padding-big: null, $body-width, $body-width-big ) { $ui-suffix: ui-suffix($ui); .#{$prefix}#{$xtype}#{$ui-suffix} { .#{$prefix}body-wrap-el { width: $body-width; @if $enable-big { .#{$prefix}big & { width: $body-width-big; } } } .#{$prefix}box-el { padding: $sliderfield-padding; @if $enable-big { .#{$prefix}big & { padding: $sliderfield-padding-big; } } } @include box-label-ui( $box-label-color: $box-label-color, $box-label-font-weight: $box-label-font-weight, $box-label-font-size: $box-label-font-size, $box-label-font-size-big: $box-label-font-size-big, $box-label-line-height: $box-label-line-height, $box-label-line-height-big: $box-label-line-height-big, $box-label-font-family: $box-label-font-family, $box-label-padding: $box-label-padding, $box-label-padding-big: $box-label-padding-big ); }}