You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

332 lines
12 KiB

10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
  1. /*
  2. * # Semantic - Accordion
  3. * http://github.com/jlukic/semantic-ui/
  4. *
  5. *
  6. * Copyright 2014 Contributor
  7. * Released under the MIT license
  8. * http://opensource.org/licenses/MIT
  9. *
  10. */
  11. /*******************************
  12. Theme
  13. *******************************/
  14. /*
  15. */
  16. /*******************************
  17. Folders
  18. *******************************/
  19. /* Path to theme packages */
  20. /* Path to site override folder */
  21. /*******************************
  22. Themes
  23. *******************************/
  24. /* To override a theme for an individual element
  25. specify theme name below
  26. Be sure to update the user folder name (see README)
  27. */
  28. /* Global */
  29. /* Elements */
  30. /* Collections */
  31. /* Modules */
  32. /* Views */
  33. /*******************************
  34. Import Directives
  35. *******************************/
  36. /*------------------
  37. Load Default
  38. -------------------*/
  39. /*******************************
  40. Site Settings
  41. *******************************/
  42. /*-------------------
  43. Paths
  44. --------------------*/
  45. /*-------------------
  46. Fonts
  47. --------------------*/
  48. /*-------------------
  49. Site Colors
  50. --------------------*/
  51. /*--- Colors ---*/
  52. /*--- Light Colors ---*/
  53. /*-------------------
  54. Page
  55. --------------------*/
  56. /*-------------------
  57. Background Colors
  58. --------------------*/
  59. /* Used for differentiating neutrals */
  60. /* Used for differentiating layers */
  61. /*-------------------
  62. Grid
  63. --------------------*/
  64. /*-------------------
  65. Breakpoints
  66. --------------------*/
  67. /*******************************
  68. Power-User
  69. *******************************/
  70. /*-------------------
  71. Icons
  72. --------------------*/
  73. /* Max Width of Icon */
  74. /*-------------------
  75. Easing
  76. --------------------*/
  77. /*--- Neutrals ---*/
  78. /*--- Colored Backgrounds ---*/
  79. /*--- Colored Text ---*/
  80. /*--- Colored Headers ---*/
  81. /*-------------------
  82. Emotive Colors
  83. --------------------*/
  84. /* Mood */
  85. /* Solid Background Color */
  86. /* Status */
  87. /* Darkened Headers */
  88. /*-------------------
  89. Neutral Text
  90. --------------------*/
  91. /*-------------------
  92. Brand Colors
  93. --------------------*/
  94. /*-------------------
  95. Grid Columns
  96. --------------------*/
  97. /*-------------------
  98. Borders
  99. --------------------*/
  100. /*-------------------
  101. Sizes
  102. --------------------*/
  103. /*-------------------
  104. Transitions
  105. --------------------*/
  106. /*******************************
  107. States
  108. *******************************/
  109. /*-------------------
  110. Disabled
  111. --------------------*/
  112. /*-------------------
  113. Hover
  114. --------------------*/
  115. /*--- Colors ---*/
  116. /*--- Emotive ---*/
  117. /*--- Neutrals ---*/
  118. /*-------------------
  119. Down (:active)
  120. --------------------*/
  121. /*--- Colors ---*/
  122. /*--- Emotive ---*/
  123. /*--- Neutrals ---*/
  124. /*-------------------
  125. Active
  126. --------------------*/
  127. /*--- Standard ---*/
  128. /*--- Emotive ---*/
  129. /*--- Neutrals ---*/
  130. /*******************************
  131. Accordion
  132. *******************************/
  133. /* Title */
  134. /* Icon */
  135. /* Child Accordion */
  136. /* Content */
  137. /*-------------------
  138. Variations
  139. --------------------*/
  140. /* Styled */
  141. /* Content */
  142. /* Child Content */
  143. /* Styled Title */
  144. /* Styled Title States */
  145. /* Styled Child Title States */
  146. /*------------------
  147. Load Theme
  148. -------------------*/
  149. /*------------------
  150. Load Site
  151. -------------------*/
  152. /*******************************
  153. User Global Variables
  154. *******************************/
  155. /*******************************
  156. User Variable Overrides
  157. *******************************/
  158. /*------------------
  159. Override Mix-in
  160. -------------------*/
  161. /*******************************
  162. Accordion
  163. *******************************/
  164. .ui.accordion,
  165. .ui.accordion .accordion {
  166. max-width: 100%;
  167. font-size: 1em;
  168. }
  169. .ui.accordion .accordion {
  170. margin: 1em 0em 0em;
  171. padding: 0em;
  172. }
  173. .ui.accordion .title,
  174. .ui.accordion .accordion .title {
  175. cursor: pointer;
  176. font-family: 'Lato', 'Helvetica Neue', Arial, Helvetica, sans-serif;
  177. font-size: 1em;
  178. padding: 0.5em 0em;
  179. color: rgba(0, 0, 0, 0.8);
  180. }
  181. .ui.accordion .content,
  182. .ui.accordion .accordion .content {
  183. display: none;
  184. margin: 0em;
  185. padding: 0.5em 0em 1em;
  186. }
  187. .ui.accordion .content:last-child {
  188. padding-bottom: 0em;
  189. }
  190. /* Arrow */
  191. .ui.accordion .title .dropdown.icon,
  192. .ui.accordion .accordion .title .dropdown.icon {
  193. display: inline-block;
  194. float: none;
  195. opacity: 0.75;
  196. width: 1.25em;
  197. height: 1em;
  198. margin: 0em 0.25em 0em -0.25em;
  199. -webkit-transition: -webkit-transform 0.2s ease, opacity 0.2s ease;
  200. transition: transform 0.2s ease, opacity 0.2s ease;
  201. vertical-align: baseline;
  202. }
  203. /*******************************
  204. Types
  205. *******************************/
  206. /*--------------
  207. Styled
  208. ---------------*/
  209. .ui.styled.accordion {
  210. width: 600px;
  211. }
  212. .ui.styled.accordion,
  213. .ui.styled.accordion .accordion {
  214. border-radius: 0.3125em;
  215. background: #ffffff;
  216. box-shadow: 0px 1px 2px 0 rgba(0, 0, 0, 0.05), 0px 0px 0px 1px rgba(0, 0, 0, 0.1);
  217. }
  218. .ui.styled.accordion .title,
  219. .ui.styled.accordion .accordion .title {
  220. margin: 0em;
  221. padding: 0.75em 1em;
  222. color: rgba(0, 0, 0, 0.4);
  223. font-weight: bold;
  224. border-top: 1px solid rgba(0, 0, 0, 0.1);
  225. -webkit-transition: background 0.25s ease, color 0.25s ease;
  226. transition: background 0.25s ease, color 0.25s ease;
  227. }
  228. .ui.styled.accordion .title:first-child,
  229. .ui.styled.accordion .accordion .title:first-child {
  230. border-top: none;
  231. }
  232. /* Content */
  233. .ui.styled.accordion .content,
  234. .ui.styled.accordion .accordion .content {
  235. margin: 0em;
  236. padding: 0.5em 1em 1.5em;
  237. }
  238. .ui.styled.accordion .accordion .content {
  239. padding: 0em;
  240. padding: 0.5em 1em 1.5em;
  241. }
  242. /* Hover */
  243. .ui.styled.accordion .title:hover,
  244. .ui.styled.accordion .active.title,
  245. .ui.styled.accordion .accordion .title:hover,
  246. .ui.styled.accordion .accordion .active.title {
  247. background: transparent;
  248. color: rgba(0, 0, 0, 0.8);
  249. }
  250. .ui.styled.accordion .accordion .title:hover,
  251. .ui.styled.accordion .accordion .active.title {
  252. background: transparent;
  253. color: rgba(0, 0, 0, 0.8);
  254. }
  255. /* Active */
  256. .ui.styled.accordion .active.title {
  257. background: transparent;
  258. color: rgba(0, 0, 0, 0.8);
  259. }
  260. .ui.styled.accordion .accordion .active.title {
  261. background: transparent;
  262. color: rgba(0, 0, 0, 0.8);
  263. }
  264. /*******************************
  265. States
  266. *******************************/
  267. /*--------------
  268. Active
  269. ---------------*/
  270. .ui.accordion .active.content,
  271. .ui.accordion .accordion .active.content {
  272. display: block;
  273. }
  274. /*******************************
  275. Variations
  276. *******************************/
  277. /*--------------
  278. Fluid
  279. ---------------*/
  280. .ui.fluid.accordion,
  281. .ui.fluid.accordion .accordion {
  282. width: 100%;
  283. }
  284. /*******************************
  285. Overrides
  286. *******************************/
  287. @font-face {
  288. font-family: 'Accordion';
  289. src: url(data:application/x-font-ttf;charset=utf-8;base64,AAEAAAALAIAAAwAwT1MvMggjB5AAAAC8AAAAYGNtYXAPfOIKAAABHAAAAExnYXNwAAAAEAAAAWgAAAAIZ2x5Zryj6HgAAAFwAAAAyGhlYWT/0IhHAAACOAAAADZoaGVhApkB5wAAAnAAAAAkaG10eAJuABIAAAKUAAAAGGxvY2EAjABWAAACrAAAAA5tYXhwAAgAFgAAArwAAAAgbmFtZfC1n04AAALcAAABPHBvc3QAAwAAAAAEGAAAACAAAwIAAZAABQAAAUwBZgAAAEcBTAFmAAAA9QAZAIQAAAAAAAAAAAAAAAAAAAABEAAAAAAAAAAAAAAAAAAAAABAAADw2gHg/+D/4AHgACAAAAABAAAAAAAAAAAAAAAgAAAAAAACAAAAAwAAABQAAwABAAAAFAAEADgAAAAKAAgAAgACAAEAIPDa//3//wAAAAAAIPDZ//3//wAB/+MPKwADAAEAAAAAAAAAAAAAAAEAAf//AA8AAQAAAAAAAAAAAAIAADc5AQAAAAABAAAAAAAAAAAAAgAANzkBAAAAAAEAAAAAAAAAAAACAAA3OQEAAAAAAQASAEkAtwFuABMAADc0PwE2FzYXFh0BFAcGJwYvASY1EgaABQgHBQYGBQcIBYAG2wcGfwcBAQcECf8IBAcBAQd/BgYAAAAAAQAAAEkApQFuABMAADcRNDc2MzIfARYVFA8BBiMiJyY1AAUGBwgFgAYGgAUIBwYFWwEACAUGBoAFCAcFgAYGBQcAAAABAAAAAQAAqWYls18PPPUACwIAAAAAAM/9o+4AAAAAz/2j7gAAAAAAtwFuAAAACAACAAAAAAAAAAEAAAHg/+AAAAIAAAAAAAC3AAEAAAAAAAAAAAAAAAAAAAAGAAAAAAAAAAAAAAAAAQAAAAC3ABIAtwAAAAAAAAAKABQAHgBCAGQAAAABAAAABgAUAAEAAAAAAAIAAAAAAAAAAAAAAAAAAAAAAAAADgCuAAEAAAAAAAEADAAAAAEAAAAAAAIADgBAAAEAAAAAAAMADAAiAAEAAAAAAAQADABOAAEAAAAAAAUAFgAMAAEAAAAAAAYABgAuAAEAAAAAAAoANABaAAMAAQQJAAEADAAAAAMAAQQJAAIADgBAAAMAAQQJAAMADAAiAAMAAQQJAAQADABOAAMAAQQJAAUAFgAMAAMAAQQJAAYADAA0AAMAAQQJAAoANABaAHIAYQB0AGkAbgBnAFYAZQByAHMAaQBvAG4AIAAxAC4AMAByAGEAdABpAG4AZ3JhdGluZwByAGEAdABpAG4AZwBSAGUAZwB1AGwAYQByAHIAYQB0AGkAbgBnAEYAbwBuAHQAIABnAGUAbgBlAHIAYQB0AGUAZAAgAGIAeQAgAEkAYwBvAE0AbwBvAG4ALgADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA) format('truetype'), url(data:application/font-woff;charset=utf-8;base64,d09GRk9UVE8AAASwAAoAAAAABGgAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAABDRkYgAAAA9AAAAS0AAAEtFpovuE9TLzIAAAIkAAAAYAAAAGAIIweQY21hcAAAAoQAAABMAAAATA984gpnYXNwAAAC0AAAAAgAAAAIAAAAEGhlYWQAAALYAAAANgAAADb/0IhHaGhlYQAAAxAAAAAkAAAAJAKZAedobXR4AAADNAAAABgAAAAYAm4AEm1heHAAAANMAAAABgAAAAYABlAAbmFtZQAAA1QAAAE8AAABPPC1n05wb3N0AAAEkAAAACAAAAAgAAMAAAEABAQAAQEBB3JhdGluZwABAgABADr4HAL4GwP4GAQeCgAZU/+Lix4KABlT/4uLDAeLa/iU+HQFHQAAAHkPHQAAAH4RHQAAAAkdAAABJBIABwEBBw0PERQZHnJhdGluZ3JhdGluZ3UwdTF1MjB1RjBEOXVGMERBAAACAYkABAAGAQEEBwoNVp38lA78lA78lA77lA773Z33bxWLkI2Qj44I9xT3FAWOj5CNkIuQi4+JjoePiI2Gi4YIi/uUBYuGiYeHiIiHh4mGi4aLho2Ijwj7FPcUBYeOiY+LkAgO+92L5hWL95QFi5CNkI6Oj4+PjZCLkIuQiY6HCPcU+xQFj4iNhouGi4aJh4eICPsU+xQFiIeGiYaLhouHjYePiI6Jj4uQCA74lBT4lBWLDAoAAAAAAwIAAZAABQAAAUwBZgAAAEcBTAFmAAAA9QAZAIQAAAAAAAAAAAAAAAAAAAABEAAAAAAAAAAAAAAAAAAAAABAAADw2gHg/+D/4AHgACAAAAABAAAAAAAAAAAAAAAgAAAAAAACAAAAAwAAABQAAwABAAAAFAAEADgAAAAKAAgAAgACAAEAIPDa//3//wAAAAAAIPDZ//3//wAB/+MPKwADAAEAAAAAAAAAAAAAAAEAAf//AA8AAQAAAAEAADfYOJZfDzz1AAsCAAAAAADP/aPuAAAAAM/9o+4AAAAAALcBbgAAAAgAAgAAAAAAAAABAAAB4P/gAAACAAAAAAAAtwABAAAAAAAAAAAAAAAAAAAABgAAAAAAAAAAAAAAAAEAAAAAtwASALcAAAAAUAAABgAAAAAADgCuAAEAAAAAAAEADAAAAAEAAAAAAAIADgBAAAEAAAAAAAMADAAiAAEAAAAAAAQADABOAAEAAAAAAAUAFgAMAAEAAAAAAAYABgAuAAEAAAAAAAoANABaAAMAAQQJAAEADAAAAAMAAQQJAAIADgBAAAMAAQQJAAMADAAiAAMAAQQJAAQADABOAAMAAQQJAAUAFgAMAAMAAQQJAAYADAA0AAMAAQQJAAoANABaAHIAYQB0AGkAbgBnAFYAZQByAHMAaQBvAG4AIAAxAC4AMAByAGEAdABpAG4AZ3JhdGluZwByAGEAdABpAG4AZwBSAGUAZwB1AGwAYQByAHIAYQB0AGkAbgBnAEYAbwBuAHQAIABnAGUAbgBlAHIAYQB0AGUAZAAgAGIAeQAgAEkAYwBvAE0AbwBvAG4ALgADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA) format('woff');
  290. font-weight: normal;
  291. font-style: normal;
  292. }
  293. /* Dropdown Icon */
  294. .ui.accordion .title .dropdown.icon,
  295. .ui.accordion .accordion .title .dropdown.icon {
  296. font-family: Accordion;
  297. line-height: 1;
  298. -webkit-backface-visibility: hidden;
  299. backface-visibility: hidden;
  300. font-weight: normal;
  301. font-style: normal;
  302. text-align: center;
  303. }
  304. .ui.accordion .title .dropdown.icon:before,
  305. .ui.accordion .accordion .title .dropdown.icon:before {
  306. content: '\f0da' /*rtl:'\f0d9'*/;
  307. }
  308. /* Icon Rotation */
  309. .ui.accordion .title .dropdown.icon,
  310. .ui.accordion .accordion .title .dropdown.icon {
  311. -webkit-transform: rotate(0deg);
  312. -ms-transform: rotate(0deg);
  313. transform: rotate(0deg);
  314. }
  315. .ui.accordion .active.title .dropdown.icon,
  316. .ui.accordion .accordion .active.title .dropdown.icon {
  317. -webkit-transform: rotate(90deg);
  318. -ms-transform: rotate(90deg);
  319. transform: rotate(90deg);
  320. }
  321. /*******************************
  322. User Overrides
  323. *******************************/