BookStack Code Mirror - bookstack/blob - public/libs/tinymce/skins/dark/Variables.less

   1 // Variables
   2 // Syntax: <control>-(<sub control>)-<bg|border|text>-(<state>)-(<extra>);
   3 // Example: @btn-primary-bg-hover-hlight;
   4
   5 @prefix:                         mce;
   6
   7 // Default font
   8 @font-family:                    "Helvetica Neue", Helvetica, Arial, sans-serif;
   9 @font-size:                      14px;
  10 @line-height:                    20px;
  11 @has-gradients:                  false;
  12 @has-radius:                     false;
  13 @has-boxshadow:                  false;
  14 @has-button-borders:             true;
  15
  16 // Text colors
  17 @text:                           #b5b9bf;
  18 @text-inverse:                   #000000;
  19 @text-disabled:                  #6e737a;
  20 @text-shadow:                    0 1px 1px hsla(hue(@text-inverse), saturation(@text-inverse), lightness(@text-inverse), 0.75);
  21 @text-error:                     #b94a48;
  22 @text-warning:                   #c09853;
  23 @text-success:                   #468847;
  24 @text-link:                      #2980b9;
  25
  26 // Button
  27 @btn-text:                       #b5b9bf;
  28 @btn-text-shadow:                #000000;
  29 @btn-border-top:                 rgba(0,0,0,0);
  30 @btn-border-right:               rgba(0,0,0,0);
  31 @btn-border-bottom:              rgba(0,0,0,0);
  32 @btn-border-left:                rgba(0,0,0,0);
  33 @btn-caret-border:               @btn-text;
  34 @btn-text-disabled:              @text-disabled;
  35 @btn-box-shadow:                 inset 0 1px 0 rgba(255, 255, 255, .2), 0 1px 2px rgba(0, 0, 0, .05);
  36 @btn-box-shadow-active:          inset 0 2px 4px rgba(0, 0, 0, .15), 0 1px 2px rgba(0, 0, 0, .05);
  37 @btn-box-disabled-opacity:       0.4;
  38 @btn-bg:                         #333;
  39 @btn-bg-hlight:                  #454f59;
  40 @btn-bg-hover:                   darken(@btn-bg, 5%);
  41 @btn-bg-hlight-hover:            darken(@btn-bg-hlight, 5%);
  42 @btn-border-hover:               darken(@btn-bg, 20%);
  43 @btn-border-active:              darken(@btn-bg, 20%);
  44 @btn-padding:                    4px 10px;
  45
  46 @btn-primary-bg:                 #006fa6;
  47 @btn-primary-bg-hlight:          #005580;
  48 @btn-primary-bg-hover:           darken(@btn-primary-bg, 5%);
  49 @btn-primary-bg-hover-hlight:    darken(@btn-primary-bg-hlight, 5%);
  50 @btn-primary-text:               #ffffff;
  51 @btn-primary-text-shadow:        #333333;
  52 @btn-primary-border-top:         mix(@btn-border-top, @btn-primary-bg, 50%);
  53 @btn-primary-border-right:       mix(@btn-border-right, @btn-primary-bg, 50%);
  54 @btn-primary-border-bottom:      mix(@btn-border-bottom, @btn-primary-bg, 50%);
  55 @btn-primary-border-left:        mix(@btn-border-left, @btn-primary-bg, 50%);
  56 @btn-primary-border:             transparent;
  57 @btn-primary-border-hover:       transparent;
  58
  59 // Button group
  60 @btn-group-border-width:         1px;
  61
  62 // Menu
  63 @menuitem-text:                  #dddddd;
  64 @menu-bg:                        #2f3740;
  65 @menu-margin:                    -1px 0 0;
  66 @menu-border:                    #202a33;
  67 @menubar-border:                 mix(@panel-border, @panel-bg, 60%);
  68 @menuitem-text-inverse:          #ffffff;
  69 @menubar-bg-active:              darken(@btn-bg, 10%);
  70 @menuitem-bg-hover:              #0081C2;
  71 @menuitem-bg-selected:           #006fa6;
  72 @menuitem-bg-selected-hlight:    #005580;
  73 @menuitem-bg-disabled:           #CCC;
  74 @menuitem-caret:                 @menuitem-text;
  75 @menuitem-caret-selected:        @menuitem-text-inverse;
  76 @menuitem-separator-top:         #25313f;
  77 @menuitem-separator-bottom:      #424f5f;
  78 @menuitem-bg-active:             #0085c7;
  79 @menuitem-text-active:           #ffffff;
  80 @menuitem-preview-border-active: #08608c;
  81 @menubar-menubtn-text:           #b5b9bf;
  82
  83 // Panel
  84 @panel-border:                   #232b33;
  85 @panel-bg:                       #333333;
  86 @panel-bg-hlight:                #404952;
  87
  88 // Tabs
  89 @tab-border:                     #202a33;
  90 @tab-bg:                         #303942;
  91 @tab-bg-hover:                   #404952;
  92 @tab-bg-active:                  #404952;
  93 @tabs-bg:             #303942;
  94
  95 // Tooltip
  96 @tooltip-bg:                     #000;
  97 @tooltip-text:                   white;
  98 @tooltip-font-size:              11px;
  99
 100 // Notification
 101 @notification-font-size:         14px;
 102 @notification-bg:                #f0f0f0;
 103 @notification-border:            #cccccc;
 104 @notification-text:              #333333;
 105 @notification-success-bg:        #dff0d8;
 106 @notification-success-border:    #d6e9c6;
 107 @notification-success-text:      #3c763d;
 108 @notification-info-bg:           #d9edf7;
 109 @notification-info-border:       #779ecb;
 110 @notification-info-text:         #31708f;
 111 @notification-warning-bg:        #fcf8e3;
 112 @notification-warning-border:    #faebcc;
 113 @notification-warning-text:      #8a6d3b;
 114 @notification-error-bg:          #f2dede;
 115 @notification-error-border:      #ebccd1;
 116 @notification-error-text:        #a94442;
 117
 118 // Infobox
 119 @infobox-bg:                     @notification-bg;
 120 @infobox-border:                 @notification-border;
 121 @infobox-text:                   @notification-text;
 122 @infobox-success-bg:             @notification-success-bg;
 123 @infobox-success-border:         @notification-success-border;
 124 @infobox-success-text:           @notification-success-text;
 125 @infobox-info-bg:                @notification-info-bg;
 126 @infobox-info-border:            @notification-info-border;
 127 @infobox-info-text:              @notification-info-text;
 128 @infobox-warning-bg:             @notification-warning-bg;
 129 @infobox-warning-border:         @notification-warning-border;
 130 @infobox-warning-text:           @notification-warning-text;
 131 @infobox-error-bg:               @notification-error-bg;
 132 @infobox-error-border:           @notification-error-border;
 133 @infobox-error-text:             @notification-error-text;
 134
 135 // Window
 136 @window-border:                  #9e9e9e;
 137 @window-head-border:             @window-border;
 138 @window-head-close:              mix(@text, @window-bg, 60%);
 139 @window-head-close-hover:        mix(@text, @window-bg, 40%);
 140 @window-foot-border:             @window-border;
 141 @window-foot-bg:                 @window-bg;
 142 @window-fullscreen-bg:           #FFF;
 143 @window-modalblock-bg:           #000;
 144 @window-modalblock-opacity:      0.3;
 145 @window-box-shadow:              0 3px 7px rgba(0, 0, 0, 0.3);
 146 @window-bg:                      #333;
 147 @window-title-font-size:         20px;
 148
 149 // Popover
 150 @popover-bg:                     @window-bg;
 151 @popover-arrow-width:            10px;
 152 @popover-arrow:                  @window-bg;
 153 @popover-arrow-outer-width:      @popover-arrow-width + 1;
 154 @popover-arrow-outer:            rgba(0, 0, 0, 0.25);
 155
 156 // Floatpanel
 157 @floatpanel-box-shadow:          0 5px 10px rgba(0, 0, 0, .2);
 158
 159 // Checkbox
 160 @checkbox-bg:                    @btn-bg;
 161 @checkbox-bg-hlight:             @btn-bg-hlight;
 162 @checkbox-box-shadow:            inset 0 1px 0 rgba(255, 255, 255, .2), 0 1px 2px rgba(0, 0, 0, .05);
 163 @checkbox-border:                #202a33;
 164 @checkbox-border-focus:          #1e7dad;
 165
 166 // Path
 167 @path-text:                      @text;
 168 @path-bg-focus:                  #666;
 169 @path-text-focus:                #fff;
 170
 171 // Textbox
 172 @textbox-text-placeholder:       #aaa;
 173 @textbox-box-shadow:             inset 0 1px 1px rgba(0, 0, 0, 0.075);
 174 @textbox-bg:                     #515c67;
 175 @textbox-border:                 #202a33;
 176 @textbox-border-focus:           #1e7dad;
 177
 178 // Selectbox
 179 @selectbox-bg:                   @textbox-bg;
 180 @selectbox-border:               @textbox-border;
 181
 182 // Throbber
 183 @throbber-bg:                    #fff url('img/loader.gif') no-repeat center center;
 184
 185 // Combobox
 186 @combobox-border:                @textbox-border;
 187 @combobox-error-text:            @text-error;
 188 @combobox-warning-text:          @text-warning;
 189 @combobox-success-text:          @text-success;
 190
 191 // Colorpicker
 192 @colorpicker-border:             @textbox-border;
 193 @colorpicker-hue-bg:             #fff;
 194 @colorpicker-hue-border:         #333;
 195
 196 // Grid
 197 @grid-bg-active:                 @menuitem-bg-active;
 198 @grid-border-active:             #d6d6d6;
 199 @grid-border:                    #d6d6d6;
 200
 201 // Misc
 202 @colorbtn-backcolor-bg:          #384552;
 203 @iframe-border:                  @panel-border;
 204
 205 // Slider
 206 @slider-border:                  #202a33;
 207 @slider-bg:                      #515c67;
 208 @slider-handle-border:           #000000;
 209 @slider-handle-bg:               #454f59;
 210 @slider-handle-bg-focus:         #BBB;
 211
 212 // Progress
 213 @progress-border:                #202a33;
 214 @progress-bar-bg:                #515c67;
 215 @progress-bar-bg-hlight:         #515c67;
 216 @progress-text:                  #c4c4c4;
 217
 218 // Flow layout
 219 @flow-layout-spacing:            2px;
 220
 221 // Table
 222
 223 @table-row-even:                  #fafafa;
 224 @table-row-hover:                 darken(@table-row-even, 10%);