You are here

Home » API reference » Twitter Profile Widget 6

colorpicker.css in Twitter Profile Widget 6

Same filename and directory in other branches
  1. 7 colorpicker/colorpicker.css
.colorpicker {
	width: 356px;
	height: 176px;
	overflow: hidden;
	position: absolute;
	background: url(images/colorpicker_background.png);
	font-family: Arial, Helvetica, sans-serif;
	display: none;
}
.colorpicker_color {
	width: 150px;
	height: 150px;
	left: 14px;
	top: 13px;
	position: absolute;
	background: #f00;
	overflow: hidden;
	cursor: crosshair;
}
.colorpicker_color div {
	position: absolute;
	top: 0;
	left: 0;
	width: 150px;
	height: 150px;
	background: url(images/colorpicker_overlay.png);
}
.colorpicker_color div div {
	position: absolute;
	top: 0;
	left: 0;
	width: 11px;
	height: 11px;
	overflow: hidden;
	background: url(images/colorpicker_select.gif);
	margin: -5px 0 0 -5px;
}
.colorpicker_hue {
	position: absolute;
	top: 13px;
	left: 171px;
	width: 35px;
	height: 150px;
	cursor: n-resize;
}
.colorpicker_hue div {
	position: absolute;
	width: 35px;
	height: 9px;
	overflow: hidden;
	background: url(images/colorpicker_indic.gif) left top;
	margin: -4px 0 0 0;
	left: 0px;
}
.colorpicker_new_color {
	position: absolute;
	width: 60px;
	height: 30px;
	left: 213px;
	top: 13px;
	background: #f00;
}
.colorpicker_current_color {
	position: absolute;
	width: 60px;
	height: 30px;
	left: 283px;
	top: 13px;
	background: #f00;
}
.colorpicker input {
	background-color: transparent;
	border: 1px solid transparent;
	position: absolute;
	font-size: 10px;
	font-family: Arial, Helvetica, sans-serif;
	color: #898989;
	top: 4px;
	right: 11px;
	text-align: right;
	margin: 0;
	padding: 0;
	height: 11px;
}
.colorpicker_hex {
	position: absolute;
	width: 72px;
	height: 22px;
	background: url(images/colorpicker_hex.png) top;
	left: 212px;
	top: 142px;
}
.colorpicker_hex input {
	right: 6px;
}
.colorpicker_field {
	height: 22px;
	width: 62px;
	background-position: top;
	position: absolute;
}
.colorpicker_field span {
	position: absolute;
	width: 12px;
	height: 22px;
	overflow: hidden;
	top: 0;
	right: 0;
	cursor: n-resize;
}
.colorpicker_rgb_r {
	background-image: url(images/colorpicker_rgb_r.png);
	top: 52px;
	left: 212px;
}
.colorpicker_rgb_g {
	background-image: url(images/colorpicker_rgb_g.png);
	top: 82px;
	left: 212px;
}
.colorpicker_rgb_b {
	background-image: url(images/colorpicker_rgb_b.png);
	top: 112px;
	left: 212px;
}
.colorpicker_hsb_h {
	background-image: url(images/colorpicker_hsb_h.png);
	top: 52px;
	left: 282px;
}
.colorpicker_hsb_s {
	background-image: url(images/colorpicker_hsb_s.png);
	top: 82px;
	left: 282px;
}
.colorpicker_hsb_b {
	background-image: url(images/colorpicker_hsb_b.png);
	top: 112px;
	left: 282px;
}
.colorpicker_submit {
	position: absolute;
	width: 22px;
	height: 22px;
	background: url(images/colorpicker_submit.png) top;
	left: 322px;
	top: 142px;
	overflow: hidden;
}
.colorpicker_focus {
	background-position: center;
}
.colorpicker_hex.colorpicker_focus {
	background-position: bottom;
}
.colorpicker_submit.colorpicker_focus {
	background-position: bottom;
}
.colorpicker_slider {
	background-position: bottom;
}

File

colorpicker/colorpicker.css
View source 
  1. .colorpicker {

  2. 	width: 356px;

  3. 	height: 176px;

  4. 	overflow: hidden;

  5. 	position: absolute;

  6. 	background: url(images/colorpicker_background.png);

  7. 	font-family: Arial, Helvetica, sans-serif;

  8. 	display: none;

  9. }

  10. .colorpicker_color {

  11. 	width: 150px;

  12. 	height: 150px;

  13. 	left: 14px;

  14. 	top: 13px;

  15. 	position: absolute;

  16. 	background: #f00;

  17. 	overflow: hidden;

  18. 	cursor: crosshair;

  19. }

  20. .colorpicker_color div {

  21. 	position: absolute;

  22. 	top: 0;

  23. 	left: 0;

  24. 	width: 150px;

  25. 	height: 150px;

  26. 	background: url(images/colorpicker_overlay.png);

  27. }

  28. .colorpicker_color div div {

  29. 	position: absolute;

  30. 	top: 0;

  31. 	left: 0;

  32. 	width: 11px;

  33. 	height: 11px;

  34. 	overflow: hidden;

  35. 	background: url(images/colorpicker_select.gif);

  36. 	margin: -5px 0 0 -5px;

  37. }

  38. .colorpicker_hue {

  39. 	position: absolute;

  40. 	top: 13px;

  41. 	left: 171px;

  42. 	width: 35px;

  43. 	height: 150px;

  44. 	cursor: n-resize;

  45. }

  46. .colorpicker_hue div {

  47. 	position: absolute;

  48. 	width: 35px;

  49. 	height: 9px;

  50. 	overflow: hidden;

  51. 	background: url(images/colorpicker_indic.gif) left top;

  52. 	margin: -4px 0 0 0;

  53. 	left: 0px;

  54. }

  55. .colorpicker_new_color {

  56. 	position: absolute;

  57. 	width: 60px;

  58. 	height: 30px;

  59. 	left: 213px;

  60. 	top: 13px;

  61. 	background: #f00;

  62. }

  63. .colorpicker_current_color {

  64. 	position: absolute;

  65. 	width: 60px;

  66. 	height: 30px;

  67. 	left: 283px;

  68. 	top: 13px;

  69. 	background: #f00;

  70. }

  71. .colorpicker input {

  72. 	background-color: transparent;

  73. 	border: 1px solid transparent;

  74. 	position: absolute;

  75. 	font-size: 10px;

  76. 	font-family: Arial, Helvetica, sans-serif;

  77. 	color: #898989;

  78. 	top: 4px;

  79. 	right: 11px;

  80. 	text-align: right;

  81. 	margin: 0;

  82. 	padding: 0;

  83. 	height: 11px;

  84. }

  85. .colorpicker_hex {

  86. 	position: absolute;

  87. 	width: 72px;

  88. 	height: 22px;

  89. 	background: url(images/colorpicker_hex.png) top;

  90. 	left: 212px;

  91. 	top: 142px;

  92. }

  93. .colorpicker_hex input {

  94. 	right: 6px;

  95. }

  96. .colorpicker_field {

  97. 	height: 22px;

  98. 	width: 62px;

  99. 	background-position: top;

  100. 	position: absolute;

  101. }

  102. .colorpicker_field span {

  103. 	position: absolute;

  104. 	width: 12px;

  105. 	height: 22px;

  106. 	overflow: hidden;

  107. 	top: 0;

  108. 	right: 0;

  109. 	cursor: n-resize;

  110. }

  111. .colorpicker_rgb_r {

  112. 	background-image: url(images/colorpicker_rgb_r.png);

  113. 	top: 52px;

  114. 	left: 212px;

  115. }

  116. .colorpicker_rgb_g {

  117. 	background-image: url(images/colorpicker_rgb_g.png);

  118. 	top: 82px;

  119. 	left: 212px;

  120. }

  121. .colorpicker_rgb_b {

  122. 	background-image: url(images/colorpicker_rgb_b.png);

  123. 	top: 112px;

  124. 	left: 212px;

  125. }

  126. .colorpicker_hsb_h {

  127. 	background-image: url(images/colorpicker_hsb_h.png);

  128. 	top: 52px;

  129. 	left: 282px;

  130. }

  131. .colorpicker_hsb_s {

  132. 	background-image: url(images/colorpicker_hsb_s.png);

  133. 	top: 82px;

  134. 	left: 282px;

  135. }

  136. .colorpicker_hsb_b {

  137. 	background-image: url(images/colorpicker_hsb_b.png);

  138. 	top: 112px;

  139. 	left: 282px;

  140. }

  141. .colorpicker_submit {

  142. 	position: absolute;

  143. 	width: 22px;

  144. 	height: 22px;

  145. 	background: url(images/colorpicker_submit.png) top;

  146. 	left: 322px;

  147. 	top: 142px;

  148. 	overflow: hidden;

  149. }

  150. .colorpicker_focus {

  151. 	background-position: center;

  152. }

  153. .colorpicker_hex.colorpicker_focus {

  154. 	background-position: bottom;

  155. }

  156. .colorpicker_submit.colorpicker_focus {

  157. 	background-position: bottom;

  158. }

  159. .colorpicker_slider {

  160. 	background-position: bottom;

  161. }