You are here

system.css in Drupal 5

Same filename and directory in other branches
  1. 6 modules/system/system.css
/*
** HTML elements
*/
th.active img {
  display: inline;
}
tr.even, tr.odd {
  background-color: #eee;
  border-bottom: 1px solid #ccc;
  padding: 0.1em 0.6em;
}
td.active {
  background-color: #ddd;
}
tbody {
  border-top: 1px solid #ccc;
}
tbody th {
  border-bottom: 1px solid #ccc;
}
thead th {
  text-align: left;
  padding-right: 1em;
  border-bottom: 3px solid #ccc;
}

/*
** Other common styles
*/
.breadcrumb {
  padding-bottom: .5em
}
.error {
  color: #f00;
}
div.error {
  border: 1px solid #d77;
}
div.error, tr.error {
  background: #fcc;
  color: #200;
}
div.warning, tr.warning {
  background: #ffd;
}
div.ok, tr.ok {
  background: #dfd;
}
.item-list .icon {
  color: #555;
  float: right;
  padding-left: 0.25em;
  clear: right;
}
.item-list .title {
  font-weight: bold;
}
.item-list ul {
  margin: 0 0 0.75em 0;
  padding: 0;
}
.item-list ul li {
  margin: 0 0 0.25em 1.5em;
  padding: 0;
  list-style: disc;
}
.form-item {
  margin-top: 1em;
  margin-bottom: 1em;
}
tr.odd .form-item, tr.even .form-item {
  margin-top: 0;
  margin-bottom: 0;
  white-space: nowrap;
}
tr.merge-down, tr.merge-down td, tr.merge-down th {
  border-bottom-width: 0 !important;
}
tr.merge-up, tr.merge-up td, tr.merge-up th {
  border-top-width: 0 !important;
}
.form-item input.error, .form-item textarea.error, .form-item select.error {
  border: 2px solid red;
}
.form-item .description {
  font-size: 0.85em;
}
.form-item label {
  display: block;
  font-weight: bold;
}
.form-item label.option {
  display: inline;
  font-weight: normal;
}
.form-checkboxes, .form-radios {
  margin: 1em 0;
}
.form-checkboxes .form-item, .form-radios .form-item {
  margin-top: 0.4em;
  margin-bottom: 0.4em;
}
.marker, .form-required {
  color: #f00;
}
.more-link {
  text-align: right;
}
.more-help-link {
  font-size: 0.85em;
  text-align: right;
}
.nowrap {
  white-space: nowrap;
}
.pager {
  clear: both;
  text-align: center;
}
.pager a, .pager strong.pager-current {
  padding: 0.5em;
}
.tips {
  margin-top: 0;
  margin-bottom: 0;
  padding-top: 0;
  padding-bottom: 0;
  font-size: 0.9em;
}
dl.multiselect dd.b, dl.multiselect dd.b .form-item, dl.multiselect dd.b select {
  font-family: inherit;
  font-size: inherit;
  width: 14em;
}
dl.multiselect dd.a, dl.multiselect dd.a .form-item {
  width: 8em;
}
dl.multiselect dt, dl.multiselect dd {
  float: left;
  line-height: 1.75em;
  padding: 0;
  margin: 0 1em 0 0;
}
dl.multiselect .form-item {
  height: 1.75em;
  margin: 0;
}

/*
** Inline items (need to override above)
*/
.container-inline div, .container-inline label {
  display: inline;
}

/*
** Menus
*/
ul.menu {
  list-style: none;
  border: none;
  text-align:left;
}
ul.menu li {
  margin: 0 0 0 0.5em;
}
li.expanded {
  list-style-type: circle;
  list-style-image: url(../../misc/menu-expanded.png);
  padding: 0.2em 0.5em 0 0;
  margin: 0;
}
li.collapsed {
  list-style-type: disc;
  list-style-image: url(../../misc/menu-collapsed.png);
  padding: 0.2em 0.5em 0 0;
  margin: 0;
}
li.leaf {
  list-style-type: square;
  list-style-image: url(../../misc/menu-leaf.png);
  padding: 0.2em 0.5em 0 0;
  margin: 0;
}
li a.active {
  color: #000;
}
td.menu-disabled {
  background: #ccc;
}
ul.links {
  margin: 0;
  padding: 0;
}
ul.links.inline {
  display: inline;
}
ul.links li {
  display: inline;
  list-style-type: none;
  padding: 0 0.5em;
}
.block ul {
  margin: 0;
  padding: 0 0 0.25em 1em;
}

/*
** Tab navigation
*/
ul.primary {
  border-collapse: collapse;
  padding: 0 0 0 1em;
  white-space: nowrap;
  list-style: none;
  margin: 5px;
  height: auto;
  line-height: normal;
  border-bottom: 1px solid #bbb;
}
ul.primary li {
  display: inline;
}
ul.primary li a {
  background-color: #ddd;
  border-color: #bbb;
  border-width: 1px;
  border-style: solid solid none solid;
  height: auto;
  margin-right: 0.5em;
  padding: 0 1em;
  text-decoration: none;
}
ul.primary li.active a {
  background-color: #fff;
  border: 1px solid #bbb;
  border-bottom: #fff 1px solid;
}
ul.primary li a:hover {
  background-color: #eee;
  border-color: #ccc;
  border-bottom-color: #eee;
}
ul.secondary {
  border-bottom: 1px solid #bbb;
  padding: 0.5em 1em;
  margin: 5px;
}
ul.secondary li {
  display: inline;
  padding: 0 1em;
  border-right: 1px solid #ccc;
}
ul.secondary a {
  padding: 0;
  text-decoration: none;
}
ul.secondary a.active {
  border-bottom: 4px solid #999;
}

/*
** Autocomplete styles
*/
/* Suggestion list */
#autocomplete {
  position: absolute;
  border: 1px solid;
  overflow: hidden;
  z-index: 100;
}
#autocomplete ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
#autocomplete li {
  background: #fff;
  color: #000;
  white-space: pre;
  cursor: default;
}
#autocomplete li.selected {
  background: #0072b9;
  color: #fff;
}
/* Animated throbber */
html.js input.form-autocomplete {
  background-image: url(../../misc/throbber.gif);
  background-repeat: no-repeat;
  background-position: 100% 2px;
}
html.js input.throbbing {
  background-position: 100% -18px;
}

/*
** Collapsing fieldsets
*/
html.js fieldset.collapsed {
  border-bottom-width: 0;
  border-left-width: 0;
  border-right-width: 0;
  margin-bottom: 0;
  height: 1em;
}
html.js fieldset.collapsed * {
  display: none;
}
html.js fieldset.collapsed legend {
  display: block;
}
html.js fieldset.collapsible legend a {
  padding-left: 15px;
  background: url(../../misc/menu-expanded.png) 5px 75% no-repeat;
}
html.js fieldset.collapsed legend a {
  background-image: url(../../misc/menu-collapsed.png);
  background-position: 5px 50%;
}
/* Note: IE-only fix due to '* html' (breaks Konqueror otherwise). */
* html.js fieldset.collapsed legend,
* html.js fieldset.collapsed legend *,
* html.js fieldset.collapsed table * {
  display: inline;
}
html.js fieldset.collapsible legend a {
  display: block;
}
/* Avoid jumping around due to margins collapsing into collapsible fieldset border */
html.js fieldset.collapsible .fieldset-wrapper {
  overflow: auto;
}

/*
** Resizable text areas
*/
.resizable-textarea {
  width: 95%;
}
.resizable-textarea .grippie {
  height: 9px;
  overflow: hidden;
  background: #eee url(../../misc/grippie.png) no-repeat center 2px;
  border: 1px solid #ddd;
  border-top-width: 0;
  cursor: s-resize;
}
html.js .resizable-textarea textarea {
  margin-bottom: 0;
  width: 100%;
  display: block;
}

/*
** Progressbar styles
*/
.progress {
  font-weight: bold;
}
.progress .bar {
  background: #fff url(../../misc/progress.gif);
  border: 1px solid #00375a;
  height: 1.5em;
  margin-top: 0.2em;
}
.progress .filled {
  background: #0072b9;
  height: 1em;
  border-bottom: 0.5em solid #004a73;
  width: 0%;
}
.progress .percentage {
  float: right;
}

/*
** Formatting for welcome page
*/
#first-time strong {
  display: block;
  padding: 1.5em 0 .5em;
}

/*
** To be used with tableselect.js
*/
tr.selected td {
  background: #ffc;
}

File

modules/system/system.css
View source
  1. /*
  2. ** HTML elements
  3. */
  4. th.active img {
  5. display: inline;
  6. }
  7. tr.even, tr.odd {
  8. background-color: #eee;
  9. border-bottom: 1px solid #ccc;
  10. padding: 0.1em 0.6em;
  11. }
  12. td.active {
  13. background-color: #ddd;
  14. }
  15. tbody {
  16. border-top: 1px solid #ccc;
  17. }
  18. tbody th {
  19. border-bottom: 1px solid #ccc;
  20. }
  21. thead th {
  22. text-align: left;
  23. padding-right: 1em;
  24. border-bottom: 3px solid #ccc;
  25. }
  26. /*
  27. ** Other common styles
  28. */
  29. .breadcrumb {
  30. padding-bottom: .5em
  31. }
  32. .error {
  33. color: #f00;
  34. }
  35. div.error {
  36. border: 1px solid #d77;
  37. }
  38. div.error, tr.error {
  39. background: #fcc;
  40. color: #200;
  41. }
  42. div.warning, tr.warning {
  43. background: #ffd;
  44. }
  45. div.ok, tr.ok {
  46. background: #dfd;
  47. }
  48. .item-list .icon {
  49. color: #555;
  50. float: right;
  51. padding-left: 0.25em;
  52. clear: right;
  53. }
  54. .item-list .title {
  55. font-weight: bold;
  56. }
  57. .item-list ul {
  58. margin: 0 0 0.75em 0;
  59. padding: 0;
  60. }
  61. .item-list ul li {
  62. margin: 0 0 0.25em 1.5em;
  63. padding: 0;
  64. list-style: disc;
  65. }
  66. .form-item {
  67. margin-top: 1em;
  68. margin-bottom: 1em;
  69. }
  70. tr.odd .form-item, tr.even .form-item {
  71. margin-top: 0;
  72. margin-bottom: 0;
  73. white-space: nowrap;
  74. }
  75. tr.merge-down, tr.merge-down td, tr.merge-down th {
  76. border-bottom-width: 0 !important;
  77. }
  78. tr.merge-up, tr.merge-up td, tr.merge-up th {
  79. border-top-width: 0 !important;
  80. }
  81. .form-item input.error, .form-item textarea.error, .form-item select.error {
  82. border: 2px solid red;
  83. }
  84. .form-item .description {
  85. font-size: 0.85em;
  86. }
  87. .form-item label {
  88. display: block;
  89. font-weight: bold;
  90. }
  91. .form-item label.option {
  92. display: inline;
  93. font-weight: normal;
  94. }
  95. .form-checkboxes, .form-radios {
  96. margin: 1em 0;
  97. }
  98. .form-checkboxes .form-item, .form-radios .form-item {
  99. margin-top: 0.4em;
  100. margin-bottom: 0.4em;
  101. }
  102. .marker, .form-required {
  103. color: #f00;
  104. }
  105. .more-link {
  106. text-align: right;
  107. }
  108. .more-help-link {
  109. font-size: 0.85em;
  110. text-align: right;
  111. }
  112. .nowrap {
  113. white-space: nowrap;
  114. }
  115. .pager {
  116. clear: both;
  117. text-align: center;
  118. }
  119. .pager a, .pager strong.pager-current {
  120. padding: 0.5em;
  121. }
  122. .tips {
  123. margin-top: 0;
  124. margin-bottom: 0;
  125. padding-top: 0;
  126. padding-bottom: 0;
  127. font-size: 0.9em;
  128. }
  129. dl.multiselect dd.b, dl.multiselect dd.b .form-item, dl.multiselect dd.b select {
  130. font-family: inherit;
  131. font-size: inherit;
  132. width: 14em;
  133. }
  134. dl.multiselect dd.a, dl.multiselect dd.a .form-item {
  135. width: 8em;
  136. }
  137. dl.multiselect dt, dl.multiselect dd {
  138. float: left;
  139. line-height: 1.75em;
  140. padding: 0;
  141. margin: 0 1em 0 0;
  142. }
  143. dl.multiselect .form-item {
  144. height: 1.75em;
  145. margin: 0;
  146. }
  147. /*
  148. ** Inline items (need to override above)
  149. */
  150. .container-inline div, .container-inline label {
  151. display: inline;
  152. }
  153. /*
  154. ** Menus
  155. */
  156. ul.menu {
  157. list-style: none;
  158. border: none;
  159. text-align:left;
  160. }
  161. ul.menu li {
  162. margin: 0 0 0 0.5em;
  163. }
  164. li.expanded {
  165. list-style-type: circle;
  166. list-style-image: url(../../misc/menu-expanded.png);
  167. padding: 0.2em 0.5em 0 0;
  168. margin: 0;
  169. }
  170. li.collapsed {
  171. list-style-type: disc;
  172. list-style-image: url(../../misc/menu-collapsed.png);
  173. padding: 0.2em 0.5em 0 0;
  174. margin: 0;
  175. }
  176. li.leaf {
  177. list-style-type: square;
  178. list-style-image: url(../../misc/menu-leaf.png);
  179. padding: 0.2em 0.5em 0 0;
  180. margin: 0;
  181. }
  182. li a.active {
  183. color: #000;
  184. }
  185. td.menu-disabled {
  186. background: #ccc;
  187. }
  188. ul.links {
  189. margin: 0;
  190. padding: 0;
  191. }
  192. ul.links.inline {
  193. display: inline;
  194. }
  195. ul.links li {
  196. display: inline;
  197. list-style-type: none;
  198. padding: 0 0.5em;
  199. }
  200. .block ul {
  201. margin: 0;
  202. padding: 0 0 0.25em 1em;
  203. }
  204. /*
  205. ** Tab navigation
  206. */
  207. ul.primary {
  208. border-collapse: collapse;
  209. padding: 0 0 0 1em;
  210. white-space: nowrap;
  211. list-style: none;
  212. margin: 5px;
  213. height: auto;
  214. line-height: normal;
  215. border-bottom: 1px solid #bbb;
  216. }
  217. ul.primary li {
  218. display: inline;
  219. }
  220. ul.primary li a {
  221. background-color: #ddd;
  222. border-color: #bbb;
  223. border-width: 1px;
  224. border-style: solid solid none solid;
  225. height: auto;
  226. margin-right: 0.5em;
  227. padding: 0 1em;
  228. text-decoration: none;
  229. }
  230. ul.primary li.active a {
  231. background-color: #fff;
  232. border: 1px solid #bbb;
  233. border-bottom: #fff 1px solid;
  234. }
  235. ul.primary li a:hover {
  236. background-color: #eee;
  237. border-color: #ccc;
  238. border-bottom-color: #eee;
  239. }
  240. ul.secondary {
  241. border-bottom: 1px solid #bbb;
  242. padding: 0.5em 1em;
  243. margin: 5px;
  244. }
  245. ul.secondary li {
  246. display: inline;
  247. padding: 0 1em;
  248. border-right: 1px solid #ccc;
  249. }
  250. ul.secondary a {
  251. padding: 0;
  252. text-decoration: none;
  253. }
  254. ul.secondary a.active {
  255. border-bottom: 4px solid #999;
  256. }
  257. /*
  258. ** Autocomplete styles
  259. */
  260. /* Suggestion list */
  261. #autocomplete {
  262. position: absolute;
  263. border: 1px solid;
  264. overflow: hidden;
  265. z-index: 100;
  266. }
  267. #autocomplete ul {
  268. margin: 0;
  269. padding: 0;
  270. list-style: none;
  271. }
  272. #autocomplete li {
  273. background: #fff;
  274. color: #000;
  275. white-space: pre;
  276. cursor: default;
  277. }
  278. #autocomplete li.selected {
  279. background: #0072b9;
  280. color: #fff;
  281. }
  282. /* Animated throbber */
  283. html.js input.form-autocomplete {
  284. background-image: url(../../misc/throbber.gif);
  285. background-repeat: no-repeat;
  286. background-position: 100% 2px;
  287. }
  288. html.js input.throbbing {
  289. background-position: 100% -18px;
  290. }
  291. /*
  292. ** Collapsing fieldsets
  293. */
  294. html.js fieldset.collapsed {
  295. border-bottom-width: 0;
  296. border-left-width: 0;
  297. border-right-width: 0;
  298. margin-bottom: 0;
  299. height: 1em;
  300. }
  301. html.js fieldset.collapsed * {
  302. display: none;
  303. }
  304. html.js fieldset.collapsed legend {
  305. display: block;
  306. }
  307. html.js fieldset.collapsible legend a {
  308. padding-left: 15px;
  309. background: url(../../misc/menu-expanded.png) 5px 75% no-repeat;
  310. }
  311. html.js fieldset.collapsed legend a {
  312. background-image: url(../../misc/menu-collapsed.png);
  313. background-position: 5px 50%;
  314. }
  315. /* Note: IE-only fix due to '* html' (breaks Konqueror otherwise). */
  316. * html.js fieldset.collapsed legend,
  317. * html.js fieldset.collapsed legend *,
  318. * html.js fieldset.collapsed table * {
  319. display: inline;
  320. }
  321. html.js fieldset.collapsible legend a {
  322. display: block;
  323. }
  324. /* Avoid jumping around due to margins collapsing into collapsible fieldset border */
  325. html.js fieldset.collapsible .fieldset-wrapper {
  326. overflow: auto;
  327. }
  328. /*
  329. ** Resizable text areas
  330. */
  331. .resizable-textarea {
  332. width: 95%;
  333. }
  334. .resizable-textarea .grippie {
  335. height: 9px;
  336. overflow: hidden;
  337. background: #eee url(../../misc/grippie.png) no-repeat center 2px;
  338. border: 1px solid #ddd;
  339. border-top-width: 0;
  340. cursor: s-resize;
  341. }
  342. html.js .resizable-textarea textarea {
  343. margin-bottom: 0;
  344. width: 100%;
  345. display: block;
  346. }
  347. /*
  348. ** Progressbar styles
  349. */
  350. .progress {
  351. font-weight: bold;
  352. }
  353. .progress .bar {
  354. background: #fff url(../../misc/progress.gif);
  355. border: 1px solid #00375a;
  356. height: 1.5em;
  357. margin-top: 0.2em;
  358. }
  359. .progress .filled {
  360. background: #0072b9;
  361. height: 1em;
  362. border-bottom: 0.5em solid #004a73;
  363. width: 0%;
  364. }
  365. .progress .percentage {
  366. float: right;
  367. }
  368. /*
  369. ** Formatting for welcome page
  370. */
  371. #first-time strong {
  372. display: block;
  373. padding: 1.5em 0 .5em;
  374. }
  375. /*
  376. ** To be used with tableselect.js
  377. */
  378. tr.selected td {
  379. background: #ffc;
  380. }