iphone-compat.css 5.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297
  1. /* mbl.widget.Heading */
  2. .mblHeading {
  3. background-image: url(compat/heading-bg.png);
  4. }
  5. /* Heading Arrow Button */
  6. .mblArrowButtonHead {
  7. position: absolute;
  8. top: 6px;
  9. left: 7px;
  10. width: 19px;
  11. height: 29px;
  12. border-style: none;
  13. background-image: url(compat/arrow-button-head.png);
  14. }
  15. .mblArrowButtonBody {
  16. padding: 0px 10px 0px 10px;
  17. background-image: url(compat/arrow-button-bg.png);
  18. }
  19. /* Round Corner */
  20. .mblRoundCorner {
  21. background-color: white;
  22. height: 1px;
  23. font-size: 1px;
  24. overflow: hidden;
  25. border-style: solid;
  26. border-color: #ADAAAD;
  27. border-width: 0px 1px;
  28. }
  29. .mblRoundRectContainer {
  30. margin: 0px;
  31. padding: 0px;
  32. background-color: white;
  33. border-style: solid;
  34. border-color: #ADAAAD;
  35. border-width: 0px 1px;
  36. }
  37. .mblRoundRect .mblRoundRectContainer {
  38. padding: 3px 8px;
  39. }
  40. .mblRoundCorner0T {
  41. height: 0px;
  42. }
  43. .mblRoundCorner1T {
  44. background-color: #ADAAAD;
  45. margin: 0px 5px;
  46. }
  47. .mblRoundCorner2T {
  48. margin: 0px 2px;
  49. border-width: 0px 3px;
  50. }
  51. .mblRoundCorner3T {
  52. margin: 0px 1px;
  53. border-width: 0px 2px;
  54. }
  55. .mblRoundCorner4T {
  56. margin: 0px 1px;
  57. }
  58. .mblRoundCorner5T {
  59. margin: 0px 1px;
  60. }
  61. .mblRoundCorner0B {
  62. height: 0px;
  63. }
  64. .mblRoundCorner1B {
  65. margin: 0px 1px;
  66. }
  67. .mblRoundCorner2B {
  68. margin: 0px 1px;
  69. }
  70. .mblRoundCorner3B {
  71. margin: 0px 1px;
  72. border-width: 0px 2px;
  73. }
  74. .mblRoundCorner4B {
  75. margin: 0px 2px;
  76. border-width: 0px 3px;
  77. }
  78. .mblRoundCorner5B {
  79. background-color: #ADAAAD;
  80. margin: 0px 5px;
  81. }
  82. /* dojox.mobile.EdgeToEdgeCategory */
  83. .mblEdgeToEdgeCategory {
  84. background-image: url(compat/edge-categ-bg.png);
  85. }
  86. /* mbl.widget.ListItem */
  87. *html li.mblListItem.mblVariableHeight { /* IE6 hack */
  88. height: 0;
  89. }
  90. .mblListItem .mblArrow {
  91. border-style: none;
  92. top: 16px;
  93. width: 9px;
  94. height: 13px;
  95. background-image: url(compat/gray-arrow.png);
  96. }
  97. .mblItemSelected .mblArrow {
  98. background-image: url(compat/white-arrow.png);
  99. }
  100. /* dojox.mobile.TabBarButton */
  101. .dj_ie6 .mblTabBarButtonDiv, .dj_ie7 .mblTabBarButtonDiv {
  102. left: auto;
  103. }
  104. /* Switch */
  105. .mblSwitchInner {
  106. width: 100px;
  107. }
  108. .mblSwitchBg {
  109. border: none;
  110. }
  111. .mblSwitchBgLeft {
  112. width: 89px;
  113. background: none;
  114. }
  115. .mblSwitchBgRight {
  116. width: 89px;
  117. left: 58px;
  118. background: none;
  119. }
  120. .mblSwitchKnobContainer {
  121. position: relative;
  122. left: 53px;
  123. width: 41px;
  124. height: 26px;
  125. }
  126. .mblSwitchKnob {
  127. position: relative;
  128. top: 0px;
  129. left: 0px;
  130. width: auto;
  131. height: 21px;
  132. background-image: url(compat/switch-knob-bg.png);
  133. border-width: 0px 1px;
  134. -moz-border-radius: 0px;
  135. }
  136. .mblSwitchCorner {
  137. position: relative;
  138. height: 1px;
  139. font-size: 1px;
  140. overflow: hidden;
  141. border-style: solid;
  142. border-color: #878787;
  143. }
  144. .mblSwitchCorner1T {
  145. background-color: #848684;
  146. margin: 0px 4px;
  147. border-width: 0px;
  148. }
  149. .mblSwitchCorner2T {
  150. background-color: #C0C0C0;
  151. margin: 0px 2px;
  152. border-width: 0px 2px;
  153. }
  154. .mblSwitchCorner3T {
  155. background-color: #C6C7C6;
  156. margin: 0px 1px;
  157. border-width: 0px 1px;
  158. }
  159. .mblSwitchCorner1B {
  160. background-color: #FBFBFB;
  161. margin: 0px 1px;
  162. border-width: 0px 1px;
  163. }
  164. .mblSwitchCorner2B {
  165. background-color: #FBFBFB;
  166. margin: 0px 2px;
  167. border-width: 0px 2px;
  168. }
  169. .mblSwitchCorner3B {
  170. background-color: #878787;
  171. margin: 0px 4px;
  172. border-width: 0px;
  173. }
  174. .mblSwitchBgLeft .mblSwitchCorner1T {
  175. border-width: 0px 2px;
  176. background-color: #093889;
  177. }
  178. .mblSwitchBgLeft .mblSwitchCorner2T {
  179. background-color: #285AB2;
  180. }
  181. .mblSwitchBgLeft .mblSwitchCorner3T {
  182. background-color: #285AB2;
  183. }
  184. .mblSwitchBgLeft .mblSwitchCorner1B {
  185. background-color: #66A1F6;
  186. }
  187. .mblSwitchBgLeft .mblSwitchCorner2B {
  188. background-color: #66A1F6;
  189. }
  190. .mblSwitchBgLeft .mblSwitchCorner3B {
  191. background-color: #5289D7;
  192. }
  193. .mblSwitchText {
  194. height: 21px;
  195. line-height: 21px;
  196. }
  197. .mblSwitchTextLeft {
  198. background-image: url(compat/switch-blue-bg.png);
  199. border-left: 1px solid #848684;
  200. }
  201. .mblSwitchTextRight {
  202. background-image: url(compat/switch-gray-bg.png);
  203. left: 35px;
  204. border-right: 1px solid #848684;
  205. }
  206. /* Icon Content Heading */
  207. .mblIconContentHeading {
  208. background-image: url(compat/icon-content-heading-bg.png);
  209. }
  210. /* dojox.mobile.Button */
  211. .mblBlueButton {
  212. background-image: url(compat/blue-button-bg.png);
  213. }
  214. .mblBlueButtonSelected {
  215. background-image: url(compat/blue-button-sel-bg.png);
  216. }
  217. /* Tab Container */
  218. .mblTabPanelHeader {
  219. background-image: url(compat/heading-bg.png);
  220. }
  221. .mblTabContainer .mblTabButton {
  222. background-image: url(compat/tab-button-bg.png);
  223. }
  224. .mblTabContainer .mblTabButtonSelected {
  225. background-image: url(compat/tab-sel-button-bg.png);
  226. }
  227. *html .mblTabButton { /* IE6 hack */
  228. behavior: expression(
  229. (function(el){
  230. if(!el.previousSibling)
  231. el.style.borderWidth = "1px";
  232. el.style.behavior = "none";
  233. })(this)
  234. );
  235. }
  236. /* Progress Indicator */
  237. .mblProg {
  238. position: absolute;
  239. top: 0px;
  240. width: 4px;
  241. font-size: 1px;
  242. height: 36px;
  243. overflow: hidden;
  244. background-color: #C0C0C0;
  245. }
  246. .mblProg0 {
  247. left: 0px;
  248. }
  249. .mblProg1 {
  250. left: 8px;
  251. }
  252. .mblProg2 {
  253. left: 16px;
  254. }
  255. .mblProg3 {
  256. left: 24px;
  257. }
  258. .mblProg4 {
  259. left: 32px;
  260. }
  261. .mblProg5 {
  262. left: 40px;
  263. }
  264. .mblProg6 {
  265. left: 48px;
  266. }
  267. .mblProg7 {
  268. left: 56px;
  269. }
  270. .mblProg8 {
  271. left: 64px;
  272. }
  273. .mblProg9 {
  274. left: 72px;
  275. }
  276. .mblProg10 {
  277. left: 80px;
  278. }
  279. .mblProg11 {
  280. left: 80px;
  281. }