editor/editorFormatToolbar.css

   1 /* This Source Code Form is subject to the terms of the Mozilla Public
   2  * License, v. 2.0. If a copy of the MPL was not distributed with this
   3  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
   4
   5 @namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
   6
   7 /* ::::: formatting buttons ::::: */
   8
   9 #FormatToolbar > toolbarbutton > .toolbarbutton-text {
  10   display: none;
  11 }
  12
  13 toolbarbutton.formatting-button {
  14   min-width: 18px;
  15 }
  16
  17 #DecreaseFontSizeButton {
  18   list-style-image: url("chrome://editor/skin/icons/dec-font-size.gif");
  19 }
  20
  21 #DecreaseFontSizeButton:hover,
  22 #DecreaseFontSizeButton:hover:active {
  23   list-style-image: url("chrome://editor/skin/icons/dec-font-size-hover.gif");
  24 }
  25
  26 #DecreaseFontSizeButton[disabled="true"] {
  27   list-style-image: url("chrome://editor/skin/icons/dec-font-size-disabled.gif") !important;
  28 }
  29
  30 #IncreaseFontSizeButton {
  31   list-style-image: url("chrome://editor/skin/icons/inc-font-size.gif");
  32 }
  33
  34 #IncreaseFontSizeButton:hover,
  35 #IncreaseFontSizeButton:hover:active {
  36   list-style-image: url("chrome://editor/skin/icons/inc-font-size-hover.gif");
  37 }
  38
  39 #IncreaseFontSizeButton[disabled="true"] {
  40   list-style-image: url("chrome://editor/skin/icons/inc-font-size-disabled.gif") !important;
  41 }
  42
  43 #boldButton {
  44   list-style-image: url(chrome://editor/skin/icons/bold.gif);
  45 }
  46
  47 #boldButton:hover,
  48 #boldButton:hover:active {
  49   list-style-image: url("chrome://editor/skin/icons/bold-hover.gif");
  50 }
  51
  52 #boldButton[disabled="true"] {
  53   list-style-image: url("chrome://editor/skin/icons/bold-disabled.gif") !important;
  54 }
  55
  56 #italicButton {
  57   list-style-image: url("chrome://editor/skin/icons/italic.gif");
  58 }
  59
  60 #italicButton:hover,
  61 #italicButton:hover:active {
  62   list-style-image: url("chrome://editor/skin/icons/italic-hover.gif");
  63 }
  64
  65 #italicButton[disabled="true"] {
  66   list-style-image: url("chrome://editor/skin/icons/italic-disabled.gif") !important;
  67 }
  68
  69 #underlineButton {
  70   list-style-image: url("chrome://editor/skin/icons/underline.gif");
  71 }
  72
  73 #underlineButton:hover,
  74 #underlineButton:hover:active {
  75   list-style-image: url("chrome://editor/skin/icons/underline-hover.gif");
  76 }
  77
  78 #underlineButton[disabled="true"] {
  79   list-style-image: url("chrome://editor/skin/icons/underline-disabled.gif") !important;
  80 }
  81
  82 #ulButton {
  83   list-style-image:url("chrome://editor/skin/icons/bullets.gif");
  84 }
  85
  86 #ulButton:hover,
  87 #ulButton:hover:active {
  88   list-style-image: url("chrome://editor/skin/icons/bullets-hover.gif");
  89 }
  90
  91 #ulButton[disabled="true"] {
  92   list-style-image: url("chrome://editor/skin/icons/bullets-disabled.gif") !important;
  93 }
  94
  95 #olButton {
  96   list-style-image: url("chrome://editor/skin/icons/numbers.gif");
  97 }
  98
  99 #olButton:hover,
 100 #olButton:hover:active {
 101   list-style-image: url("chrome://editor/skin/icons/numbers-hover.gif");
 102 }
 103
 104 #olButton[disabled="true"] {
 105   list-style-image: url("chrome://editor/skin/icons/numbers-disabled.gif") !important;
 106 }
 107
 108 #outdentButton {
 109   list-style-image: url("chrome://editor/skin/icons/outdent.gif");
 110 }
 111
 112 #outdentButton:hover,
 113 #outdentButton:hover:active {
 114   list-style-image: url("chrome://editor/skin/icons/outdent-hover.gif");
 115 }
 116
 117 #outdentButton[disabled="true"] {
 118   list-style-image: url("chrome://editor/skin/icons/outdent-disabled.gif") !important;
 119 }
 120
 121 #indentButton {
 122   list-style-image: url("chrome://editor/skin/icons/indent.gif");
 123 }
 124
 125 #indentButton:hover,
 126 #indentButton:hover:active {
 127   list-style-image: url("chrome://editor/skin/icons/indent-hover.gif");
 128 }
 129
 130 #indentButton[disabled="true"] {
 131   list-style-image: url("chrome://editor/skin/icons/indent-disabled.gif") !important;
 132 }
 133
 134 #align-left-button {
 135   list-style-image: url("chrome://editor/skin/icons/left.gif");
 136 }
 137
 138 #align-left-button:hover,
 139 #align-left-button:hover:active {
 140   list-style-image: url("chrome://editor/skin/icons/left-hover.gif");
 141 }
 142
 143 #align-left-button[disabled="true"] {
 144   list-style-image: url("chrome://editor/skin/icons/left-disabled.gif") !important;
 145 }
 146
 147 #align-center-button {
 148   list-style-image: url("chrome://editor/skin/icons/center.gif");
 149 }
 150
 151 #align-center-button:hover,
 152 #align-center-button:hover:active {
 153   list-style-image: url("chrome://editor/skin/icons/center-hover.gif");
 154 }
 155
 156 #align-center-button[disabled="true"] {
 157   list-style-image: url("chrome://editor/skin/icons/center-disabled.gif") !important;
 158 }
 159
 160 #align-right-button {
 161   list-style-image: url("chrome://editor/skin/icons/right.gif");
 162 }
 163
 164 #align-right-button:hover,
 165 #align-right-button:hover:active {
 166   list-style-image: url("chrome://editor/skin/icons/right-hover.gif");
 167 }
 168
 169 #align-right-button[disabled="true"] {
 170   list-style-image: url("chrome://editor/skin/icons/right-disabled.gif") !important;
 171 }
 172
 173 #align-justify-button {
 174   list-style-image: url("chrome://editor/skin/icons/justify.gif");
 175 }
 176
 177 #align-justify-button:hover,
 178 #align-justify-button:hover:active {
 179   list-style-image: url("chrome://editor/skin/icons/justify-hover.gif");
 180 }
 181
 182 #align-justify-button[disabled="true"] {
 183   list-style-image: url("chrome://editor/skin/icons/justify-disabled.gif") !important;
 184 }
 185
 186 #AlignPopupButton {
 187   list-style-image: url("chrome://editor/skin/icons/align.gif");
 188 }
 189
 190 #AlignPopupButton:hover,
 191 #AlignPopupButton:hover:active,
 192 #AlignPopupButton[open="true"] {
 193   list-style-image: url("chrome://editor/skin/icons/align-hover.gif");
 194 }
 195
 196 #AlignPopupButton[disabled="true"] {
 197   list-style-image: url("chrome://editor/skin/icons/align-disabled.gif") !important;
 198 }
 199
 200 #InsertPopupButton {
 201   list-style-image: url("chrome://editor/skin/icons/insert.gif");
 202 }
 203
 204 #InsertPopupButton:hover,
 205 #InsertPopupButton:hover:active,
 206 #InsertPopupButton[open="true"] {
 207   list-style-image: url("chrome://editor/skin/icons/insert-hover.gif");
 208 }
 209
 210 #InsertPopupButton[disabled="true"] {
 211   list-style-image: url("chrome://editor/skin/icons/insert-disabled.gif") !important;
 212 }
 213
 214 #smileButtonMenu {
 215   list-style-image: url("chrome://editor/skin/icons/smile.gif");
 216 }
 217
 218 #smileButtonMenu[disabled="true"] {
 219   list-style-image: url("chrome://editor/skin/icons/smile-disabled.gif") !important;
 220 }
 221
 222 /* ::::: menuitem icons ::::: */
 223
 224 /* ..... align menu ..... */
 225
 226 #AlignLeftItem {
 227   list-style-image: url("chrome://editor/skin/icons/left.gif");
 228 }
 229
 230 #AlignLeftItem:hover,
 231 #AlignLeftItem:hover:active {
 232   list-style-image: url("chrome://editor/skin/icons/left-hover.gif");
 233 }
 234
 235 #AlignCenterItem {
 236   list-style-image: url("chrome://editor/skin/icons/center.gif");
 237 }
 238
 239 #AlignCenterItem:hover,
 240 #AlignCenterItem:hover:active {
 241   list-style-image: url("chrome://editor/skin/icons/center-hover.gif");
 242 }
 243
 244 #AlignRightItem {
 245   list-style-image: url("chrome://editor/skin/icons/right.gif");
 246 }
 247
 248 #AlignRightItem:hover,
 249 #AlignRightItem:hover:active {
 250   list-style-image: url("chrome://editor/skin/icons/right-hover.gif");
 251 }
 252
 253 #AlignJustifyItem {
 254   list-style-image: url("chrome://editor/skin/icons/justify.gif");
 255 }
 256
 257 #AlignJustifyItem:hover,
 258 #AlignJustifyItem:hover:active {
 259   list-style-image: url("chrome://editor/skin/icons/justify-hover.gif");
 260 }
 261
 262 /* ..... insert menu ..... */
 263
 264 #InsertPopup > menuitem {
 265   list-style-image: url("chrome://editor/skin/icons/editoricons-small.png");
 266 }
 267
 268 #InsertLinkItem {
 269   -moz-image-region: rect(48px 16px 64px 0);
 270 }
 271
 272 #InsertLinkItem:hover,
 273 #InsertLinkItem:hover:active {
 274   -moz-image-region: rect(48px 48px 64px 32px);
 275 }
 276
 277 #InsertAnchorItem {
 278   -moz-image-region: rect(0px 16px 16px 0);
 279 }
 280
 281 #InsertAnchorItem:hover,
 282 #InsertAnchorItem:hover:active {
 283   -moz-image-region: rect(0px 48px 16px 32px);
 284 }
 285
 286 #InsertImageItem {
 287   -moz-image-region: rect(32px 16px 48px 0);
 288 }
 289
 290 #InsertImageItem:hover,
 291 #InsertImageItem:hover:active {
 292   -moz-image-region: rect(32px 48px 48px 32px);
 293 }
 294
 295 #InsertHRuleItem {
 296   -moz-image-region: rect(16px 16px 32px 0);
 297 }
 298
 299 #InsertHRuleItem:hover,
 300 #InsertHRuleItem:hover:active {
 301   -moz-image-region: rect(16px 48px 32px 32px);
 302 }
 303
 304 #InsertTableItem {
 305   -moz-image-region: rect(144px 16px 160px 0);
 306 }
 307
 308 #InsertTableItem:hover,
 309 #InsertTableItem:hover:active {
 310   -moz-image-region: rect(144px 48px 160px 32px);
 311 }
 312
 313 /* ..... smiley menu ..... */
 314
 315 .insert-smile {
 316   list-style-image: url("chrome://communicator/skin/icons/smileys/smiley-smile.png");
 317 }
 318
 319 .insert-frown {
 320   list-style-image: url("chrome://communicator/skin/icons/smileys/smiley-frown.png");
 321 }
 322
 323 .insert-wink {
 324   list-style-image: url("chrome://communicator/skin/icons/smileys/smiley-wink.png");
 325 }
 326
 327 .insert-tongue {
 328   list-style-image: url("chrome://communicator/skin/icons/smileys/smiley-tongue.png");
 329 }
 330
 331 .insert-laughing {
 332   list-style-image: url("chrome://communicator/skin/icons/smileys/smiley-laughing.png");
 333 }
 334
 335 .insert-embarrassed {
 336   list-style-image: url("chrome://communicator/skin/icons/smileys/smiley-embarrassed.png");
 337 }
 338
 339 .insert-undecided {
 340   list-style-image: url("chrome://communicator/skin/icons/smileys/smiley-undecided.png");
 341 }
 342
 343 .insert-surprise {
 344   list-style-image: url("chrome://communicator/skin/icons/smileys/smiley-surprise.png");
 345 }
 346
 347 .insert-kiss {
 348   list-style-image: url("chrome://communicator/skin/icons/smileys/smiley-kiss.png");
 349 }
 350
 351 .insert-yell {
 352   list-style-image: url("chrome://communicator/skin/icons/smileys/smiley-yell.png");
 353 }
 354
 355 .insert-cool {
 356   list-style-image: url("chrome://communicator/skin/icons/smileys/smiley-cool.png");
 357 }
 358
 359 .insert-money {
 360   list-style-image: url("chrome://communicator/skin/icons/smileys/smiley-money.png");
 361 }
 362
 363 .insert-foot {
 364   list-style-image: url("chrome://communicator/skin/icons/smileys/smiley-foot.png");
 365 }
 366
 367 .insert-innocent {
 368   list-style-image: url("chrome://communicator/skin/icons/smileys/smiley-innocent.png");
 369 }
 370
 371 .insert-cry {
 372   list-style-image: url("chrome://communicator/skin/icons/smileys/smiley-cry.png");
 373 }
 374
 375 .insert-sealed {
 376   list-style-image: url("chrome://communicator/skin/icons/smileys/smiley-sealed.png");
 377 }
 378
 379 /* ::::: fg/bg color picker ::::: */
 380
 381 .ColorPickerLabel {
 382   border: 1px inset #FF9F00;
 383   margin: 0px;
 384   padding: 2px;
 385 }
 386
 387 .color-button {
 388   border: 1px inset #9C9CFF;
 389   padding: 0px;
 390   width: 14px;
 391   height: 12px;
 392   margin: 2px;
 393 }
 394
 395 .color-button:hover {
 396   border: 1px solid #FFCF00;
 397 }
 398
 399 #TextColorButton {
 400   margin-top: 2px;
 401   margin-bottom: 9px;
 402   -moz-margin-start: 2px;
 403   -moz-margin-end: 9px;
 404 }
 405
 406 #TextColorButton[color="mixed"] {
 407   background-image: url("chrome://editor/skin/icons/multicolor.png");
 408   background-size: cover;
 409 }
 410
 411 #BackgroundColorButton {
 412   margin-top: 9px;
 413   margin-bottom: 2px;
 414   -moz-margin-start: 9px;
 415   -moz-margin-end: 2px;
 416 }
 417
 418 #HighlightColorButton {
 419   list-style-image: url("chrome://editor/skin/icons/highlight.gif");
 420   background-color: transparent;
 421 }
 422
 423 #HighlightColorButton:hover,
 424 #HighlightColorButton:hover:active {
 425   list-style-image: url("chrome://editor/skin/icons/highlight-hover.gif");
 426 }
 427
 428 #HighlightColorButton[disabled="true"] {
 429   list-style-image: url("chrome://editor/skin/icons/highlight-disabled.gif") !important;
 430 }
 431
 432 #absolutePositionButton {
 433   list-style-image: url("chrome://editor/skin/icons/pinned.gif");
 434 }
 435
 436 #absolutePositionButton:hover,
 437 #absolutePositionButton:hover:active {
 438   list-style-image: url("chrome://editor/skin/icons/pinned-hover.gif");
 439 }
 440
 441 #absolutePositionButton[disabled="true"] {
 442   list-style-image: url("chrome://editor/skin/icons/pinned-disabled.gif") !important;
 443 }
 444
 445 #absolutePositionButton[checked="true"] {
 446   list-style-image: url("chrome://editor/skin/icons/notpinned.gif");
 447 }
 448
 449 #absolutePositionButton[checked="true"]:hover,
 450 #absolutePositionButton[checked="true"]:hover:active {
 451   list-style-image: url("chrome://editor/skin/icons/notpinned-hover.gif");
 452 }
 453
 454 #increaseZIndexButton {
 455   list-style-image: url("chrome://editor/content/images/bringtofront.gif");
 456 }
 457
 458 #increaseZIndexButton[disabled="true"] {
 459   list-style-image: url("chrome://editor/content/images/bringtofront-disabled.gif");
 460 }
 461
 462 #decreaseZIndexButton {
 463   list-style-image: url("chrome://editor/content/images/sendtoback.gif");
 464 }
 465
 466 #decreaseZIndexButton[disabled="true"] {
 467   list-style-image: url("chrome://editor/content/images/sendtoback-disabled.gif");
 468 }