// Variables // Syntax: <control>-(<sub control>)-<bg|border|text>-(<state>)-(<extra>); // Example: @btn-primary-bg-hover-hlight; @prefix:                         mce; // Default font @font-family:                    Roboto, Arial, sans-serif; @font-size:                      12px; @line-height:                    20px; @has-gradients:                  false; @has-radius:                     false; @has-boxshadow:                  true; @has-button-borders:             true; // Text colors @text:                           #212121; @text-inverse:                   #b6b6b6; @text-disabled:                  #b6b6b6; @text-shadow:                    0 1px 1px hsla(hue(@text-inverse), saturation(@text-inverse), lightness(@text-inverse), 0.75); @text-error:                     #aa0000; // Button @btn-text:                       #727272; @btn-text-shadow:                #ffffff; @btn-border-top:                 #f5f5f8; @btn-border-right:               #dcdfe7; @btn-border-bottom:              #dcdfe7; @btn-border-left:                #dcdfe7; @btn-caret-border:               @btn-text; @btn-text-disabled:              @text-disabled; @btn-box-shadow:                 inset 0 1px 0 rgba(255, 255, 255, .2), 0 1px 2px rgba(0, 0, 0, .05); @btn-box-shadow-active:          inset 0 2px 4px rgba(0, 0, 0, .15), 0 1px 2px rgba(0, 0, 0, .05); @btn-box-disabled-opacity:       0.4; @btn-bg:                         #ffffff; @btn-bg-hlight:                  #ffffff; @btn-bg-hover:                   darken(@btn-bg, 5%); @btn-bg-hlight-hover:            darken(@btn-bg-hlight, 5%); @btn-border-hover:               darken(@btn-bg, 20%); @btn-border-active:              darken(@btn-bg, 20%); @btn-padding:                    4px 8px; @btn-primary-bg:                 #ffffff; @btn-primary-bg-hlight:          #ffffff; @btn-primary-bg-hover:           darken(@btn-primary-bg, 5%); @btn-primary-bg-hover-hlight:    darken(@btn-primary-bg-hlight, 5%); @btn-primary-text:               #727272; @btn-primary-text-shadow:        #ffffff; @btn-primary-border-top:         mix(@btn-border-top, @btn-primary-bg, 50%); @btn-primary-border-right:       mix(@btn-border-right, @btn-primary-bg, 50%); @btn-primary-border-bottom:      mix(@btn-border-bottom, @btn-primary-bg, 50%); @btn-primary-border-left:        mix(@btn-border-left, @btn-primary-bg, 50%); @btn-primary-border:             transparent; @btn-primary-border-hover:       transparent; // Button group @btn-group-border-width:         1px; // Menu @menuitem-text:                  #727272; @menu-bg:                        #212121; @menu-margin:                    -1px 0 0; @menu-border:                    #3f4350; @menubar-border:                 mix(@panel-border, @panel-bg, 60%); @menuitem-text-inverse:          #ffffff; @menubar-bg-active:              darken(@btn-bg, 10%); @menuitem-bg-hover:              #0081C2; @menuitem-bg-selected:           #1186fd; @menuitem-bg-selected-hlight:    #1186fd; @menuitem-bg-disabled:           #CCC; @menuitem-caret:                 @menuitem-text; @menuitem-caret-selected:        @menuitem-text-inverse; @menuitem-separator-top:         #3f4350; @menuitem-separator-bottom:      #3f4350; @menuitem-bg-active:             #1186fd; @menuitem-text-active:           #ffffff; @menuitem-preview-border-active: #3f4350; // Panel @panel-border:                   #b6b6b6; @panel-bg:                       #f5f5f8; @panel-bg-hlight:                #dcdfe7; // Tabs @tab-border:                     #dcdfe7; @tab-bg:                         #f5f5f8; @tab-bg-hover:                   #dcdfe7; @tab-bg-active:                  #ffffff; // Tooltip @tooltip-bg:                     #000; @tooltip-text:                   white; @tooltip-font-size:              11px; // Window @window-border:                  #ffffff; @window-head-border:             @window-border; @window-head-close:              mix(@text, @window-bg, 60%); @window-head-close-hover:        mix(@text, @window-bg, 40%); @window-foot-border:             @window-border; @window-foot-bg:                 @window-bg; @window-fullscreen-bg:           #FFF; @window-modalblock-bg:           #000; @window-modalblock-opacity:      0.3; @window-box-shadow:              0 3px 7px rgba(0, 0, 0, 0.3); @window-bg:                      #ffffff; @window-title-font-size:         20px; // Popover @popover-bg:                     @window-bg; @popover-arrow-width:            10px; @popover-arrow:                  @window-bg; @popover-arrow-outer-width:      @popover-arrow-width + 1; @popover-arrow-outer:            rgba(0, 0, 0, 0.25); // Floatpanel @floatpanel-box-shadow:          0 5px 10px rgba(0, 0, 0, .2); // Checkbox @checkbox-bg:                    @btn-bg; @checkbox-bg-hlight:             @btn-bg-hlight; @checkbox-box-shadow:            inset 0 1px 0 rgba(255, 255, 255, .2), 0 1px 2px rgba(0, 0, 0, .05); @checkbox-border:                #b6b6b6; @checkbox-border-focus:          #b6b6b6; // Path @path-text:                      @text; @path-bg-focus:                  #666; @path-text-focus:                #fff; // Textbox @textbox-text-placeholder:       #aaa; @textbox-box-shadow:             inset 0 1px 1px rgba(0, 0, 0, 0.075); @textbox-bg:                     #ffffff; @textbox-border:                 #dcdfe7; @textbox-border-focus:           #dcdfe7; // Throbber @throbber-bg:                    #fff url('img/loader.gif') no-repeat center center; // Combobox @combobox-border:                @textbox-border; // Colorpicker @colorpicker-border:             @textbox-border; @colorpicker-hue-bg:             #fff; @colorpicker-hue-border:         #333; // Grid @grid-bg-active:                 @menuitem-bg-active; @grid-border-active:             #dcdfe7; @grid-border:                    #dcdfe7; // Misc @colorbtn-backcolor-bg:          #ffffff; @iframe-border:                  @panel-border; // Slider @slider-border:                  #dcdfe7; @slider-bg:                      #dcdfe7; @slider-handle-border:           #b6b6b6; @slider-handle-bg:               #b6b6b6; @flow-layout-spacing:            2px; @tabs-bg:                                                #FFF;