JasonWoof Got questions, comments, patches, etc.? Contact Jason Woofenden
vanilla ckeditor-3.4.1
[ckeditor.git] / _source / skins / kama / toolbar.css
1 /*\r
2 Copyright (c) 2003-2010, CKSource - Frederico Knabben. All rights reserved.\r
3 For licensing, see LICENSE.html or http://ckeditor.com/license\r
4 */\r
5 \r
6 @media print\r
7 {\r
8         /* For printing, we simply hide the toolbar */\r
9 \r
10         .cke_skin_kama .cke_toolbox\r
11         {\r
12                 display: none;\r
13         }\r
14 }\r
15 \r
16 .cke_skin_kama .cke_browser_webkit .cke_toolbox,\r
17 .cke_skin_kama .cke_browser_webkit .cke_toolbox > span\r
18 {\r
19         white-space: normal;\r
20 }\r
21 \r
22 .cke_skin_kama .cke_toolbox\r
23 {\r
24         clear: both;\r
25         /* Define the padding-bottom otherwise the collapser button will not be clickable #4932*/\r
26         padding-bottom: 1px;\r
27 }\r
28 \r
29 .cke_skin_kama a.cke_toolbox_collapser,\r
30 .cke_skin_kama a:hover.cke_toolbox_collapser\r
31 {\r
32         /* arrowtop.gif */\r
33         background-image: url(images/sprites.png);\r
34         _background-image: url(images/sprites_ie6.png);\r
35         background-position: 3px -1366px; /* +3px +4px */\r
36         background-repeat: no-repeat;\r
37         width: 11px;\r
38         height: 11px;\r
39         float: right;\r
40         border: 1px outset #D3D3D3;\r
41         margin: 11px 0 2px;\r
42         cursor: pointer;\r
43 }\r
44 \r
45 .cke_skin_kama .cke_rtl a.cke_toolbox_collapser,\r
46 .cke_skin_kama .cke_rtl a:hover.cke_toolbox_collapser\r
47 {\r
48         float: left;\r
49 }\r
50 \r
51 .cke_skin_kama a.cke_toolbox_collapser span\r
52 {\r
53         display: none;\r
54 }\r
55 \r
56 .cke_skin_kama .cke_hc a.cke_toolbox_collapser span\r
57 {\r
58         font-size: 10px;\r
59         font-weight: bold;\r
60         font-family: Arial;\r
61         display: inline;\r
62 }\r
63 \r
64 .cke_skin_kama a.cke_toolbox_collapser_min,\r
65 .cke_skin_kama a:hover.cke_toolbox_collapser_min\r
66 {\r
67         /* arrowleft.gif*/\r
68         background-image: url(images/sprites.png);\r
69         _background-image: url(images/sprites_ie6.png);\r
70         background-position: 4px -1387px; /* +4px +3px */\r
71         background-repeat: no-repeat;\r
72         margin: 2px 4px;\r
73 }\r
74 \r
75 .cke_skin_kama .cke_rtl a.cke_toolbox_collapser_min,\r
76 .cke_skin_kama .cke_rtl a:hover.cke_toolbox_collapser_min\r
77 {\r
78         /* arrowright.gif*/\r
79         background-position: 4px -1408px; /* +2px +3px */\r
80 }\r
81 \r
82 .cke_skin_kama .cke_toolbar\r
83 {\r
84         display: inline;\r
85 }\r
86 \r
87 .cke_skin_kama .cke_separator\r
88 {\r
89         display: none;\r
90 }\r
91 \r
92 .cke_skin_kama .cke_break\r
93 {\r
94         font-size: 0;\r
95         clear: left;\r
96 }\r
97 \r
98 .cke_skin_kama .cke_rtl .cke_break\r
99 {\r
100         clear: right;\r
101 }\r
102 \r
103 .cke_skin_kama .cke_toolbar_start\r
104 {\r
105         display: none;\r
106 }\r
107 \r
108 .cke_skin_kama .cke_toolgroup\r
109 {\r
110         -moz-border-radius:5px;\r
111         -webkit-border-radius: 5px;\r
112         border-radius: 5px;\r
113         background-image: url(images/sprites.png);\r
114         _background-image: url(images/sprites_ie6.png);\r
115         background-repeat: repeat-x;\r
116         background-position: 0 -500px;\r
117         float: left;\r
118         margin-right: 6px;\r
119         margin-bottom: 5px;\r
120         padding: 2px;\r
121         display: inline;\r
122 }\r
123 \r
124 .cke_skin_kama .cke_rtl .cke_toolgroup\r
125 {\r
126         float: right;\r
127         margin-right: 0;\r
128         margin-left: 6px;\r
129 }\r
130 \r
131 .cke_skin_kama .cke_toolgroup\r
132 {\r
133         display: block;\r
134         height: 22px;\r
135 }\r
136 \r
137 .cke_skin_kama .cke_button a,\r
138 .cke_skin_kama .cke_button a:hover,\r
139 .cke_skin_kama .cke_button a:focus,\r
140 .cke_skin_kama .cke_button a:active,\r
141 .cke_skin_kama .cke_button a.cke_off\r
142 {\r
143         border-radius: 3px;\r
144         outline: none;\r
145         padding: 2px 4px;\r
146         height: 18px;\r
147         display: inline-block;\r
148         cursor: default;\r
149 }\r
150 \r
151 .cke_skin_kama .cke_button a,\r
152 .cke_skin_kama .cke_button a.cke_off\r
153 {\r
154         filter: alpha(opacity=70); /* IE */\r
155         opacity: 0.70; /* Safari, Opera and Mozilla */\r
156         -moz-border-radius: 3px;\r
157         -webkit-border-radius: 3px;\r
158 }\r
159 \r
160 .cke_skin_kama .cke_hc .cke_button a,\r
161 .cke_skin_kama .cke_hc .cke_button a.cke_off\r
162 {\r
163         opacity: 1.0;\r
164         filter: alpha(opacity=100);\r
165         border: 1px solid white;\r
166 }\r
167 \r
168 .cke_skin_kama .cke_button a.cke_on\r
169 {\r
170         background-color: #a3d7ff;\r
171         filter: alpha(opacity=100); /* IE */\r
172         opacity: 1; /* Safari, Opera and Mozilla */\r
173         padding: 2px 4px;\r
174 }\r
175 \r
176 .cke_skin_kama .cke_hc .cke_button a.cke_on\r
177 {\r
178         padding: 0 2px !important;\r
179         border-width: 3px;\r
180 }\r
181 \r
182 .cke_skin_kama .cke_button a.cke_disabled *,\r
183 .cke_skin_kama .cke_browser_ie a:hover.cke_button .cke_disabled *\r
184 {\r
185         filter: alpha(opacity=30); /* IE */\r
186         opacity: 0.3; /* Safari, Opera and Mozilla */\r
187 }\r
188 \r
189 .cke_skin_kama .cke_hc .cke_button a.cke_disabled *,\r
190 .cke_skin_kama .cke_browser_ie.cke_hc a:hover.cke_button .cke_disabled *\r
191 {\r
192         filter: alpha(opacity=60);\r
193         opacity: 0.6;\r
194 }\r
195 \r
196 .cke_skin_kama .cke_button a:hover.cke_on,\r
197 .cke_skin_kama .cke_button a:focus.cke_on,\r
198 .cke_skin_kama .cke_button a:active.cke_on,     /* IE */\r
199 .cke_skin_kama .cke_button a:hover.cke_off,\r
200 .cke_skin_kama .cke_button a:focus.cke_off,\r
201 .cke_skin_kama .cke_button a:active.cke_off     /* IE */\r
202 {\r
203         filter: alpha(opacity=100); /* IE */\r
204         opacity: 1; /* Safari, Opera and Mozilla */\r
205         padding: 2px 4px;\r
206 }\r
207 \r
208 .cke_skin_kama .cke_button a:hover,\r
209 .cke_skin_kama .cke_button a:focus,\r
210 .cke_skin_kama .cke_button a:active     /* IE */\r
211 {\r
212         background-color: #dff1ff;\r
213 }\r
214 \r
215 .cke_skin_kama .cke_button a:hover.cke_on,\r
216 .cke_skin_kama .cke_button a:focus.cke_on,\r
217 .cke_skin_kama .cke_button a:active.cke_on      /* IE */\r
218 {\r
219         background-color: #86caff;\r
220 }\r
221 \r
222 .cke_skin_kama .cke_hc .cke_button a:hover,\r
223 .cke_skin_kama .cke_hc .cke_button a:focus,\r
224 .cke_skin_kama .cke_hc .cke_button a:active     /* IE */\r
225 {\r
226         padding: 0 2px !important;\r
227         border-width: 3px;\r
228 }\r
229 \r
230 .cke_skin_kama .cke_button .cke_icon\r
231 {\r
232         background-image: url(icons.png);\r
233         background-position: 100px;\r
234         background-repeat: no-repeat;\r
235         margin-top: 1px;\r
236         width: 16px;\r
237         height: 16px;\r
238         display: inline-block;\r
239         float: left;\r
240         cursor: default;\r
241 }\r
242 \r
243 .cke_skin_kama .cke_rtl .cke_button .cke_icon\r
244 {\r
245         background-image: url(icons_rtl.png);\r
246 }\r
247 \r
248 .cke_skin_kama .cke_rtl .cke_button .cke_icon\r
249 {\r
250         float: right;\r
251 }\r
252 \r
253 .cke_skin_kama .cke_button .cke_label\r
254 {\r
255         cursor: default;\r
256         display: none;\r
257         padding-left: 3px;\r
258         line-height: 18px;\r
259         vertical-align: middle;\r
260         float: left;\r
261 }\r
262 \r
263 .cke_skin_kama .cke_rtl .cke_button .cke_label\r
264 {\r
265         padding-left: 0;\r
266         padding-right: 3px;\r
267         float: right;\r
268 }\r
269 \r
270 .cke_skin_kama .cke_hc .cke_button .cke_label\r
271 {\r
272         padding: 0;\r
273         display: inline-block;\r
274 }\r
275 \r
276 .cke_skin_kama .cke_hc .cke_button .cke_icon\r
277 {\r
278         display: none;\r
279 }\r
280 \r
281 .cke_skin_kama .cke_accessibility\r
282 {\r
283         position: absolute;\r
284         display: block;\r
285         width: 0;\r
286         height: 0;\r
287         overflow: hidden;\r
288 }\r
289 \r
290 .cke_skin_kama .cke_button .cke_buttonarrow\r
291 {\r
292         display: inline-block;\r
293         height: 17px;\r
294         width: 8px;\r
295         background-position: 2px -1469px; /* (+2, -5) */\r
296         background-image: url(images/sprites.png);\r
297         _background-image: url(images/sprites_ie6.png);\r
298         background-repeat: no-repeat;\r
299         float: left;\r
300         cursor: default;\r
301 }\r
302 \r
303 .cke_skin_kama .cke_rtl .cke_button .cke_buttonarrow\r
304 {\r
305         background-position: 0 -1469px; /* (0, -5) */\r
306         float: right;\r
307 }\r
308 \r
309 /*** Firefox 2 ***/\r
310 \r
311 .cke_skin_kama .cke_browser_gecko .cke_toolbar,\r
312 .cke_skin_kama .cke_browser_gecko .cke_button a,\r
313 .cke_skin_kama .cke_browser_gecko .cke_button a.cke_off,\r
314 .cke_skin_kama .cke_browser_gecko .cke_button .cke_icon,\r
315 .cke_skin_kama .cke_browser_gecko .cke_button .cke_buttonarrow,\r
316 .cke_skin_kama .cke_browser_gecko .cke_separator,\r
317 .cke_skin_kama .cke_browser_gecko .cke_toolbar_start\r
318 {\r
319         display: block;\r
320         float: left;\r
321 }\r
322 \r
323 .cke_skin_kama .cke_browser_gecko.cke_hc .cke_button .cke_icon\r
324 {\r
325         display: none;\r
326 }\r
327 \r
328 .cke_skin_kama .cke_browser_gecko .cke_rtl .cke_toolbar,\r
329 .cke_skin_kama .cke_browser_gecko .cke_rtl .cke_button a,\r
330 .cke_skin_kama .cke_browser_gecko .cke_rtl.cke_button a.cke_off,\r
331 .cke_skin_kama .cke_browser_gecko .cke_rtl .cke_button .cke_icon,\r
332 .cke_skin_kama .cke_browser_gecko .cke_rtl .cke_button .cke_buttonarrow,\r
333 .cke_skin_kama .cke_browser_gecko .cke_rtl .cke_toolbar_start\r
334 {\r
335         float: right;\r
336 }\r
337 \r
338 .cke_skin_kama .cke_browser_gecko .cke_button .cke_label,\r
339 .cke_skin_kama .cke_browser_gecko .cke_break\r
340 {\r
341         float: left;\r
342 }\r
343 \r
344 .cke_skin_kama .cke_browser_gecko .cke_rtl .cke_button .cke_label,\r
345 .cke_skin_kama .cke_browser_gecko .cke_rtl .cke_break\r
346 {\r
347         float: right;\r
348 }\r
349 \r
350 /*** IE ***/\r
351 \r
352 /* The biggest problem with IE is the RTL support (and float:right). It's\r
353    totally broken, and quite delicate. IE8 fixed these issues. */\r
354 \r
355 .cke_skin_kama .cke_browser_ie .cke_rtl .cke_button .cke_icon,\r
356 .cke_skin_kama .cke_browser_ie .cke_rtl .cke_button .cke_label,\r
357 .cke_skin_kama .cke_browser_ie .cke_rtl .cke_button .cke_buttonarrow\r
358 {\r
359         float: none;\r
360 }\r
361 \r
362 /*** WebKit ***/\r
363 \r
364 /* We have originally used display:inline-block+float for cke_toolbar and it\r
365    worked well in all browsers, except IE+RTL. We had to change it to inline\r
366    and remove the float. This change didn't play well with Safari. */\r
367 \r
368 .cke_skin_kama .cke_browser_webkit .cke_toolbar\r
369 {\r
370         float: left;\r
371 }\r
372 \r
373 .cke_skin_kama .cke_browser_webkit .cke_rtl .cke_toolbar\r
374 {\r
375         float: right;\r
376 }\r
377 \r
378 /*** Mixed Fixes ***/\r
379 \r
380 .cke_skin_kama .cke_browser_ie8 .cke_button .cke_label,\r
381 .cke_skin_kama .cke_browser_opera .cke_button .cke_label,\r
382 .cke_skin_kama .cke_browser_webkit .cke_button .cke_label\r
383 {\r
384         line-height: 20px;\r
385 }\r
386 \r
387 .cke_skin_kama .cke_browser_opera.cke_browser_quirks .cke_button .cke_label,\r
388 .cke_skin_kama .cke_browser_iequirks .cke_button .cke_label\r
389 {\r
390         line-height: 17px;\r
391 }\r
392 \r
393 /* Fix cursor shape consistency on toolbar combos (#4031) */\r
394 .cke_skin_kama .cke_browser_ie .cke_rcombo,\r
395 .cke_skin_kama .cke_browser_ie .cke_rcombo *\r
396 {\r
397         cursor: default;\r
398 }\r
399 \r
400 .cke_skin_kama .cke_browser_ie .cke_toolbox\r
401 {\r
402         padding-bottom: 5px;\r
403         _padding-bottom: 6px;\r
404 }\r
405 \r
406 .cke_shared .cke_skin_kama .cke_browser_ie .cke_toolbox\r
407 {\r
408         padding-bottom: 0;\r
409 }\r