/forum/site_media/js/wym/wymeditor/skins/silver/skin.css

http://djforum.googlecode.com/ · CSS · 297 lines · 222 code · 34 blank · 41 comment · 0 complexity · 9ae2e218165af6ad11849b2e52b0c503 MD5 · raw file

  1. /*
  2. * WYMeditor : what you see is What You Mean web-based editor
  3. * Copyright (c) 2008 Jean-Francois Hovinne, http://www.wymeditor.org/
  4. * Dual licensed under the MIT (MIT-license.txt)
  5. * and GPL (GPL-license.txt) licenses.
  6. *
  7. * For further information visit:
  8. * http://www.wymeditor.org/
  9. *
  10. * File Name:
  11. * screen.css
  12. * main stylesheet for the default WYMeditor skin
  13. * See the documentation for more info.
  14. *
  15. * File Authors:
  16. * Daniel Reszka (d.reszka a-t wymeditor dotorg)
  17. * Scott Edwin Lewis
  18. */
  19. /*TRYING TO RESET STYLES THAT MAY INTERFERE WITH WYMEDITOR*/
  20. .wym_skin_silver p, .wym_skin_silver h2, .wym_skin_silver h3,
  21. .wym_skin_silver ul, .wym_skin_silver li { background: transparent url(); margin: 0; padding: 0; border-width:0; list-style: none; }
  22. /*HIDDEN BY DEFAULT*/
  23. .wym_skin_silver .wym_area_left { display: none; }
  24. .wym_skin_silver .wym_area_right { display: block; }
  25. /*TYPO*/
  26. .wym_skin_silver { font-size: 62.5%; font-family: Verdana, Arial, sans-serif; }
  27. .wym_skin_silver h2 { font-size: 110%; /* = 11px */}
  28. .wym_skin_silver h3 { font-size: 100%; /* = 10px */}
  29. .wym_skin_silver li { font-size: 100%; /* = 10px */}
  30. /*WYM_BOX*/
  31. .wym_skin_silver { border: 1px solid gray; background: #f2f2f2; padding: 0px; margin: 0px;}
  32. /*auto-clear the wym_box*/
  33. .wym_skin_silver:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
  34. * html .wym_skin_silver { height: 1%;}
  35. /*WYM_HTML*/
  36. .wym_skin_silver .wym_html { width: 98%;}
  37. .wym_skin_silver .wym_html textarea { width: 100%; height: 200px; border: 1px solid gray; background: white; }
  38. /*WYM_IFRAME*/
  39. .wym_skin_silver .wym_iframe { width: 98%;}
  40. .wym_skin_silver .wym_iframe iframe { width: 100%; height: 200px; border: 1px solid gray; background: white }
  41. /*AREAS*/
  42. .wym_skin_silver .wym_area_left { width: 150px; float: left;}
  43. .wym_skin_silver .wym_area_right { width: 150px; float: right;}
  44. .wym_skin_silver .wym_area_bottom { height: 1%; clear: both;}
  45. * html .wym_skin_silver .wym_area_main { height: 1%;}
  46. * html .wym_skin_silver .wym_area_top { height: 1%;}
  47. *+html .wym_skin_silver .wym_area_top { height: 1%;}
  48. /*SECTIONS SYSTEM*/
  49. /*common defaults for all sections*/
  50. .wym_skin_silver .wym_section { margin-bottom: 5px; }
  51. .wym_skin_silver .wym_section h2,
  52. .wym_skin_silver .wym_section h3 { padding: 1px 3px; margin: 0; cursor: pointer; }
  53. .wym_skin_silver .wym_section a { padding: 5px 0px 0px 10px; display: block; text-decoration: none; color: black; }
  54. .wym_skin_silver .wym_section a:hover { /*background-color: #DDD;*/}
  55. /*hide section titles by default*/
  56. .wym_skin_silver .wym_section h2 { display: none; }
  57. /*disable any margin-collapse*/
  58. .wym_skin_silver .wym_section { padding-top: 1px; padding-bottom: 1px; }
  59. /*auto-clear sections*/
  60. .wym_skin_silver .wym_section ul:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; padding: 0px; }
  61. * html .wym_skin_silver .wym_section ul { height: 1%;}
  62. .wym_skin_silver .wym_section li {}
  63. /*option: add this class to a section to make it render as a panel*/
  64. .wym_skin_silver .wym_panel { }
  65. .wym_skin_silver .wym_panel h2 { display: block; font-size: 11px; }
  66. /*option: add this class to a section to make it render as a dropdown menu*/
  67. .wym_skin_silver .wym_dropdown h2 { display: block; font-size: 11px;}
  68. .wym_skin_silver .wym_dropdown ul { position: absolute; background: white; padding: 0px;}
  69. .wym_skin_silver .wym_dropdown:hover ul,
  70. .wym_skin_silver .wym_dropdown.hover ul { cursor: pointer;}
  71. .wym_skin_silver .wym_dropdown ul li a {/*border-bottom: 1px solid #AAA;*/}
  72. /*option: add this class to a section to make its elements render buttons (icons are only available for the wym_tools section for now)*/
  73. .wym_skin_silver .wym_buttons li { float:left;}
  74. .wym_skin_silver .wym_buttons a { width: 20px; height: 20px; overflow: hidden; padding: 2px; text-decoration: none !important; border: 1px solid #666; }
  75. .wym_skin_silver .wym_buttons a:hover { text-decoration: none !important; border: 1px solid #000;}
  76. /*image replacements*/
  77. .wym_skin_silver .wym_buttons li a { background: url(images/icons.silver.gif) no-repeat; text-indent: -9999px;}
  78. .wym_skin_silver .wym_buttons li.wym_tools_strong a { background-position: 0 -384px;}
  79. .wym_skin_silver .wym_buttons li.wym_tools_emphasis a { background-position: 0 -24px;}
  80. .wym_skin_silver .wym_buttons li.wym_tools_superscript a { background-position: 0 -432px;}
  81. .wym_skin_silver .wym_buttons li.wym_tools_subscript a { background-position: 0 -456px;}
  82. .wym_skin_silver .wym_buttons li.wym_tools_ordered_list a { background-position: 0 -48px;}
  83. .wym_skin_silver .wym_buttons li.wym_tools_unordered_list a{ background-position: 0 -72px;}
  84. .wym_skin_silver .wym_buttons li.wym_tools_indent a { background-position: 0 -600px;}
  85. .wym_skin_silver .wym_buttons li.wym_tools_outdent a { background-position: 0 -624px;}
  86. .wym_skin_silver .wym_buttons li.wym_tools_undo a { background-position: 0 -504px;}
  87. .wym_skin_silver .wym_buttons li.wym_tools_redo a { background-position: 0 -528px;}
  88. .wym_skin_silver .wym_buttons li.wym_tools_link a { background-position: 0 -96px;}
  89. .wym_skin_silver .wym_buttons li.wym_tools_unlink a { background-position: 0 -168px;}
  90. .wym_skin_silver .wym_buttons li.wym_tools_image a { background-position: 0 -120px;}
  91. .wym_skin_silver .wym_buttons li.wym_tools_table a { background-position: 0 -144px;}
  92. .wym_skin_silver .wym_buttons li.wym_tools_paste a { background-position: 0 -552px;}
  93. .wym_skin_silver .wym_buttons li.wym_tools_html a { background-position: 0 -192px;}
  94. .wym_skin_silver .wym_buttons li.wym_tools_preview a { background-position: 0 -408px;}
  95. .wym_skin_silver .wym_buttons li.wym_tools_gadget a { background-position: 0 -576px;}
  96. .wym_skin_silver .wym_buttons li.wym_tools_strong a:hover { background-position: -24px -384px;}
  97. .wym_skin_silver .wym_buttons li.wym_tools_emphasis a:hover { background-position: -24px -24px;}
  98. .wym_skin_silver .wym_buttons li.wym_tools_superscript a:hover { background-position: -24px -432px;}
  99. .wym_skin_silver .wym_buttons li.wym_tools_subscript a:hover { background-position: -24px -456px;}
  100. .wym_skin_silver .wym_buttons li.wym_tools_ordered_list a:hover { background-position: -24px -48px;}
  101. .wym_skin_silver .wym_buttons li.wym_tools_unordered_list a:hover{ background-position: -24px -72px;}
  102. .wym_skin_silver .wym_buttons li.wym_tools_indent a:hover { background-position: -24px -600px;}
  103. .wym_skin_silver .wym_buttons li.wym_tools_outdent a:hover { background-position: -24px -624px;}
  104. .wym_skin_silver .wym_buttons li.wym_tools_undo a:hover { background-position: -24px -504px;}
  105. .wym_skin_silver .wym_buttons li.wym_tools_redo a:hover { background-position: -24px -528px;}
  106. .wym_skin_silver .wym_buttons li.wym_tools_link a:hover { background-position: -24px -96px;}
  107. .wym_skin_silver .wym_buttons li.wym_tools_unlink a:hover { background-position: -24px -168px;}
  108. .wym_skin_silver .wym_buttons li.wym_tools_image a:hover { background-position: -24px -120px;}
  109. .wym_skin_silver .wym_buttons li.wym_tools_table a:hover { background-position: -24px -144px;}
  110. .wym_skin_silver .wym_buttons li.wym_tools_paste a:hover { background-position: -24px -552px;}
  111. .wym_skin_silver .wym_buttons li.wym_tools_html a:hover { background-position: -24px -192px;}
  112. .wym_skin_silver .wym_buttons li.wym_tools_preview a:hover { background-position: -24px -408px;}
  113. .wym_skin_silver .wym_buttons li.wym_tools_gadget a:hover { background-position: -24px -576px;}
  114. /*DECORATION*/
  115. .wym_skin_silver .wym_section h2 { background: #ddd; border: none;}
  116. .wym_skin_silver .wym_section h2 span { color: gray;}
  117. .wym_skin_silver .wym_panel { padding: 0; border: solid gray; border-width: 0px;}
  118. .wym_skin_silver .wym_panel ul { margin: 2px 0 5px; }
  119. .wym_skin_silver .wym_dropdown { padding: 0; border: none; }
  120. .wym_skin_silver .wym_dropdown ul { border: none; margin-left: -1px; padding: 0px;}
  121. /*DIALOGS*/
  122. .wym_dialog div.row { margin-bottom: 5px;}
  123. .wym_dialog div.row input { margin-right: 5px;}
  124. .wym_dialog div.row label { float: left; width: 150px; display: block; text-align: right; margin-right: 10px; }
  125. .wym_dialog div.row-indent { padding-left: 160px; }
  126. /*autoclearing*/
  127. .wym_dialog div.row:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
  128. .wym_dialog div.row { display: inline-block; }
  129. /* Hides from IE-mac \*/
  130. * html .wym_dialog div.row { height: 1%; }
  131. .wym_dialog div.row { display: block; }
  132. /* End hide from IE-mac */
  133. /*WYMEDITOR_LINK*/
  134. a.wym_wymeditor_link
  135. {
  136. text-indent: -9999px;
  137. float: right;
  138. display: block;
  139. width: 50px;
  140. height: 15px;
  141. background: url(../wymeditor_icon.png);
  142. background-position: 1px 1px;
  143. background-repeat: no-repeat;
  144. overflow: hidden;
  145. text-decoration: none;
  146. padding: 1px !important;
  147. border: 1px solid #333 !important;
  148. background-color: #FFF !important;
  149. }
  150. .wym_box
  151. {
  152. padding: 0px !important;
  153. margin: 0px;
  154. }
  155. .wym_inner
  156. {
  157. border-left: 1px solid #FFF;
  158. border-top: 1px solid #FFF;
  159. border-right: 1px solid #FFF;
  160. border-bottom: 1px solid #FFF;
  161. padding: 5px;
  162. background-color: #B8C1C4;
  163. height: auto;
  164. }
  165. .clear {clear: both;}
  166. div.wym_dropdown
  167. {
  168. cursor: pointer;
  169. width: 138px !important;
  170. margin: 0px 4px 10px 0px !important;
  171. padding: 0px;
  172. z-index: 1001;
  173. display: block;
  174. border: 1px solid red;
  175. }
  176. div.wym_dropdown ul
  177. {
  178. display: none;
  179. width: 124px;
  180. padding: 0px !important;
  181. margin: 0px !important;
  182. list-style-type: none;
  183. list-style-image: none;
  184. z-index: 1002;
  185. position: absolute;
  186. border-top: 1px solid #AAA;
  187. }
  188. div.wym_dropdown ul li
  189. {
  190. width: 146px;
  191. height: 20px;
  192. padding: 0px !important;
  193. margin: 0px;
  194. border: 1px solid #777;
  195. border-top: none;
  196. background: #DDD;
  197. list-style-image: none;
  198. }
  199. div.wym_dropdown h2
  200. {
  201. width: 138px;
  202. height: 16px;
  203. color: #000 !important;
  204. background-image: url(images/bg.selector.silver.gif) !important;
  205. background-position: 0px -18px;
  206. background-repeat: no-repeat;
  207. border: none;
  208. font-family: "Trebuchet MS", Verdana, Arial, Helvetica, Sanserif;
  209. font-size: 12px !important;
  210. font-weight: bold !important;
  211. padding: 2px 0px 0px 10px !important;
  212. margin: 0px !important;
  213. }
  214. .wym_skin_silver .wym_panel h2
  215. {
  216. width: 138px;
  217. height: 16px;
  218. color: #000 !important;
  219. background-image: url(images/bg.header.gif) !important;
  220. background-position: 0px 0px;
  221. background-repeat: no-repeat;
  222. border: none;
  223. font-family: "Trebuchet MS", Verdana, Arial, Helvetica, Sanserif;
  224. font-size: 12px !important;
  225. font-weight: bold !important;
  226. padding: 2px 0px 0px 10px !important;
  227. margin: 0px !important;
  228. }
  229. .wym_skin_silver .wym_panel ul
  230. {
  231. margin-top: 0px !important;
  232. }
  233. .wym_skin_silver .wym_panel ul li
  234. {
  235. width: 146px;
  236. height: 20px;
  237. padding: 0px !important;
  238. margin: 0px;
  239. border: 1px solid #777;
  240. border-top: none;
  241. background: #DDD;
  242. list-style-image: none;
  243. }
  244. .wym_skin_silver .wym_panel a,
  245. div.wym_dropdown a
  246. {
  247. text-decoration: none;
  248. font-family: "Trebuchet MS", Verdana, Arial, Helvetica, Sanserif;
  249. font-size: 12px;
  250. padding: 5px 0px 0px 10px !important;
  251. display: block;
  252. width: 136px;
  253. height: 15px;
  254. color: #000;
  255. text-align: left !important;
  256. margin-left: 0px !important;
  257. }
  258. div.wym_dropdown a:hover,
  259. .wym_skin_silver .wym_panel a:hover
  260. {
  261. background: #BBB;
  262. border-bottom: none !important;
  263. }