PageRenderTime 42ms CodeModel.GetById 13ms RepoModel.GetById 0ms app.codeStats 0ms

/media/css/forums.css

https://github.com/sgarrity/kitsune
CSS | 461 lines | 366 code | 82 blank | 13 comment | 0 complexity | 5f1fae41af75a4534afab038630ba71b MD5 | raw file
  1. /* Discussion forums CSS */
  2. ol.threads-columns,
  3. ol.threads,
  4. ol.forums-columns,
  5. ol.forums,
  6. ol.posts-columns,
  7. ol.posts {
  8. clear: left;
  9. list-style-type: none;
  10. }
  11. ol.forums-columns li,
  12. ol.threads-columns li,
  13. ol.posts-columns li {
  14. background-color: #f0f0f0;
  15. border-bottom: 2px solid #e4e4e4;
  16. color: #afaba3;
  17. float: left;
  18. font-family: Verdana, "Verdana Ref", sans-serif;
  19. font-size: 10px;
  20. font-weight: bold;
  21. padding: 1.1em 1% 1% 1%;
  22. }
  23. ol.threads-columns li,
  24. ol.forums-columns li {
  25. margin-right: 0.5%;
  26. }
  27. ol.posts-columns li {
  28. font-size: 10px;
  29. font-weight: bold;
  30. }
  31. ol.threads-columns a {
  32. color: #afaba3;
  33. }
  34. /* Sorting by this column */
  35. ol.threads-columns li.sort {
  36. background: #f5f4f3 url(../img/forums/up.gif) no-repeat 98% center;
  37. }
  38. ol.threads-columns.desc li.sort {
  39. background: #f5f4f3 url(../img/forums/down.gif) no-repeat 98% center;
  40. }
  41. /* End sorting */
  42. /* Column widths */
  43. ol.forums-columns li.name,
  44. ol.forums div.name {
  45. width: 64.5%;
  46. }
  47. ol.forums-columns li.threads,
  48. ol.forums-columns li.posts,
  49. ol.forums div.threads {
  50. width: 8%;
  51. }
  52. ol.threads-columns li.type {
  53. width: 8%;
  54. }
  55. ol.threads-columns li.replies,
  56. ol.threads li div.replies {
  57. width: 10%;
  58. }
  59. ol.threads-columns li.title,
  60. ol.threads li div.title {
  61. width: 32%;
  62. }
  63. ol.threads-columns li.author,
  64. ol.threads li div.author {
  65. width: 18%;
  66. }
  67. ol.forums div.last-post,
  68. ol.threads div.last-post {
  69. line-height: 1.4em;
  70. }
  71. ol.forums-columns li.last-post,
  72. ol.forums div.last-post,
  73. ol.threads-columns li.last-post,
  74. ol.threads li div.last-post {
  75. margin-right: 0;
  76. width: 20%;
  77. }
  78. ol.threads li div.type {
  79. height: auto;
  80. min-height: 1em;
  81. text-align: center;
  82. width: 8%;
  83. }
  84. /* End column widths */
  85. ol.forums li,
  86. ol.threads li {
  87. clear: left;
  88. }
  89. ol.forums li div,
  90. ol.threads li div {
  91. float: left;
  92. margin: 1% 0.5% 1% 0;
  93. padding: 0 1%;
  94. }
  95. ol.forums li,
  96. ol.threads li,
  97. ol.posts li {
  98. font-size: 1.1em;
  99. line-height: 1.4em;
  100. }
  101. ol.forums li hr,
  102. ol.threads li hr {
  103. background: none;
  104. border: 0;
  105. clear: left;
  106. font-size: 0;
  107. height: 0;
  108. margin: 0;
  109. padding: 0;
  110. visibility: hidden;
  111. width: 0;
  112. }
  113. ol.forums li:nth-child(even),
  114. ol.threads li:nth-child(even),
  115. ol.posts li:nth-child(even) {
  116. background: #f0f0f0;
  117. }
  118. ol.forums div.threads {
  119. text-align: right;
  120. }
  121. ol.threads div.replies {
  122. text-align: center;
  123. }
  124. ol.threads a.username,
  125. ol.posts li div.author a {
  126. color: green;
  127. font-weight: bold;
  128. }
  129. ol.posts li div.author a {
  130. display: block;
  131. }
  132. ol.posts li div.author a:hover {
  133. text-decoration: underline;
  134. }
  135. ol.posts li div.author span.posts {
  136. font-style: italic;
  137. }
  138. ol.posts li div.content {
  139. float: left;
  140. padding: 0 1% 1em 1%;
  141. width: 72.9%;
  142. }
  143. ol.posts li div.content p {
  144. line-height: 1.6em;
  145. }
  146. ol.posts li div.info {
  147. clear: left;
  148. border-top: 1px solid #e4e4e4;
  149. padding: 1em 1em 1em 1%;
  150. }
  151. ol.posts li div.info a {
  152. display: none;
  153. }
  154. ol.posts li:hover div.info a {
  155. display: inline;
  156. }
  157. ol.posts li div.info span.post-action {
  158. float: right;
  159. }
  160. div#thread-reply {
  161. background-color: #edf7fA;
  162. }
  163. div#thread-reply h3,
  164. div#post-preview h3 {
  165. padding: .5em 0 0 .5em;
  166. font-weight: normal;
  167. font-size: 180%;
  168. }
  169. p#thread-locked {
  170. padding: .5em 0 1.2em 1em;
  171. }
  172. a#new-thread {
  173. background: url(../img/forums/arrow.png) no-repeat scroll left center transparent;
  174. float: left;
  175. font-size: 115%;
  176. margin: 0 0 1em 10px;
  177. padding-left: 10px;
  178. }
  179. div.forum-actions {
  180. clear: left;
  181. padding: 0.5em 0 0;
  182. }
  183. div.thread-actions {
  184. clear: left;
  185. padding-top: 1em;
  186. margin: 1em 0;
  187. }
  188. div.thread-actions form {
  189. display: inline;
  190. }
  191. div.thread-actions form.move {
  192. float: right;
  193. }
  194. ol.posts li div.post-actions {
  195. margin: 1em 0;
  196. }
  197. ol.posts li div.post-actions a,
  198. ol.posts li div.post-actions form {
  199. display: inline;
  200. }
  201. ol.posts-columns li.author {
  202. width: 20%;
  203. margin-right: 1%;
  204. }
  205. ol.posts-columns li.message {
  206. width: 75%;
  207. }
  208. ol.posts li {
  209. border-color: #e4e4e4;
  210. border-style: solid;
  211. border-width: 0 0 1px;
  212. padding-top: 1em;
  213. }
  214. ol.posts li div.author {
  215. float: left;
  216. width: 21%;
  217. padding: 0 1% 1em 1%;
  218. }
  219. /* Reply Preview */
  220. #post-preview {
  221. margin: 10px 0 0;
  222. }
  223. div#post-preview h3 {
  224. padding-left: 0;
  225. }
  226. #post-preview ol {
  227. margin: 10px 0 0;
  228. }
  229. #post-preview li {
  230. background: #f0f0f0;
  231. }
  232. /* Wiki markup for posts */
  233. ol.posts li div.content h1,
  234. #content-inner ol.posts li div.content h2,
  235. ol.posts li div.content h3,
  236. ol.posts li div.content h4,
  237. ol.posts li div.content h5,
  238. ol.posts li div.content h6 {
  239. margin: 0.5em 0;
  240. padding: 0;
  241. }
  242. ol.posts li div.content h1 {
  243. font-size: 210%;
  244. }
  245. ol.posts li div.content h2 {
  246. font-size: 180%;
  247. }
  248. ol.posts li div.content h3 {
  249. font-size: 145%;
  250. }
  251. ol.posts li div.content h4 {
  252. font-size: 115%;
  253. }
  254. ol.posts li div.content h5 {
  255. font-size: 95%;
  256. }
  257. ol.posts li div.content h6 {
  258. font-size: 85%;
  259. }
  260. ol.posts li div.content p {
  261. margin-bottom: 1em;
  262. }
  263. ol.posts li div.content ol,
  264. ol.posts li div.content ul {
  265. margin-left: 1.5em;
  266. }
  267. ol.posts li div.content li {
  268. border: none;
  269. margin: 1em 0;
  270. padding: 0;
  271. }
  272. ol.posts li div.content li:nth-child(even) {
  273. background: none;
  274. }
  275. ol.posts li div.content dd {
  276. margin-left: 3em;
  277. }
  278. ol.posts li div.content blockquote {
  279. background-color: #e6eaec;
  280. -moz-border-radius: 1em;
  281. -webkit-border-radius: 1em;
  282. border-radius: 1em;
  283. margin: 1.5em;
  284. padding: 1em;
  285. }
  286. ol.posts li div.content pre {
  287. background-color: #e6eaec;
  288. margin: 1em 0;
  289. padding: 0.5em;
  290. white-space: pre-wrap;
  291. }
  292. ol.posts li div.content a:hover {
  293. text-decoration: underline;
  294. }
  295. /* End of wiki markup */
  296. /* Pagination tweaks */
  297. ol.pagination {
  298. clear: left;
  299. margin: 1.5em auto 0;
  300. }
  301. form.new-thread div.form-widget,
  302. form.edit-post div.form-widget,
  303. form.edit-thread div.form-widget {
  304. border-top: 1px dotted #c0c0c0;
  305. clear: left;
  306. padding: 1em;
  307. }
  308. form.new-thread div.form-widget label,
  309. form.edit-post div.form-widget label,
  310. form.edit-thread div.form-widget label {
  311. display: block;
  312. width: 10em;
  313. float: left;
  314. }
  315. form div.form-widget.submit {
  316. padding-left: 11em;
  317. }
  318. /* Delete Thread/Post Confirmation */
  319. div.thread-to-delete label,
  320. div.post-to-delete label {
  321. display:block;
  322. font-weight:bold;
  323. margin: 0.5em 0 0 0;
  324. }
  325. div.thread-to-delete input,
  326. div.post-to-delete input,
  327. div.form-widget input[type="submit"] {
  328. margin: 0 0 0 1em;
  329. }
  330. div.thread-to-delete form,
  331. div.post-to-delete form {
  332. margin: 2em 0 0 0;
  333. }
  334. div.thread-to-delete p,
  335. div.post-to-delete p {
  336. margin: 0 0 1em;
  337. }
  338. div.post-to-delete div.content ul,
  339. div.post-to-delete div.content ol {
  340. margin: 0 0 0 1.5em;
  341. }
  342. /* Thread title badges */
  343. div.badges {
  344. margin:-1em 0 0;
  345. }
  346. div.badges span {
  347. border-radius: 4px;
  348. -moz-border-radius: 4px;
  349. -webkit-border-radius: 4px;
  350. float:left;
  351. font-size: 16px;
  352. margin: 0 10px 0 0;
  353. padding: 2px 10px 2px 32px;
  354. }
  355. span.sticky {
  356. background: #eaf4f8 url(../img/forums/type/sticky.png) no-repeat 8px center;
  357. color: #139ec4;
  358. }
  359. span.locked {
  360. background: #fff0cb url(../img/forums/type/locked.png) no-repeat 8px center;
  361. color: #a4813b;
  362. }
  363. span.watching {
  364. background: #d7f8e0 url(../img/forums/watch.png) no-repeat 8px center;
  365. color: #10c493;
  366. }
  367. /* Forums markup editor */
  368. form.new-thread div.forum-editor,
  369. form.edit-post div.forum-editor {
  370. float: left;
  371. padding-left: 0;
  372. width: 500px;
  373. }
  374. /* End markup editor */
  375. span.post-modified {
  376. font-size: 0.8em;
  377. display: block;
  378. margin: 0.5em 0 0 0;
  379. }