backchannel.css 4.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259
  1. body {
  2. font-family: helvetica;
  3. margin: 0;
  4. }
  5. .hidden {
  6. display: none;
  7. }
  8. #container {
  9. }
  10. #sidebar {
  11. float: left;
  12. width: 30%;
  13. height: 100%;
  14. }
  15. #editor {
  16. float: left;
  17. width: 70%;
  18. height: 100%;
  19. }
  20. #title {
  21. padding: 5px;
  22. font-size: 120%;
  23. color: #fff;
  24. background: #000;
  25. }
  26. #title .buttons {
  27. float: right;
  28. }
  29. #title .buttons a {
  30. margin-left: 10px;
  31. }
  32. /*========================*/
  33. #notesContainer {
  34. min-height: 30em;
  35. float: left;
  36. width: 25%;
  37. }
  38. #notesHeader {
  39. padding: 0.8em;
  40. border: 2px solid #ddd;
  41. }
  42. #notesComponent {
  43. margin-top: 4em;
  44. padding: 0.8em;
  45. border: 2px solid #ddd;
  46. text-align: center;
  47. }
  48. /*========================*/
  49. #backchat {
  50. height: 100%;
  51. background: #eef;
  52. }
  53. #backchatHeader {
  54. font-weight: bold;
  55. padding: 0.5em 0.8em;
  56. background-color: #DDD;
  57. border-bottom: 2px solid #aaa;
  58. }
  59. #backchatHeader input { font-size: 0.7em; }
  60. #backchatHeaderInstructions {
  61. display: none;
  62. background-color: #EEE;
  63. padding: 1em;
  64. }
  65. #backchatHeaderInstructions p {
  66. text-indent: 1em;
  67. margin-top: 0.2em;
  68. }
  69. /*========================*/
  70. #userBox {
  71. position: relative; /* allow position absolute for charsLeftMsg and submit btn */
  72. padding: 1em 2em;
  73. border-bottom: 1px solid #aaa;
  74. background-color: #ddf;
  75. }
  76. #userHeader {
  77. margin: 0 0 0.5em 0;
  78. }
  79. #loginBox {
  80. padding: 0.5em 1em;
  81. border-bottom: 1px solid #aaa;
  82. background: #ddd;
  83. background-image: -webkit-gradient(linear, left top, left bottom, from(#ddf), to(#cce));
  84. background-image: -moz-linear-gradient(#ddf, #cce)
  85. }
  86. #userHeader .userName {
  87. font-weight: bold;
  88. font-size: 110%;
  89. width: 10em;
  90. }
  91. #userHeader .userAffil {
  92. font-style: italic;
  93. }
  94. #userButtons {
  95. float: right;
  96. }
  97. #enterPostTextarea {
  98. width: 98%;
  99. padding: 0.3em 0.4em;
  100. }
  101. #charsLeftMsg {
  102. position: absolute;
  103. left: 3em;
  104. bottom: 1.5em;
  105. color: red;
  106. }
  107. #submitPost {
  108. /*position: absolute;
  109. right: 1.5em;
  110. bottom: 1.5em;*/
  111. }
  112. #enterUser { display: none; }
  113. #enterAdmin { display: none; }
  114. #posts {
  115. background: #eef;
  116. min-height: 6em;
  117. padding: 1em 1.5em;
  118. }
  119. #postsHeader {
  120. padding-bottom: 0.5em;
  121. }
  122. .postsHeaderTitle {
  123. font-weight: bold;
  124. }
  125. .showpostsButton {
  126. /* this doesn't work in Firefox; may be impossible on OS X */
  127. font-size: 70%;
  128. }
  129. #postsHeaderInstructions {
  130. background-color: #ffc3c3;
  131. }
  132. #recentPosts {
  133. min-height: 6em;
  134. padding: 1em 1.5em;
  135. }
  136. #posts .postContainer {
  137. min-height: 5.3em;
  138. -moz-border-radius: 0.3em;
  139. -webkit-border-radius: 0.3em;
  140. -webkit-box-shadow: 0 0.2em 0.3em rgba(0, 0, 0, .3);
  141. -moz-box-shadow: 0 0.2em 0.3em rgba(0, 0, 0, .3);
  142. margin: 0.8em 0;
  143. padding: 0.5em 1em;
  144. background: #fff;
  145. }
  146. #posts .postVoteContainer {
  147. float: left;
  148. }
  149. .unvoted {
  150. background-color: #afa;
  151. }
  152. #posts .postVoteContainer .vote-tally-rect {
  153. width: 1.6em;
  154. height: 1em;
  155. border: 1px solid #444;
  156. -moz-border-radius: 6px;
  157. margin: 0.3em;
  158. padding: 0.2em;
  159. background-color: #fff;
  160. font-size: 120%;
  161. text-align: right;
  162. cursor: pointer; cursor: hand;
  163. }
  164. .postVoteContainer .vote-up {
  165. background: transparent url(/images/arrow_up.png) no-repeat scroll 10% 50%;
  166. }
  167. .postVoteContainer .voteFlag {
  168. cursor: pointer; cursor: hand;
  169. }
  170. #posts .postDisplayContainer {
  171. margin: 0.3em 0.3em 0.3em 4em;
  172. }
  173. #posts .postBody {
  174. min-height: 3.0em;
  175. overflow: auto;
  176. }
  177. #posts .postFooter {
  178. border-top: solid 1px #ccc;
  179. color: #888;
  180. padding: 0.2em 0em;
  181. font-style: italic;
  182. font-size: 90%;
  183. }
  184. #posts .commentFooter {
  185. border-top: solid 1px #ccc;
  186. color: #888;
  187. padding: 0.2em 0em;
  188. font-style: italic;
  189. font-size: 90%;
  190. }
  191. #posts .postFooter .postid {
  192. float: right;
  193. font-size: 70%;
  194. color: #ccc;
  195. }
  196. #posts .userName {
  197. }
  198. #posts .userAffil {
  199. }
  200. #posts .comments {
  201. cursor: pointer; cursor: hand;
  202. }
  203. #loginForm .label {
  204. width: 5em;
  205. text-align: right;
  206. display: table-cell;
  207. }
  208. #loginForm .data {
  209. display: table-cell;
  210. }
  211. #loginBox h1 {
  212. font-size: 105%;
  213. margin: 0 0 0.5em 0;
  214. padding: 0;
  215. }
  216. #commentText {
  217. width: 100%;
  218. }
  219. #posts .flagged {
  220. background: #ff0000;
  221. }
  222. /*.button {
  223. background: #fff;
  224. color: black;
  225. -moz-border-radius: 0.2em;
  226. -webkit-border-radius: 0.2em;
  227. -webkit-box-shadow: 0 0.2em 0.3em rgba(0, 0, 0, .2);
  228. -moz-box-shadow: 0 0.2em 0.3em rgba(0, 0, 0, .2);
  229. background-image: -webkit-gradient(linear, left top, left bottom, from(#edc), to(#dcb));
  230. background-image: -moz-linear-gradient(#edc, #dcb)
  231. padding: 0.1em 1em;
  232. font-size: 80%;
  233. display: table-cell;
  234. margin: 0.5em 1em;
  235. cursor: pointer; cursor: hand;
  236. } */