style-ui.css 9.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531
  1. /* -*- Mode: CSS; tab-width: 2; indent-tabs-mode: nil; -*- */
  2. /* vim:set ft=css ts=2 sw=2 sts=2 autoindent: */
  3. /* Styling for the user-interface */
  4. html {
  5. overflow-y: scroll;
  6. }
  7. body .ui-widget {
  8. font-size: 0.9em; /* override jQuery UI */
  9. }
  10. #navbuttons * {
  11. vertical-align: middle;
  12. padding: 2px 5px;
  13. float: left;
  14. }
  15. #header {
  16. position: fixed;
  17. top: 0;
  18. left: 0;
  19. right: 0;
  20. -moz-box-shadow: 5px 5px 5px #999999;
  21. -webkit-box-shadow: 5px 5px 5px #999999;
  22. box-shadow: 5px 5px 5px #999999;
  23. }
  24. #mainHeader {
  25. font-size: 120%;
  26. overflow: hidden;
  27. white-space: nowrap;
  28. }
  29. #pulldown {
  30. display: none;
  31. font-size: 80%;
  32. }
  33. #pulldown_padder {
  34. padding: 10px;
  35. }
  36. #pulldown div + div {
  37. margin-top: 10px;
  38. }
  39. #auth_button {
  40. float: right;
  41. }
  42. #options_button {
  43. float: right;
  44. }
  45. #pulluptrigger {
  46. height: 35px;
  47. width: 35px;
  48. position: fixed;
  49. bottom: 0;
  50. left: 0;
  51. background: url('img/Fugue-shadowless-information-balloon.png') center no-repeat;
  52. }
  53. #messagepullup {
  54. max-height: 300px;
  55. overflow-y: scroll; /* or 'auto' */
  56. background-color: #ffffff;
  57. background-color: rgba(255,255,255,0.75);
  58. z-index: 1;
  59. }
  60. #messages {
  61. z-index: 4;
  62. }
  63. #pulluptrigger {
  64. z-index: 3;
  65. }
  66. .messages {
  67. position: fixed;
  68. bottom: 0;
  69. left: 0;
  70. right: 0;
  71. }
  72. .messages > div {
  73. padding: 5px;
  74. margin: 2px 5px;
  75. border: 1px outset #000000;
  76. }
  77. .messages > div.error {
  78. background-color: #FF9696;
  79. font-weight: bold;
  80. color: #000000;
  81. }
  82. .messages > div.warning {
  83. background-color: #FFE2A3;
  84. font-weight: bold;
  85. color: #000000;
  86. }
  87. .messages > div.comment {
  88. background-color: #87b6d9;
  89. color: #ffffff;
  90. font-weight: bold;
  91. border: 1px outset #27628F;
  92. }
  93. .messages > div.debug {
  94. background-color: #ffff99;
  95. color: #000000;
  96. }
  97. .messages > div > input {
  98. float: right;
  99. display: block;
  100. }
  101. #span_notes_container, #arc_notes_container, #norm_container {
  102. position: relative;
  103. }
  104. #arc_notes:disabled {
  105. background-color:#FCFDFD;
  106. }
  107. #arc_notes_fieldset:disabled {
  108. border: 1px solid #BBBBBB;
  109. }
  110. #arc_notes_fieldset:disabled legend {
  111. background-color: #BBBBBB;
  112. }
  113. #clear_span_notes_button, #clear_arc_notes_button, #clear_norm_button {
  114. padding: 2px 5px;
  115. position: absolute;
  116. top: -2px;
  117. right: -2px;
  118. }
  119. .span_norm_txt_input {
  120. background-color: #eaf4fd;
  121. }
  122. input[data-value="valid"] {
  123. background-color: #ccffcc;
  124. }
  125. input[data-value="invalid"] {
  126. background-color: #ffcccc;
  127. }
  128. input[data-value="multi"] {
  129. background-color: #ccccff;
  130. }
  131. #norm_search_result_select {
  132. height: 200px;
  133. display: inline-block;
  134. border: 2px inset;
  135. background-color: #ffffff;
  136. border-collapse: collapse;
  137. width: 100%;
  138. margin-top: 10px;
  139. overflow: scroll;
  140. }
  141. #norm_search_result_select thead tr * {
  142. padding: 2px 5px;
  143. }
  144. #norm_search_result_select tbody tr * {
  145. padding: 0 5px;
  146. }
  147. #norm_search_result_select tr {
  148. cursor: pointer;
  149. }
  150. #norm_search_result_select tr * {
  151. white-space: nowrap;
  152. }
  153. #norm_search_result_select tr.selected {
  154. background-color: #cccccc;
  155. }
  156. #norm_search_container {
  157. position: relative;
  158. }
  159. #norm_search_button {
  160. position: absolute;
  161. top: -6px;
  162. right: -2px;
  163. }
  164. #span_form .collapser, #arc_form .collapser {
  165. float: left;
  166. height: 16px;
  167. width: 16px;
  168. margin-top: 3px;
  169. cursor: hand;
  170. background: url('img/expand_icon.gif') no-repeat;
  171. }
  172. #span_form .collapser.open, #arc_form .collapser.open {
  173. background: url('img/collapse_icon.gif') no-repeat;
  174. }
  175. #span_form .collapsible.open, #arc_form .collapsible.open {
  176. display: block;
  177. }
  178. #span_form .collapsible, #arc_form .collapsible {
  179. display: none;
  180. margin-left: 20px;
  181. }
  182. #span_form .item_content, #arc_form .item_content {
  183. margin-left: 16px;
  184. white-space: nowrap;
  185. }
  186. .type_scroller { /* TODO remove */
  187. overflow-y: scroll;
  188. min-height: 50px;
  189. max-height: 300px;
  190. }
  191. /* BEGIN new entity and event dialog style */
  192. .split_wrapper {
  193. height: 300px;
  194. /* HACK tweaking to avoid overflows. */
  195. padding-bottom: 2.5em;
  196. /* end HACK */
  197. }
  198. .split_wrapper div.wrapper_full_width {
  199. width: 100%;
  200. height: 100%;
  201. display: inline-block;
  202. vertical-align: top;
  203. float: left;
  204. }
  205. .split_wrapper div.wrapper_half_left {
  206. /* a bit less than 50% to avoid scrollbar overflows */
  207. width: 49%;
  208. height: 100%;
  209. display: inline-block;
  210. vertical-align: top;
  211. float: left;
  212. }
  213. .split_wrapper div.wrapper_half_right {
  214. /* a bit less than 50% to avoid scrollbar overflows */
  215. width: 49%;
  216. height: 100%;
  217. display: inline-block;
  218. vertical-align: top;
  219. float: right;
  220. }
  221. .split_wrapper div.scroll_wrapper_upper {
  222. width: 100%;
  223. height: 85%;
  224. display: inline-block;
  225. vertical-align: top;
  226. }
  227. .split_wrapper div.scroll_wrapper_lower {
  228. width: 100%;
  229. height: 15%;
  230. display: inline-block;
  231. vertical-align: bottom;
  232. }
  233. .wrapper_lower_label {
  234. margin-top: 0.5em;
  235. }
  236. div.scroll_wrapper_lower div {
  237. padding-top: 0.5em;
  238. }
  239. .split_wrapper div.scroll_wrapper_full {
  240. width: 100%;
  241. height: 100%;
  242. display: inline-block;
  243. vertical-align: top;
  244. }
  245. .split_wrapper fieldset {
  246. height: 100%;
  247. overflow-x: hidden;
  248. overflow-y: hidden;
  249. }
  250. .split_wrapper div.scroller {
  251. overflow: auto;
  252. width: 100%;
  253. height: 100%;
  254. border-style: inset inset none none;
  255. border-width: 1px;
  256. }
  257. div.scroll_wrapper_upper div.scroller {
  258. border-style: inset inset inset none;
  259. }
  260. /* special-case visual tweak; not sure why this is necessary */
  261. #span_search_fieldset {
  262. margin-bottom: 0.5em;
  263. }
  264. /* END new entity and event dialog style */
  265. .small-buttons .ui-button-text, .small-buttons input[type="button"] {
  266. padding: 2px 5px;
  267. }
  268. #document_ctime, #document_mtime {
  269. vertical-align: bottom;
  270. padding: 0 5px;
  271. float: left;
  272. }
  273. #help_link {
  274. padding-right: 0.5em;
  275. color: darkgray;
  276. vertical-align: center;
  277. float: right;
  278. }
  279. .document_edit_time {
  280. font-family: monospace;
  281. color: #777;
  282. }
  283. #menu_explanation {
  284. margin-left: 10px;
  285. display: inline-block;
  286. overflow: hidden;
  287. }
  288. #document_name {
  289. margin-right: 100px;
  290. }
  291. #document_name input {
  292. width: 20%;
  293. border: none;
  294. }
  295. /*
  296. #logo {
  297. float:right;
  298. margin-left: 20px;
  299. background-color: #ffffff;
  300. padding: 0 0 0 2px;
  301. }
  302. */
  303. .logo {
  304. font-family: 'Astloch', serif;
  305. font-style: normal;
  306. text-decoration: none;
  307. text-transform: none;
  308. letter-spacing: 0em;
  309. word-spacing: 0em;
  310. line-height: 1.2;
  311. font-weight: bold;
  312. }
  313. #mainlogo {
  314. font-size: 1.2em;
  315. float: right;
  316. cursor: pointer;
  317. text-shadow: #000000 0 0 3px;
  318. padding: 0 10px 0 20px;
  319. }
  320. #aboutlogo {
  321. font-size: 42px;
  322. text-align: center;
  323. text-shadow: #888888 0 0 10px;
  324. display: block;
  325. width: 100%;
  326. margin-bottom: 10px;
  327. }
  328. #copyright {
  329. margin-top: 10px;
  330. font-size: 60%;
  331. }
  332. #logo:hover {
  333. opacity: 0.8;
  334. }
  335. #search_button {
  336. margin-right: 0;
  337. }
  338. #search_button_label {
  339. margin-right: 0;
  340. }
  341. #clear_search_button {
  342. margin-left: 0;
  343. padding-left: 0.4em;
  344. padding-right: 0.4em;
  345. -moz-border-radius: 0px 5px 5px 0px;
  346. -webkit-border-radius: 0px 5px 5px 0px;
  347. border-radius: 0px 5px 5px 0px;
  348. }
  349. #spinner {
  350. display: none;
  351. position: fixed;
  352. right:10px;
  353. top: 55px;
  354. }
  355. #span_form_lock_bset button {
  356. margin: 0;
  357. }
  358. #document_select {
  359. height: 200px;
  360. display: inline-block;
  361. border: 2px inset;
  362. background-color: #ffffff;
  363. border-collapse: collapse;
  364. width: 100%;
  365. margin-top: 10px;
  366. overflow: scroll;
  367. }
  368. #document_select thead tr * {
  369. padding: 2px 5px;
  370. }
  371. #document_select tbody tr * {
  372. padding: 0 5px;
  373. }
  374. #document_select tr {
  375. cursor: pointer;
  376. }
  377. #document_select tr * {
  378. white-space: nowrap;
  379. }
  380. #document_select tr.selected {
  381. background-color: #cccccc;
  382. }
  383. #document_select img {
  384. width: 16px;
  385. height: 16px;
  386. }
  387. #collection_browser th {
  388. font-weight: normal;
  389. text-align: left;
  390. }
  391. #readme {
  392. width: 100%;
  393. height: 20px;
  394. overflow: auto;
  395. }
  396. #import_text {
  397. font-family: inherit;
  398. }
  399. #export_page div {
  400. margin: 5px 5px 5px 5px;
  401. font-size: 14px;
  402. }
  403. #export_page table {
  404. border-collapse: collapse;
  405. border: 1px solid #cccccc;
  406. }
  407. #export_page td, #export_page th {
  408. padding: 2px 5px;
  409. text-align: left;
  410. }
  411. #export_page tr.background0 {
  412. background-color: #eeeeee;
  413. }
  414. #export_page tr.background1 {
  415. background-color: #dddddd;
  416. }
  417. .optionRow {
  418. margin-top: 0.5em;
  419. margin-bottom: 0.5em;
  420. }
  421. .optionLabel {
  422. display: inline-block;
  423. width: 8em;
  424. }
  425. #advanced_search_option_toggle {
  426. float: right;
  427. font-size: 80%;
  428. color: gray;
  429. }
  430. #browserwarning {
  431. background-color: #ffcccc;
  432. padding: 10px;
  433. display: none;
  434. }
  435. .ui-icon-gripsmall-diagonal-se {
  436. margin: 0 -3px -3px 0;
  437. }
  438. .ui-dialog {
  439. position: fixed;
  440. }
  441. .file {
  442. color: #333366;
  443. }
  444. .collection {
  445. color: #336633;
  446. }
  447. .rightalign {
  448. text-align: right;
  449. }
  450. .centeralign {
  451. text-align: center;
  452. }
  453. .dialog .borderless {
  454. outline: 0;
  455. border: 0;
  456. width: 100%;
  457. }
  458. .fullwidth {
  459. width: 100%;
  460. }
  461. .autocomplete-id {
  462. font-size: 80%;
  463. float: right;
  464. }
  465. .ui-autocomplete {
  466. max-height: 100px;
  467. overflow-y: auto;
  468. overflow-x: hidden;
  469. padding-right: 20px;
  470. }
  471. #waiter {
  472. text-align: center;
  473. }
  474. #waiter img {
  475. margin-top: 25px;
  476. }
  477. /* Lifted from http://jqueryui.com/autocomplete/#combobox */
  478. .ui-combobox {
  479. position: relative;
  480. display: inline-block;
  481. }
  482. .ui-combobox-input {
  483. margin: 0;
  484. padding: 2px;
  485. }
  486. .ui-combobox, .ui-combobox input, .ui-autocomplete {
  487. font-size: 11px !important;
  488. font-family: 'PT Sans Caption', sans-serif !important;
  489. }
  490. @font-face {
  491. font-family: 'Astloch';
  492. font-style: normal;
  493. font-weight: bold;
  494. src: local('Astloch Bold'), local('Astloch-Bold'), url('fonts/Astloch-Bold.ttf') format('truetype');
  495. }