lib/dijit/themes/claro/ColorPalette.css

   1 /* ColorPalette
   2  *
   3  * Styling of the ColorPalette consists of the following:
   4  *
   5  * 1. the whole color palette
   6  *              .dijitColorPalette - for outline, border, and background color of the whole color palette
   7  *              Note: outline does not work for IE
   8  *
   9  * 2. the color swatch
  10  *              .dijitColorPalette .dijitPaletteImg
  11  *              transparent (but clickable) <img> node inside of each <td>, overlaying the color swatch.
  12  *              displays border around a color swatch
  13  *
  14  * 3. hovered swatch
  15  *              .dijitColorPalette .dijitPaletteCell:hover .dijitPaletteImg
  16  *              the hovered state of the color swatch - adds border
  17  *
  18  * 4. active and selected swatch
  19  *              .dijitColorPalette .dijitPaletteCell:active .dijitPaletteImg
  20  *              .dijitColorPalette .dijitPaletteCellSelected .dijitPaletteImg
  21  *              adds border for active or selected state
  22  */
  23 .claro .dijitColorPalette {
  24   border: 1px solid #b5bcc7;
  25   background: #ffffff;
  26   -moz-border-radius: 0;
  27   border-radius: 0;
  28 }
  29 .claro .dijitColorPalette .dijitPaletteImg {
  30   /* transparent (but clickable) <img> node inside of each <td>, overlaying the color swatch.
  31          * displays border around a color swatch
  32          * overrides border color in dijit.css */
  33
  34   border: 1px solid #d3d3d3;
  35 }
  36 .claro .dijitColorPalette .dijitPaletteCell:hover .dijitPaletteImg {
  37   border: 1px solid #000000;
  38 }
  39 .claro .dijitColorPalette .dijitPaletteCell:active .dijitPaletteImg, .claro .dijitColorPalette .dijitPaletteTable .dijitPaletteCellSelected .dijitPaletteImg {
  40   border: 2px solid #000000;
  41 }