1. 7.x modules/simpletest/tests/system.base.css
  2. 7.x modules/system/system.base.css

Generic theme-independent base styles.

File

modules/system/system.base.css
View source
  1. /**
  2. * @file
  3. * Generic theme-independent base styles.
  4. */
  5. /**
  6. * Autocomplete.
  7. *
  8. * @see autocomplete.js
  9. */
  10. /* Suggestion list */
  11. #autocomplete {
  12. border: 1px solid;
  13. overflow: hidden;
  14. position: absolute;
  15. z-index: 100;
  16. }
  17. #autocomplete ul {
  18. list-style: none;
  19. list-style-image: none;
  20. margin: 0;
  21. padding: 0;
  22. }
  23. #autocomplete li {
  24. background: #fff;
  25. color: #000;
  26. cursor: default;
  27. white-space: pre;
  28. zoom: 1; /* IE7 */
  29. }
  30. /* Animated throbber */
  31. html.js input.form-autocomplete {
  32. background-image: url(../../misc/throbber-inactive.png);
  33. background-position: 100% center; /* LTR */
  34. background-repeat: no-repeat;
  35. }
  36. html.js input.throbbing {
  37. background-image: url(../../misc/throbber-active.gif);
  38. background-position: 100% center; /* LTR */
  39. }
  40. /**
  41. * Collapsible fieldsets.
  42. *
  43. * @see collapse.js
  44. */
  45. html.js fieldset.collapsed {
  46. border-bottom-width: 0;
  47. border-left-width: 0;
  48. border-right-width: 0;
  49. height: 1em;
  50. }
  51. html.js fieldset.collapsed .fieldset-wrapper {
  52. display: none;
  53. }
  54. fieldset.collapsible {
  55. position: relative;
  56. }
  57. fieldset.collapsible .fieldset-legend {
  58. display: block;
  59. }
  60. /**
  61. * Resizable textareas.
  62. *
  63. * @see textarea.js
  64. */
  65. .form-textarea-wrapper textarea {
  66. display: block;
  67. margin: 0;
  68. width: 100%;
  69. -moz-box-sizing: border-box;
  70. -webkit-box-sizing: border-box;
  71. box-sizing: border-box;
  72. }
  73. .resizable-textarea .grippie {
  74. background: #eee url(../../misc/grippie.png) no-repeat center 2px;
  75. border: 1px solid #ddd;
  76. border-top-width: 0;
  77. cursor: s-resize;
  78. height: 9px;
  79. overflow: hidden;
  80. }
  81. /**
  82. * TableDrag behavior.
  83. *
  84. * @see tabledrag.js
  85. */
  86. body.drag {
  87. cursor: move;
  88. }
  89. .draggable a.tabledrag-handle {
  90. cursor: move;
  91. float: left; /* LTR */
  92. height: 1.7em;
  93. margin-left: -1em; /* LTR */
  94. overflow: hidden;
  95. text-decoration: none;
  96. }
  97. a.tabledrag-handle:hover {
  98. text-decoration: none;
  99. }
  100. a.tabledrag-handle .handle {
  101. background: url(../../misc/draggable.png) no-repeat 6px 9px;
  102. height: 13px;
  103. margin: -0.4em 0.5em; /* LTR */
  104. padding: 0.42em 0.5em; /* LTR */
  105. width: 13px;
  106. }
  107. a.tabledrag-handle-hover .handle {
  108. background-position: 6px -11px;
  109. }
  110. div.indentation {
  111. float: left; /* LTR */
  112. height: 1.7em;
  113. margin: -0.4em 0.2em -0.4em -0.4em; /* LTR */
  114. padding: 0.42em 0 0.42em 0.6em; /* LTR */
  115. width: 20px;
  116. }
  117. div.tree-child {
  118. background: url(../../misc/tree.png) no-repeat 11px center; /* LTR */
  119. }
  120. div.tree-child-last {
  121. background: url(../../misc/tree-bottom.png) no-repeat 11px center; /* LTR */
  122. }
  123. div.tree-child-horizontal {
  124. background: url(../../misc/tree.png) no-repeat -11px center;
  125. }
  126. .tabledrag-toggle-weight-wrapper {
  127. text-align: right; /* LTR */
  128. }
  129. /**
  130. * TableHeader behavior.
  131. *
  132. * @see tableheader.js
  133. */
  134. table.sticky-header {
  135. background-color: #fff;
  136. margin-top: 0;
  137. }
  138. /**
  139. * Progress behavior.
  140. *
  141. * @see progress.js
  142. */
  143. /* Bar */
  144. .progress .bar {
  145. background-color: #fff;
  146. border: 1px solid;
  147. }
  148. .progress .filled {
  149. background-color: #000;
  150. height: 1.5em;
  151. width: 5px;
  152. }
  153. .progress .percentage {
  154. float: right; /* LTR */
  155. }
  156. /* Throbber */
  157. .ajax-progress {
  158. display: inline-block;
  159. }
  160. .ajax-progress .throbber {
  161. background: transparent url(../../misc/throbber-active.gif) no-repeat 0px center;
  162. float: left; /* LTR */
  163. height: 15px;
  164. margin: 2px;
  165. width: 15px;
  166. }
  167. .ajax-progress .message {
  168. padding-left: 20px;
  169. }
  170. tr .ajax-progress .throbber {
  171. margin: 0 2px;
  172. }
  173. .ajax-progress-bar {
  174. width: 16em;
  175. }
  176. /**
  177. * Inline items.
  178. */
  179. .container-inline div,
  180. .container-inline label {
  181. display: inline;
  182. }
  183. /* Fieldset contents always need to be rendered as block. */
  184. .container-inline .fieldset-wrapper {
  185. display: block;
  186. }
  187. /**
  188. * Prevent text wrapping.
  189. */
  190. .nowrap {
  191. white-space: nowrap;
  192. }
  193. /**
  194. * For anything you want to hide on page load when JS is enabled, so
  195. * that you can use the JS to control visibility and avoid flicker.
  196. */
  197. html.js .js-hide {
  198. display: none;
  199. }
  200. /**
  201. * Hide elements from all users.
  202. *
  203. * Used for elements which should not be immediately displayed to any user. An
  204. * example would be a collapsible fieldset that will be expanded with a click
  205. * from a user. The effect of this class can be toggled with the jQuery show()
  206. * and hide() functions.
  207. */
  208. .element-hidden {
  209. display: none;
  210. }
  211. /**
  212. * Hide elements visually, but keep them available for screen-readers.
  213. *
  214. * Used for information required for screen-reader users to understand and use
  215. * the site where visual display is undesirable. Information provided in this
  216. * manner should be kept concise, to avoid unnecessary burden on the user.
  217. * "!important" is used to prevent unintentional overrides.
  218. */
  219. .element-invisible {
  220. position: absolute !important;
  221. clip: rect(1px 1px 1px 1px); /* IE6, IE7 */
  222. clip: rect(1px, 1px, 1px, 1px);
  223. overflow: hidden;
  224. height: 1px;
  225. }
  226. /**
  227. * The .element-focusable class extends the .element-invisible class to allow
  228. * the element to be focusable when navigated to via the keyboard.
  229. */
  230. .element-invisible.element-focusable:active,
  231. .element-invisible.element-focusable:focus {
  232. position: static !important;
  233. clip: auto;
  234. overflow: visible;
  235. height: auto;
  236. }
  237. /**
  238. * Markup free clearing.
  239. *
  240. * @see http://perishablepress.com/press/2009/12/06/new-clearfix-hack
  241. */
  242. .clearfix:after {
  243. content: ".";
  244. display: block;
  245. height: 0;
  246. clear: both;
  247. visibility: hidden;
  248. }
  249. /* IE6 */
  250. * html .clearfix {
  251. height: 1%;
  252. }
  253. /* IE7 */
  254. *:first-child + html .clearfix {
  255. min-height: 1%;
  256. }