|
@@ -0,0 +1,147 @@
|
|
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: true;
|
|
13
|
+@has-boxshadow: false;
|
|
14
|
+
|
|
15
|
+// Text colors
|
|
16
|
+@text: #333333;
|
|
17
|
+@text-inverse: #ffffff;
|
|
18
|
+@text-disabled: #aaaaaa;
|
|
19
|
+@text-shadow: 0 1px 1px hsla(hue(@text-inverse), saturation(@text-inverse), lightness(@text-inverse), 0.75);
|
|
20
|
+@text-error: #aa0000;
|
|
21
|
+
|
|
22
|
+// Button
|
|
23
|
+@btn-text: #333333;
|
|
24
|
+@btn-text-shadow: #ffffff;
|
|
25
|
+@btn-border-top: rgba(0,0,0,0.2);
|
|
26
|
+@btn-border-right: rgba(0,0,0,0.2);
|
|
27
|
+@btn-border-bottom: rgba(0,0,0,0.2);
|
|
28
|
+@btn-border-left: rgba(0,0,0,0.2);
|
|
29
|
+@btn-split-border: #bdbdbd;
|
|
30
|
+@btn-caret-border: @btn-text;
|
|
31
|
+@btn-text-disabled: @text-disabled;
|
|
32
|
+@btn-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .2), 0 1px 2px rgba(0, 0, 0, .05);
|
|
33
|
+@btn-box-shadow-active: inset 0 2px 4px rgba(0, 0, 0, .15), 0 1px 2px rgba(0, 0, 0, .05);
|
|
34
|
+@btn-box-disabled-opacity: 0.4;
|
|
35
|
+@btn-bg: #ffffff;
|
|
36
|
+@btn-bg-hlight: #ffffff;
|
|
37
|
+@btn-bg-hover: darken(@btn-bg, 5%);
|
|
38
|
+@btn-bg-hlight-hover: darken(@btn-bg-hlight, 5%);
|
|
39
|
+
|
|
40
|
+@btn-primary-bg: #0088cc;
|
|
41
|
+@btn-primary-bg-hlight: #0044cc;
|
|
42
|
+@btn-primary-bg-hover: darken(@btn-primary-bg, 5%);
|
|
43
|
+@btn-primary-bg-hover-hlight: darken(@btn-primary-bg-hlight, 5%);
|
|
44
|
+@btn-primary-text: #ffffff;
|
|
45
|
+@btn-primary-text-shadow: #333333;
|
|
46
|
+@btn-primary-border-top: mix(@btn-border-top, @btn-primary-bg, 50%);
|
|
47
|
+@btn-primary-border-right: mix(@btn-border-right, @btn-primary-bg, 50%);
|
|
48
|
+@btn-primary-border-bottom: mix(@btn-border-bottom, @btn-primary-bg, 50%);
|
|
49
|
+@btn-primary-border-left: mix(@btn-border-left, @btn-primary-bg, 50%);
|
|
50
|
+
|
|
51
|
+// Menu
|
|
52
|
+@menuitem-text: #333333;
|
|
53
|
+@menu-bg: #ffffff;
|
|
54
|
+@menu-border: rgba(0,0,0,0.2);
|
|
55
|
+@menubar-border: mix(@panel-border, @panel-bg, 60%);
|
|
56
|
+@menuitem-text-inverse: #ffffff;
|
|
57
|
+@menubar-bg-active: darken(@btn-bg, 10%);
|
|
58
|
+@menuitem-bg-hover: #0081C2;
|
|
59
|
+@menuitem-bg-selected: #0088cc;
|
|
60
|
+@menuitem-bg-selected-hlight: #0077b3;
|
|
61
|
+@menuitem-bg-disabled: #CCC;
|
|
62
|
+@menuitem-caret: @menuitem-text;
|
|
63
|
+@menuitem-caret-selected: @menuitem-text-inverse;
|
|
64
|
+@menuitem-separator-top: #cbcbcb;
|
|
65
|
+@menuitem-separator-bottom: #ffffff;
|
|
66
|
+@menuitem-bg-active: #c8def4;
|
|
67
|
+@menuitem-text-active: #333333;
|
|
68
|
+@menuitem-preview-border-active: #aaaaaa;
|
|
69
|
+
|
|
70
|
+// Panel
|
|
71
|
+@panel-border: #428bca;
|
|
72
|
+@panel-bg: #ffffff;
|
|
73
|
+@panel-bg-hlight: #ffffff;
|
|
74
|
+
|
|
75
|
+// Tabs
|
|
76
|
+@tab-border: #c5c5c5;
|
|
77
|
+@tab-bg: #e3e3e3;
|
|
78
|
+@tab-bg-hover: #fdfdfd;
|
|
79
|
+@tab-bg-active: #fdfdfd;
|
|
80
|
+
|
|
81
|
+// Tooltip
|
|
82
|
+@tooltip-bg: #000;
|
|
83
|
+@tooltip-text: white;
|
|
84
|
+@tooltip-font-size: 11px;
|
|
85
|
+
|
|
86
|
+// Window
|
|
87
|
+@window-border: #c4c4c4;
|
|
88
|
+@window-head-border: @window-border;
|
|
89
|
+@window-head-close: mix(@text, @window-bg, 60%);
|
|
90
|
+@window-head-close-hover: mix(@text, @window-bg, 40%);
|
|
91
|
+@window-foot-border: @window-border;
|
|
92
|
+@window-foot-bg: @window-bg;
|
|
93
|
+@window-fullscreen-bg: #FFF;
|
|
94
|
+@window-modalblock-bg: #000;
|
|
95
|
+@window-modalblock-opacity: 0.3;
|
|
96
|
+@window-box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3);
|
|
97
|
+@window-bg: #ffffff;
|
|
98
|
+@window-title-font-size: 20px;
|
|
99
|
+
|
|
100
|
+// Popover
|
|
101
|
+@popover-bg: @window-bg;
|
|
102
|
+@popover-arrow-width: 10px;
|
|
103
|
+@popover-arrow: @window-bg;
|
|
104
|
+@popover-arrow-outer-width: @popover-arrow-width + 1;
|
|
105
|
+@popover-arrow-outer: rgba(0, 0, 0, 0.25);
|
|
106
|
+
|
|
107
|
+// Floatpanel
|
|
108
|
+@floatpanel-box-shadow: 0 5px 10px rgba(0, 0, 0, .2);
|
|
109
|
+
|
|
110
|
+// Checkbox
|
|
111
|
+@checkbox-bg: @btn-bg;
|
|
112
|
+@checkbox-bg-hlight: @btn-bg-hlight;
|
|
113
|
+@checkbox-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .2), 0 1px 2px rgba(0, 0, 0, .05);
|
|
114
|
+@checkbox-border: #c5c5c5;
|
|
115
|
+@checkbox-border-focus: #59a5e1;
|
|
116
|
+
|
|
117
|
+// Path
|
|
118
|
+@path-text: @text;
|
|
119
|
+@path-bg-focus: #666;
|
|
120
|
+@path-text-focus: #fff;
|
|
121
|
+
|
|
122
|
+// Textbox
|
|
123
|
+@textbox-text-placeholder: #aaa;
|
|
124
|
+@textbox-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
|
|
125
|
+@textbox-bg: #ffffff;
|
|
126
|
+@textbox-border: #c5c5c5;
|
|
127
|
+@textbox-border-focus: #59a5e1;
|
|
128
|
+
|
|
129
|
+// Throbber
|
|
130
|
+@throbber-bg: #fff url('img/loader.gif') no-repeat center center;
|
|
131
|
+
|
|
132
|
+// Combobox
|
|
133
|
+@combobox-border: @textbox-border;
|
|
134
|
+
|
|
135
|
+// Colorpicker
|
|
136
|
+@colorpicker-border: @textbox-border;
|
|
137
|
+@colorpicker-hue-bg: #fff;
|
|
138
|
+@colorpicker-hue-border: #333;
|
|
139
|
+
|
|
140
|
+// Grid
|
|
141
|
+@grid-bg-active: @menuitem-bg-active;
|
|
142
|
+@grid-border-active: #a1a1a1;
|
|
143
|
+@grid-border: #d6d6d6;
|
|
144
|
+
|
|
145
|
+// Misc
|
|
146
|
+@colorbtn-backcolor-bg: #bbbbbb;
|
|
147
|
+@iframe-border: @panel-border;
|