styles.css 9.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618
  1. /* global styles */
  2. body {
  3. margin-right: auto;
  4. min-width: 960px;
  5. padding-bottom: 1em;
  6. color: #444;
  7. font: 0.8em sans-serif;
  8. background: url(../themes/pmahomme/img/left_nav_bg.png) repeat-y 80px 0 #f3f3f3;
  9. }
  10. input,
  11. button,
  12. select,
  13. textarea,
  14. th,
  15. td {
  16. font: 1em sans-serif;
  17. }
  18. img {
  19. border: 0;
  20. }
  21. a,
  22. a:link,
  23. a:visited,
  24. a:active {
  25. text-decoration: none;
  26. color: #235a81;
  27. cursor: pointer;
  28. outline: none;
  29. }
  30. a:hover {
  31. text-decoration: underline;
  32. color: #235a81;
  33. }
  34. h1 {
  35. font-size: 1.5em;
  36. }
  37. /* language selection box */
  38. #select_lang {
  39. position: absolute;
  40. right: 1em;
  41. top: 1em;
  42. }
  43. /* menu */
  44. #menu {
  45. float: left;
  46. width: 220px;
  47. font-size: 1.1em;
  48. }
  49. #menu ul {
  50. margin: 1em 1em 1em 0.5em;
  51. padding: 0;
  52. list-style: none;
  53. }
  54. #menu li a {
  55. padding: 0.5em 0.6em;
  56. margin-right: 0.6em;
  57. display: block;
  58. color: #333;
  59. text-decoration: none;
  60. zoom: 1; /* IE fix */
  61. }
  62. #menu li a:hover,
  63. #menu li a:active,
  64. #menu li a.active {
  65. background-color: #e4e4e4;
  66. }
  67. /* page contents and footer layout */
  68. #page {
  69. margin-left: 220px;
  70. margin-right: 25px;
  71. }
  72. #footer {
  73. margin-top: 1em;
  74. }
  75. #footer a {
  76. margin-right: 0.5em;
  77. text-decoration: none;
  78. font-size: small;
  79. }
  80. /* phpMyAdmin logo colors */
  81. .blue {
  82. color: #669;
  83. }
  84. .orange {
  85. color: #f90;
  86. }
  87. .red {
  88. color: #c00;
  89. }
  90. /* main page messages */
  91. /* message boxes: error, confirmation */
  92. .success h4,
  93. .notice h4,
  94. div.error h4 {
  95. border-bottom: 1px solid;
  96. font-weight: bold;
  97. margin: 0 0 0.2em 0;
  98. }
  99. div.success,
  100. div.notice,
  101. div.error {
  102. margin: 0.5em 0 1.3em 0;
  103. border: 1px solid;
  104. background: no-repeat 10px 10px;
  105. padding: 10px 10px 10px 25px;
  106. -moz-border-radius: 5px;
  107. -webkit-border-radius: 5px;
  108. border-radius: 5px;
  109. -moz-box-shadow: 0 1px 1px #fff inset;
  110. -webkit-box-shadow: 0 1px 1px #fff inset;
  111. box-shadow: 0 1px 1px #fff inset;
  112. }
  113. .success a,
  114. .notice a,
  115. .error a {
  116. text-decoration: underline;
  117. }
  118. .success {
  119. color: #000;
  120. background-color: #ebf8a4;
  121. }
  122. h1.success,
  123. div.success {
  124. border-color: #a2d246;
  125. background: url(../themes/pmahomme/img/s_success.png) no-repeat 5px 10px;
  126. }
  127. .success h4 {
  128. border-color: #0f0;
  129. }
  130. .notice {
  131. color: #000;
  132. background-color: #e8eef1;
  133. }
  134. h1.notice,
  135. div.notice {
  136. border-color: #3a6c7e;
  137. background: url(../themes/pmahomme/img/s_notice.png) no-repeat 5px 10px;
  138. }
  139. .notice h4 {
  140. border-color: #ffb10a;
  141. }
  142. .error {
  143. border: 1px solid maroon !important;
  144. color: #000;
  145. background: pink;
  146. }
  147. h1.error,
  148. div.error {
  149. border-color: #333;
  150. background: url(../themes/pmahomme/img/s_error.png) no-repeat 5px 10px;
  151. }
  152. div.error h4 {
  153. border-color: #f00;
  154. }
  155. div.notice[id^=version_check] {
  156. border-color: #002dff;
  157. background-color: #eef;
  158. }
  159. div.notice[id^=version_check] h4 {
  160. border-color: #002dff;
  161. }
  162. /* form tabs */
  163. ul.tabs {
  164. margin: 1.1em 2px 0;
  165. padding: 0 0 3px 0;
  166. list-style: none;
  167. font-weight: bold;
  168. }
  169. ul.tabs li {
  170. float: left;
  171. margin-bottom: -1px;
  172. }
  173. ul.tabs li a {
  174. display: block;
  175. margin: 1px 0.2em 0;
  176. white-space: nowrap;
  177. text-decoration: none;
  178. border: 1px solid #d5d5d5;
  179. border-bottom: 1px solid #aaa;
  180. }
  181. ul.tabs li a {
  182. padding: 7px 10px;
  183. -webkit-border-radius: 5px 5px 0 0;
  184. -moz-border-radius: 5px 5px 0 0;
  185. border-radius: 5px 5px 0 0;
  186. background: #f2f2f2;
  187. color: #555;
  188. text-shadow: 0 1px 0 #fff;
  189. }
  190. ul.tabs li a:hover,
  191. ul.tabs li a:active {
  192. background: #e5e5e5;
  193. }
  194. ul.tabs li.active a {
  195. background-color: #fff;
  196. margin-top: 1px;
  197. color: #000;
  198. text-shadow: none;
  199. border-color: #aaa;
  200. border-bottom: 1px solid #fff;
  201. }
  202. .tabs_contents {
  203. margin-top: 13px;
  204. }
  205. .tabs_contents fieldset {
  206. margin-top: 0;
  207. }
  208. .tabs_contents legend {
  209. display: none;
  210. }
  211. /* "restore default value" and "set value: foo" buttons */
  212. .restore-default img,
  213. .set-value img {
  214. margin-bottom: -3px;
  215. }
  216. .userprefs-comment {
  217. cursor: help;
  218. float: right;
  219. }
  220. /* forms */
  221. fieldset {
  222. margin-top: 1em;
  223. border-radius: 4px 4px 0 0;
  224. -moz-border-radius: 4px 4px 0 0;
  225. -webkit-border-radius: 4px 4px 0 0;
  226. border: #aaa solid 1px;
  227. padding: 1.5em;
  228. background: #eee;
  229. text-shadow: 0 1px 0 #fff;
  230. -moz-box-shadow: 1px 1px 2px #fff inset;
  231. -webkit-box-shadow: 1px 1px 2px #fff inset;
  232. box-shadow: 1px 1px 2px #fff inset;
  233. }
  234. fieldset.optbox {
  235. padding: 0;
  236. }
  237. .setup-page fieldset.optbox {
  238. width: 100%;
  239. }
  240. fieldset fieldset {
  241. margin: 0.8em;
  242. border: 1px solid #aaa;
  243. background: #e8e8e8;
  244. }
  245. fieldset legend {
  246. font-weight: bold;
  247. color: #444;
  248. padding: 5px 10px;
  249. border-radius: 2px;
  250. -moz-border-radius: 2px;
  251. -webkit-border-radius: 2px;
  252. border: 1px solid #aaa;
  253. background-color: #fff;
  254. -moz-box-shadow: 3px 3px 15px #bbb;
  255. -webkit-box-shadow: 3px 3px 15px #bbb;
  256. box-shadow: 3px 3px 15px #bbb;
  257. }
  258. .form {
  259. border: 2px #dee1ff solid;
  260. }
  261. fieldset p {
  262. margin: 0;
  263. padding: 0.5em;
  264. background: #fff;
  265. border-top: 0;
  266. }
  267. fieldset .errors { /* form error list */
  268. margin: 0 -2px 1em -2px;
  269. padding: 0.5em 1.5em;
  270. background: #fbead9;
  271. border: 1px #c83838 solid;
  272. border-width: 1px 0;
  273. list-style: none;
  274. font-family: sans-serif;
  275. font-size: small;
  276. }
  277. fieldset .inline_errors { /* field error list */
  278. margin: 0.3em 0.3em 0.3em 0;
  279. padding: 0;
  280. list-style: none;
  281. color: #9a0000;
  282. font-size: small;
  283. }
  284. table caption,
  285. table th,
  286. table td {
  287. text-shadow: 0 1px 0 #fff;
  288. }
  289. fieldset th {
  290. width: 40%;
  291. min-width: 350px;
  292. padding: 0.3em 0.3em 0.3em 0.5em;
  293. text-align: left;
  294. font-weight: bold;
  295. vertical-align: top;
  296. }
  297. fieldset.simple th {
  298. width: auto;
  299. min-width: 0;
  300. }
  301. fieldset .doc {
  302. margin-left: 1em;
  303. }
  304. fieldset td {
  305. padding-top: 0.3em;
  306. vertical-align: top;
  307. }
  308. fieldset td.userprefs-allow {
  309. padding: 0;
  310. vertical-align: middle;
  311. text-align: center;
  312. width: 3em;
  313. }
  314. fieldset td.userprefs-allow:hover {
  315. cursor: pointer;
  316. background-color: #eee;
  317. }
  318. fieldset th small {
  319. display: block;
  320. font-weight: normal;
  321. font-family: sans-serif;
  322. font-size: x-small;
  323. color: #666;
  324. }
  325. fieldset th,
  326. fieldset td,
  327. .form .lastrow {
  328. border-top: 1px solid #d5d5d5;
  329. }
  330. fieldset .group-header th {
  331. background: #eaedff;
  332. border: none;
  333. }
  334. fieldset .group-field-1 th,
  335. fieldset .group-header-2 th {
  336. padding-left: 1em;
  337. }
  338. fieldset .group-field-2 th,
  339. fieldset .group-header-3 th {
  340. padding-left: 2em;
  341. }
  342. fieldset .group-field-3 th {
  343. padding-left: 3em;
  344. }
  345. fieldset .lastrow,
  346. .form .lastrow {
  347. border-top: 1px #000 solid;
  348. background: #d3dce3;
  349. padding: 0.5em;
  350. text-align: center;
  351. }
  352. input[type=text],
  353. input[type=password],
  354. input[type=number] {
  355. border-radius: 2px;
  356. -moz-border-radius: 2px;
  357. -webkit-border-radius: 2px;
  358. box-shadow: 0 1px 2px #ddd;
  359. -moz-box-shadow: 0 1px 2px #ddd;
  360. -webkit-box-shadow: 0 1px 2px #ddd;
  361. background: white;
  362. border: 1px solid #aaa;
  363. color: #555;
  364. padding: 4px;
  365. margin: 6px;
  366. }
  367. input[type=submit],
  368. button[type=submit]:not(.mult_submit) {
  369. font-weight: bold !important;
  370. }
  371. input[type=submit],
  372. button[type=submit]:not(.mult_submit),
  373. input[type=reset],
  374. input[name=submit_reset],
  375. input.button {
  376. margin-left: 14px;
  377. border: 1px solid #aaa;
  378. padding: 3px 7px;
  379. color: #111;
  380. text-decoration: none;
  381. background: #ddd;
  382. border-radius: 12px;
  383. -webkit-border-radius: 12px;
  384. -moz-border-radius: 12px;
  385. text-shadow: 0 1px 0 #fff;
  386. background-image: url(../themes/svg_gradient.php?from=ffffff&to=cccccc);
  387. background-size: 100% 100%;
  388. background: -webkit-gradient(top, #fff, #ccc);
  389. background: -webkit-linear-gradient(top, #fff, #ccc);
  390. background: -moz-linear-gradient(top, #fff, #ccc);
  391. background: -ms-linear-gradient(top, #fff, #ccc);
  392. background: -o-linear-gradient(top, #fff, #ccc);
  393. }
  394. input[type=submit]:hover,
  395. button[type=submit]:not(.mult_submit):hover,
  396. input[type=reset]:hover,
  397. input[name=submit_reset]:hover,
  398. input.button:hover {
  399. position: relative;
  400. background-image: url(../themes/svg_gradient.php?from=cccccc&to=dddddd);
  401. background-size: 100% 100%;
  402. background: -webkit-gradient(top, #ccc, #ddd);
  403. background: -webkit-linear-gradient(top, #ccc, #ddd);
  404. background: -moz-linear-gradient(top, #ccc, #ddd);
  405. background: -ms-linear-gradient(top, #ccc, #ddd);
  406. background: -o-linear-gradient(top, #ccc, #ddd);
  407. cursor: pointer;
  408. }
  409. input[type=submit]:active,
  410. button[type=submit]:not(.mult_submit):active,
  411. input[type=reset]:active,
  412. input[name=submit_reset]:active,
  413. input.button:active {
  414. position: relative;
  415. top: 1px;
  416. left: 1px;
  417. }
  418. input[type="checkbox"],
  419. input[type="radio"] {
  420. vertical-align: -11%;
  421. }
  422. select {
  423. -moz-border-radius: 2px;
  424. -webkit-border-radius: 2px;
  425. border-radius: 2px;
  426. -moz-box-shadow: 0 1px 2px #ddd;
  427. -webkit-box-shadow: 0 1px 2px #ddd;
  428. box-shadow: 0 1px 2px #ddd;
  429. border: 1px solid #aaa;
  430. color: #333;
  431. padding: 3px;
  432. background: white;
  433. margin: 6px;
  434. }
  435. fieldset.simple th,
  436. fieldset.simple td {
  437. border-top: none;
  438. border-bottom: 1px #555 dotted;
  439. }
  440. fieldset.simple .lastrow {
  441. border: 0;
  442. }
  443. /* form elements */
  444. span.checkbox {
  445. padding: 2px;
  446. display: inline-block;
  447. }
  448. .custom { /* customized field */
  449. background: #ffc;
  450. }
  451. .checkbox.custom {
  452. padding: 1px;
  453. border: 1px #edec90 solid;
  454. }
  455. .field-error {
  456. border-color: #c11 !important;
  457. }
  458. .field-comment {
  459. position: relative;
  460. }
  461. .field-comment-mark {
  462. cursor: help;
  463. padding: 0 0.2em;
  464. font-weight: bold;
  465. font-style: italic;
  466. }
  467. .field-comment-warning {
  468. color: #a00;
  469. }
  470. .green { /* default form button */
  471. color: #080 !important;
  472. }
  473. table.datatable {
  474. margin: 0.5em 0 1em;
  475. }
  476. table.datatable th {
  477. padding: 0 1em 0 0.5em;
  478. border-bottom: 1px #999 solid;
  479. text-align: left;
  480. }
  481. table.datatable td {
  482. padding: 1px 0.5em;
  483. border-bottom: 1px #dee1ff solid;
  484. }
  485. /* textarea with config file's contents */
  486. #textconfig {
  487. width: 100%;
  488. border: 0;
  489. }
  490. /* error list */
  491. dd {
  492. margin-left: 0.5em;
  493. }
  494. dd::before {
  495. content: "\25B8 ";
  496. }
  497. /* links on failed validation page, when saving a form */
  498. a.btn {
  499. padding: 1px 5px;
  500. text-decoration: none;
  501. background: #e2e8ff;
  502. border: 1px #a6c8ff solid;
  503. border-top-color: #afd0ff;
  504. border-left-color: #afd0ff;
  505. font-weight: bold;
  506. }
  507. a.btn:hover,
  508. a.btn:active {
  509. background: #e6f5ff;
  510. color: #004c96;
  511. }
  512. .hide {
  513. display: none;
  514. }