css/ui.colorpicker.css

   1 /*colorpicker*/
   2 .ui-colorpicker {
   3         width: 356px;
   4         height: 176px;
   5         overflow: hidden;
   6         position: absolute;
   7         background: url(../img/color/colorpicker_background.png);
   8         font-family: Arial, Helvetica, sans-serif;
   9         display: none;
  10 }
  11 .ui-colorpicker-color {
  12         width: 150px;
  13         height: 150px;
  14         left: 14px;
  15         top: 13px;
  16         position: absolute;
  17         background: #f00;
  18         overflow: hidden;
  19         cursor: crosshair;
  20 }
  21 .ui-colorpicker-color div {
  22         position: absolute;
  23         top: 0;
  24         left: 0;
  25         width: 150px;
  26         height: 150px;
  27         background: url(../img/color/colorpicker_overlay.png);
  28 }
  29 .ui-colorpicker-color div div {
  30         position: absolute;
  31         top: 0;
  32         left: 0;
  33         width: 11px;
  34         height: 11px;
  35         overflow: hidden;
  36         background: url(../img/color/colorpicker_select.gif);
  37         margin: -5px 0 0 -5px;
  38 }
  39 .ui-colorpicker-hue {
  40         position: absolute;
  41         top: 13px;
  42         left: 171px;
  43         width: 35px;
  44         height: 150px;
  45         cursor: n-resize;
  46 }
  47 .ui-colorpicker-hue div {
  48         position: absolute;
  49         width: 35px;
  50         height: 9px;
  51         overflow: hidden;
  52         background: url(../img/color/colorpicker_indic.gif) left top;
  53         margin: -4px 0 0 0;
  54         left: 0px;
  55 }
  56 .ui-colorpicker-new-color {
  57         position: absolute;
  58         width: 60px;
  59         height: 30px;
  60         left: 213px;
  61         top: 13px;
  62         background: #f00;
  63 }
  64 .ui-colorpicker-current-color {
  65         position: absolute;
  66         width: 60px;
  67         height: 30px;
  68         left: 283px;
  69         top: 13px;
  70         background: #f00;
  71 }
  72 .colorpicker input {
  73         background-color: transparent;
  74         border: 1px solid transparent;
  75         position: absolute;
  76         font-size: 10px;
  77         font-family: Arial, Helvetica, sans-serif;
  78         color: #898989;
  79         top: 4px;
  80         right: 11px;
  81         text-align: right;
  82         margin: 0;
  83         padding: 0;
  84         height: 11px;
  85 }
  86 .ui-colorpicker-hex {
  87         position: absolute;
  88         width: 72px;
  89         height: 22px;
  90         background: url(../img/color/colorpicker_hex.png) top;
  91         left: 212px;
  92         top: 142px;
  93 }
  94 .ui-colorpicker input {
  95         height: 15px;
  96 }
  97 .ui-colorpicker-hex input {
  98         margin-left: 18px;
  99         right: 6px;
 100         width: 47px;
 101 }
 102 .ui-colorpicker-field {
 103         height: 22px;
 104         width: 62px;
 105         background-position: top;
 106         position: absolute;
 107 }
 108 .ui-colorpicker-field label {
 109         padding-left: 17px;
 110         font-size: 10px;
 111 }
 112 .ui-colorpicker-field input {
 113         width: 25px;
 114 }
 115 .ui-colorpicker-field span {
 116         position: absolute;
 117         width: 12px;
 118         height: 22px;
 119         overflow: hidden;
 120         top: 0;
 121         right: 0;
 122         cursor: n-resize;
 123 }
 124 .ui-colorpicker-rgb-r {
 125         background-image: url(../img/color/colorpicker_rgb_r.png);
 126         top: 52px;
 127         left: 212px;
 128 }
 129 .ui-colorpicker-rgb-g {
 130         background-image: url(../img/color/colorpicker_rgb_g.png);
 131         top: 82px;
 132         left: 212px;
 133 }
 134 .ui-colorpicker-rgb-b {
 135         background-image: url(../img/color/colorpicker_rgb_b.png);
 136         top: 112px;
 137         left: 212px;
 138 }
 139 .ui-colorpicker-hsb-h {
 140         background-image: url(../img/color/colorpicker_hsb_h.png);
 141         top: 52px;
 142         left: 282px;
 143 }
 144 .ui-colorpicker-hsb-s {
 145         background-image: url(../img/color/colorpicker_hsb_s.png);
 146         top: 82px;
 147         left: 282px;
 148 }
 149 .ui-colorpicker-hsb-b {
 150         background-image: url(../img/color/colorpicker_hsb_b.png);
 151         top: 112px;
 152         left: 282px;
 153 }
 154 .ui-colorpicker-submit {
 155         position: absolute;
 156         left: 296px;
 157         top: 144px;
 158         overflow: hidden;
 159 }
 160 .ui-colorpicker-focus {
 161         background-position: center;
 162 }
 163 .ui-colorpicker-hex.ui-colorpicker-focus {
 164         background-position: bottom;
 165 }
 166 .ui-colorpicker-submit.ui-colorpicker-focus {
 167         background-position: bottom;
 168 }
 169 .ui-colorpicker-slider {
 170         background-position: bottom;
 171 }