_source/skins/kama/toolbar.css

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