jqtransform.css 8.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320
  1. form.jqtransformdone label{
  2. margin:-6px 15px -6px 4px;
  3. display: inline-block;
  4. }
  5. form.jqtransformdone div.rowElem{
  6. clear:both;
  7. padding:4px 0px;
  8. }
  9. /* -------------
  10. * Buttons
  11. * ------------- */
  12. button.jqTransformButton {
  13. margin: 0px;
  14. padding: 0px;
  15. border: none;
  16. background-color: transparent;
  17. cursor: pointer;
  18. overflow: visible;
  19. font-family: Arial;
  20. }
  21. *:first-child+html button.jqTransformButton[type]{width: 1;} /* IE7 */
  22. button.jqTransformButton span {
  23. background: transparent url(img/btn_right.gif) no-repeat right top;
  24. display: block;
  25. float: left;
  26. padding: 0 12px 0 0; /* sliding doors padding */
  27. margin: 0px;
  28. height: 33px;
  29. }
  30. button.jqTransformButton span span {
  31. background: transparent url(img/btn_left.gif) no-repeat top left;
  32. color: #333;
  33. padding:0 0 0 12px;
  34. font-weight: normal;
  35. font-size: 12px;
  36. line-height:32px;
  37. display: block;
  38. text-decoration: none;
  39. height: 33px;
  40. white-space:nowrap;
  41. }
  42. /*hover*/
  43. button.jqTransformButton_hover span span { background-position: left -33px ; }
  44. button.jqTransformButton_hover span { background-position: right -33px ; }
  45. /*clicked*/
  46. button.jqTransformButton_click span span { background-position: left -66px ; }
  47. button.jqTransformButton_click span { background-position: right -66px ; }
  48. /* IE 6 */
  49. * html button.jqTransformButton { height:33px; }
  50. /* IE 7 */
  51. *+ html button.jqTransformButton { height:33px; }
  52. /* -------------
  53. * Inputs
  54. * ------------- */
  55. .jqTransformInputWrapper {
  56. background: transparent url(img/input/input_text_left.gif) no-repeat left top;
  57. height: 31px;
  58. padding: 0px;
  59. }
  60. .jqTransformInputInner {
  61. background: transparent url(img/input/input_text_right.gif) no-repeat top right;
  62. padding: 0px;
  63. margin: 0px;
  64. }
  65. .jqTransformInputInner div {
  66. height: 31px;
  67. margin:0px 4px;
  68. overflow:hidden;
  69. }
  70. .jqTransformInputInner div input {
  71. font-family:Arial, Helvetica, sans-serif;
  72. font-size:12px;
  73. line-height: 18px;
  74. vertical-align: middle;
  75. height: 18px;
  76. color:#404040;
  77. border: none!important;
  78. padding:6px 0 7px!important;
  79. margin: 0px!important;
  80. background:transparent!important;
  81. }
  82. /* IE6 */
  83. * html .jqTransformInputInner div input {
  84. padding: 6px 0 0 0;
  85. margin: 0 0 0 -8px;
  86. height:24px;
  87. }
  88. /* Ie7 */
  89. *+ html .jqTransformInputInner div input {
  90. padding: 6px 0 0 0;
  91. margin-left:-10px;
  92. height:24px;
  93. }
  94. /*hover*/
  95. .jqTransformInputWrapper_hover{ background-position: left -31px ;}
  96. .jqTransformInputWrapper_hover div.jqTransformInputInner{ background-position: right -31px ;}
  97. /*focus*/
  98. .jqTransformInputWrapper_focus{ background-position: left -62px ;}
  99. .jqTransformInputWrapper_focus div.jqTransformInputInner{ background-position: right -62px ;}
  100. .jqTransformSafari .jqTransformInputInner div {
  101. position: relative;
  102. overflow: hidden;
  103. margin:0px 8px;
  104. }
  105. .jqTransformSafari .jqTransformInputInner div input {
  106. background-color: none;
  107. position: absolute;
  108. top: -10px;
  109. left: -2px;
  110. height: 42px;
  111. padding-left: 4px;
  112. }
  113. /* -------------
  114. * Textarea
  115. * ------------- */
  116. table.jqTransformTextarea td#jqTransformTextarea-mm textarea{
  117. font-size: 12px;
  118. line-height: 16px;
  119. }
  120. table.jqTransformTextarea td{
  121. font-size: 1px;
  122. line-height: 1px;
  123. width: 5px;
  124. height: 5px;
  125. margin: 0;
  126. padding: 0;
  127. }
  128. table.jqTransformTextarea{}
  129. table.jqTransformTextarea tr{
  130. /*border: 1px solid red;*/
  131. }
  132. table.jqTransformTextarea textarea{
  133. margin: 0;
  134. padding: 0;
  135. border: 0;
  136. background: none;
  137. overflow:auto;
  138. resize:none;
  139. }
  140. table.jqTransformTextarea td#jqTransformTextarea-tl{background: url(img/textarea/textarea_tl.gif) no-repeat top left;}
  141. table.jqTransformTextarea td#jqTransformTextarea-tm{background: url(img/textarea/textarea_tm.gif) repeat-x top left;}
  142. table.jqTransformTextarea td#jqTransformTextarea-tr{background: url(img/textarea/textarea_tr.gif) no-repeat top left;}
  143. table.jqTransformTextarea td#jqTransformTextarea-ml{background: url(img/textarea/textarea_ml.gif) repeat-y top left;}
  144. table.jqTransformTextarea td#jqTransformTextarea-mm{background: url(img/textarea/textarea-mm.gif) repeat;}
  145. table.jqTransformTextarea td#jqTransformTextarea-mr{background: url(img/textarea/textarea_mr.gif) repeat-y top left;}
  146. table.jqTransformTextarea td#jqTransformTextarea-bl{background: url(img/textarea/textarea_bl.gif) no-repeat top left;}
  147. table.jqTransformTextarea td#jqTransformTextarea-bm{background: url(img/textarea/textarea_bm.gif) repeat-x top left;}
  148. table.jqTransformTextarea td#jqTransformTextarea-br{background: url(img/textarea/textarea_br.gif) no-repeat top left;}
  149. /*hover*/
  150. table.jqTransformTextarea-hover td#jqTransformTextarea-tl{background-position:0px -5px;}
  151. table.jqTransformTextarea-hover td#jqTransformTextarea-tm{background-position:0px -5px;}
  152. table.jqTransformTextarea-hover td#jqTransformTextarea-tr{background-position:0px -5px;}
  153. table.jqTransformTextarea-hover td#jqTransformTextarea-ml{background-position:-5px 0px;}
  154. table.jqTransformTextarea-hover td#jqTransformTextarea-mm{background-image: url(img/textarea/textarea-mm-hover.gif);}
  155. table.jqTransformTextarea-hover td#jqTransformTextarea-mr{background-position:-5px 0px;}
  156. table.jqTransformTextarea-hover td#jqTransformTextarea-bl{background-position:0px -5px;}
  157. table.jqTransformTextarea-hover td#jqTransformTextarea-bm{background-position:0px -5px;}
  158. table.jqTransformTextarea-hover td#jqTransformTextarea-br{background-position:0px -5px;}
  159. /*focus*/
  160. table.jqTransformTextarea-focus td#jqTransformTextarea-tl{background-position:0px -10px;}
  161. table.jqTransformTextarea-focus td#jqTransformTextarea-tm{background-position:0px -10px;}
  162. table.jqTransformTextarea-focus td#jqTransformTextarea-tr{background-position:0px -10px;}
  163. table.jqTransformTextarea-focus td#jqTransformTextarea-ml{background-position:-10px 0px;}
  164. table.jqTransformTextarea-focus td#jqTransformTextarea-mm{background-image: url(img/textarea/textarea-mm-focus.gif);}
  165. table.jqTransformTextarea-focus td#jqTransformTextarea-mr{background-position: -10px 0px;}
  166. table.jqTransformTextarea-focus td#jqTransformTextarea-bl{background-position:0px -10px;}
  167. table.jqTransformTextarea-focus td#jqTransformTextarea-bm{background-position:0px -10px;}
  168. table.jqTransformTextarea-focus td#jqTransformTextarea-br{background-position:0px -10px;}
  169. table.jqTransformTextarea .jqTransformSafariTextarea div {
  170. position: relative;
  171. overflow: hidden;
  172. border: 0px solid red;
  173. }
  174. table.jqTransformTextarea .jqTransformSafariTextarea textarea{
  175. background: none;
  176. position: absolute;
  177. top:-10px;
  178. left:-10px;
  179. padding: 10px 10px 10px 10px;
  180. resize: none;
  181. }
  182. /* -------------
  183. * Radios
  184. * ------------- */
  185. .jqTransformRadioWrapper {display:inline-block;margin:-6px 0;}
  186. .jqTransformRadio {
  187. background: transparent url(img/radio.gif) no-repeat center top;
  188. vertical-align: middle;
  189. height: 19px;
  190. width: 18px;
  191. display:block;/*display: -moz-inline-block;*/
  192. }
  193. /* -------------
  194. * Checkboxes
  195. * ------------- */
  196. span.jqTransformCheckboxWrapper{
  197. display:inline-block;
  198. margin:-6px 0;
  199. }
  200. a.jqTransformCheckbox {
  201. background: transparent url(img/checkbox.gif) no-repeat center top;
  202. vertical-align: middle;
  203. height: 19px;
  204. width: 18px;
  205. display:block;/*display: -moz-inline-block;*/
  206. }
  207. /* -------------
  208. * Checked - Used for both Radio and Checkbox
  209. * ------------- */
  210. a.jqTransformChecked { background-position: center bottom;}
  211. /* -------------
  212. * Selects
  213. * ------------- */
  214. .jqTransformSelectWrapper {
  215. width: 45px;
  216. position:relative;
  217. height: 31px;
  218. background: url(img/select_left.gif) no-repeat top left;
  219. }
  220. .jqTransformSelectWrapper div span {
  221. font-size: 12px;
  222. float: none;
  223. position: absolute;
  224. white-space: nowrap;
  225. height: 31px;
  226. line-height: 15px;
  227. padding: 8px 0 0 7px;
  228. overflow: hidden;
  229. cursor:pointer;
  230. /*border: 1px solid #CCCCCC;*/
  231. /* border-right: none;*/
  232. }
  233. .jqTransformSelectWrapper a.jqTransformSelectOpen {
  234. display: block;
  235. position: absolute;
  236. right: 0px;
  237. width: 31px;
  238. height: 31px;
  239. background: url(img/select_right.gif) no-repeat center center;
  240. }
  241. .jqTransformSelectWrapper ul {
  242. position: absolute;
  243. width: 43px;
  244. top: 30px;
  245. left: 0px;
  246. list-style: none;
  247. background-color: #FFF;
  248. border: solid 1px #CCC;
  249. display: none;
  250. margin: 0px;
  251. padding: 0px;
  252. height: 150px;
  253. overflow: auto;
  254. overflow-y: auto;
  255. z-index:10;
  256. }
  257. .jqTransformSelectWrapper ul a {
  258. display: block;
  259. padding: 5px;
  260. text-decoration: none;
  261. color:#333;
  262. background-color: #FFF;
  263. font-size: 12px;
  264. }
  265. .jqTransformSelectWrapper ul a.selected {
  266. background: #EDEDED;
  267. color: #333;
  268. }
  269. .jqTransformSelectWrapper ul a:hover, .jqTransformSelectWrapper ul a.selected:hover {
  270. background:#3582c4;
  271. color: #fff;
  272. text-decoration:none;
  273. }
  274. /* -------------
  275. * Hidden - used to hide the original form elements
  276. * ------------- */
  277. .jqTransformHidden {display: none;}