tripal.css 7.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249
  1. /**
  2. * The Tripal generic node template (node--chado-generc.tpl.php)
  3. * has an outer div box with class 'tripal-contents' and with an inner
  4. * table with an id of 'tripal-contents-table'. The table has a single
  5. * row with two columns. The smaller left column houses the table of
  6. * contents (TOC) for the node data. The larger right column houses the data:
  7. *
  8. * |-----------------------------------------------|
  9. * | .tripal-contents |
  10. * | |-------------------------------------------| |
  11. * | | .tripal-contents-table | |
  12. * | | | | |
  13. * | | | | |
  14. * | | TOC | Data | |
  15. * | | column | Column | |
  16. * | | | | |
  17. * | | | | |
  18. * | | | | |
  19. * | |-------------------------------------------| |
  20. * |-----------------------------------------------|
  21. *
  22. * The tripal-contents box and the inner table are designed to fill the width
  23. * of the contents section of any theme. Customize the CSS below to change
  24. * the look-and-feel.
  25. *
  26. */
  27. .tripal-contents {
  28. width: 100%;
  29. }
  30. .tripal-contents-links {
  31. }
  32. .tripal-contents_table {
  33. padding: 0px !important;
  34. margin: 0px !important;
  35. }
  36. /**
  37. * The table formatting must override the default theme. This is because
  38. * the table is meant for organizing the sidebar and contents so they don't
  39. * slip and slide around as would happen with div boxes that were floated.
  40. * Therefore, we use !important to keep the default theme from overrideing
  41. * the table settings.
  42. */
  43. .tripal-contents-table tbody {
  44. padding: 0px !important;
  45. margin: 0px !important;
  46. border: none !important;
  47. background-color: transparent !important;
  48. }
  49. .tripal-contents-table-tr {
  50. padding: 0px !important;
  51. margin: 0px !important;
  52. border: none !important;
  53. background-color: transparent !important;
  54. }
  55. .tripal-contents-table-td-toc {
  56. border-right: 1px solid #CCCCCC !important;
  57. margin: 0px !important;
  58. padding: 0px !important;
  59. background-color: transparent !important;
  60. text-align: left !important;
  61. vertical-align: top !important;
  62. }
  63. .tripal-contents-table-td-data {
  64. border: none !important;
  65. margin: 0px !important;
  66. padding: 0px 0px 0px 20px !important;
  67. background-color: transparent !important;
  68. text-align: left !important;
  69. vertical-align: top !important;
  70. }
  71. /**
  72. * The table of contents is an unordered list. The following can are used
  73. * to style the list
  74. */
  75. .tripal_toc_list {
  76. }
  77. .tripal_toc_list_item {
  78. padding: 3px 20px 3px 0px !important;
  79. margin: 2px 0 2px 0 !important;
  80. }
  81. /******************************************************************************
  82. * The links that appear in the TOC section are added dynamically by
  83. * JavaScript code found at the top of the node--chado-generc.tpl.php template.
  84. * Each link in the TOC cooresponds to a "pane" of data added to the Data
  85. * Column. Initially, the JavaScript hids all "panes" except for the "Details"
  86. * pane. There will be as many panes as there are TOC links.
  87. *
  88. * By default, all panes have the following layout that consists of a
  89. * container div box with the class 'tripal-info-box', a div box to house the
  90. * pane title with the class 'tripal-info-box-title', and a div box to
  91. * house a brief description about the pane with the class
  92. * 'tripal-info-box-desc'
  93. *
  94. * |-----------------------------------------------|
  95. * | .tripal-data-pane |
  96. * | |-------------------------------------------| |
  97. * | | .tripal-data-pane-title | |
  98. * | |-------------------------------------------| |
  99. * | | .tripal-data-pane-desc | |
  100. * | |-------------------------------------------| |
  101. * | |
  102. * | (Block data goes here) |
  103. * | |
  104. * | |
  105. * | |
  106. * | |
  107. * |-----------------------------------------------|
  108. */
  109. .tripal-data-pane {
  110. padding: 0;
  111. margin: 0;
  112. width: 100%;
  113. }
  114. .tripal-data-pane-title {
  115. font-size: 1.5em;
  116. padding-bottom: 5px;
  117. }
  118. .tripal-info-box-desc {
  119. margin-bottom: 10px;
  120. }
  121. /**
  122. * Within the pane data
  123. */
  124. .tripal-data-table {
  125. margin-top: 0px;
  126. margin-bottom: 10px;
  127. }
  128. /******************************************************************************
  129. * The teaser appears anywhere that a small snippet of the content is required.
  130. * When any node in Drupal is published to the home page a teaser is used.
  131. * Teasers can also be used in views to provide lists of content. The
  132. * teaser template is similar to the pane but with the following sections and
  133. * classes
  134. *
  135. * |-----------------------------------------------|
  136. * | .tripal-teaser |
  137. * | |-------------------------------------------| |
  138. * | | .tripal-teaser-title | |
  139. * | |-------------------------------------------| |
  140. * | | .tripal-teaser-text | |
  141. * | | | |
  142. * | |-------------------------------------------| |
  143. * |-----------------------------------------------|
  144. */
  145. .tripal-teaser {
  146. clear: both;
  147. margin-bottom: 10px;
  148. }
  149. .tripal-teaser-title {
  150. font-weight: bold;
  151. margin-bottom: 5px;
  152. }
  153. .tripal-teaser-text {
  154. text-align: justify;
  155. text-justify:inter-word;
  156. }
  157. /**
  158. * some nodes such as the organism node may have images. This class
  159. * is used to format any image that appears in the teaser
  160. */
  161. .tripal-teaser-img {
  162. width: 100px;
  163. float: left;
  164. padding-right: 10px;
  165. padding-bottom: 5px;
  166. }
  167. /******************************************************************************
  168. * Administrative CSS classes
  169. *****************************************************************************/
  170. /**
  171. * This class is used when providing hints or other instructions to the
  172. * site administrator
  173. */
  174. div.messages.tripal-site-admin-only{
  175. background-image: url("../images/TripalLogo-sm.png");
  176. background-repeat: no-repeat;
  177. background-color: #cce3ff;
  178. margin-top: 10px;
  179. margin-bottom: 10px;
  180. margin-left: 0px;
  181. margin-right: 0px;
  182. border: 1px solid #7DA1D4;
  183. min-height: 65px;
  184. clear: both;
  185. padding: 0px;
  186. }
  187. .tripal-code {
  188. font-family: "Courier New", Courier, monospace;
  189. word-wrap: break-word;
  190. display: block;
  191. padding-top: 10px;
  192. padding-bottom: 10px;
  193. }
  194. .tripal-severity-string {
  195. font-weight: bold;
  196. }
  197. .tripal-severity-string-critical, .tripal-severity-string-error,
  198. .tripal-severity-string.critical, .tripal-severity-string.error {
  199. color: #FF0000;
  200. }
  201. .tripal-severity-string-warning,
  202. .tripal-severity-string.warning {
  203. color: #FF8000;
  204. }
  205. .tripal-site-admin-message {
  206. padding: 15px 10px 10px 70px;
  207. font-style: italic;
  208. }
  209. .tripal-site-admin-only-table-row {
  210. background-color: #cce3ff;
  211. /* border: 1px solid #7DA1D4; */
  212. color: black;
  213. }
  214. /******************************************************************************
  215. * Misc CSS classes
  216. *****************************************************************************/
  217. .tripal-dl {
  218. width: 100%;
  219. overflow: hidden;
  220. }
  221. .tripal-dl dt {
  222. float: left;
  223. }
  224. .tripal-dl dd {
  225. }