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.

496 lines
13 KiB

10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
  1. /*
  2. * # Semantic - Reveal
  3. * http://github.com/semantic-org/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 Defaults
  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. /* Status */
  86. /*-------------------
  87. Neutral Text
  88. --------------------*/
  89. /*-------------------
  90. Brand Colors
  91. --------------------*/
  92. /*-------------------
  93. Borders
  94. --------------------*/
  95. /*-------------------
  96. Sizes
  97. --------------------*/
  98. /*-------------------
  99. Transitions
  100. --------------------*/
  101. /*-------------------
  102. Derived Values
  103. --------------------*/
  104. /* Makes sure padded grid can fit at 320px */
  105. /* Used to match floats with text */
  106. /* Positive / Negative Dupes */
  107. /* Header Colors */
  108. /* Responsive */
  109. /* Columns */
  110. /*******************************
  111. States
  112. *******************************/
  113. /*-------------------
  114. Disabled
  115. --------------------*/
  116. /*-------------------
  117. Hover
  118. --------------------*/
  119. /*--- Colors ---*/
  120. /*--- Emotive ---*/
  121. /*--- Neutrals ---*/
  122. /*-------------------
  123. Down (:active)
  124. --------------------*/
  125. /*--- Colors ---*/
  126. /*--- Emotive ---*/
  127. /*--- Neutrals ---*/
  128. /*-------------------
  129. Active
  130. --------------------*/
  131. /*--- Standard ---*/
  132. /*--- Emotive ---*/
  133. /*--- Neutrals ---*/
  134. /*******************************
  135. Reveal
  136. *******************************/
  137. /*------------------
  138. Load Theme
  139. -------------------*/
  140. /*******************************
  141. Site Settings
  142. *******************************/
  143. /*-------------------
  144. Paths
  145. --------------------*/
  146. /*-------------------
  147. Fonts
  148. --------------------*/
  149. /*-------------------
  150. Site Colors
  151. --------------------*/
  152. /*--- Colors ---*/
  153. /*--- Light Colors ---*/
  154. /*-------------------
  155. Page
  156. --------------------*/
  157. /*-------------------
  158. Background Colors
  159. --------------------*/
  160. /* Used for differentiating neutrals */
  161. /* Used for differentiating layers */
  162. /*-------------------
  163. Grid
  164. --------------------*/
  165. /*-------------------
  166. Breakpoints
  167. --------------------*/
  168. /*******************************
  169. Power-User
  170. *******************************/
  171. /*-------------------
  172. Icons
  173. --------------------*/
  174. /* Max Width of Icon */
  175. /*-------------------
  176. Easing
  177. --------------------*/
  178. /*--- Neutrals ---*/
  179. /*--- Colored Backgrounds ---*/
  180. /*--- Colored Text ---*/
  181. /*--- Colored Headers ---*/
  182. /*-------------------
  183. Emotive Colors
  184. --------------------*/
  185. /* Mood */
  186. /* Status */
  187. /*-------------------
  188. Neutral Text
  189. --------------------*/
  190. /*-------------------
  191. Brand Colors
  192. --------------------*/
  193. /*-------------------
  194. Borders
  195. --------------------*/
  196. /*-------------------
  197. Sizes
  198. --------------------*/
  199. /*-------------------
  200. Transitions
  201. --------------------*/
  202. /*-------------------
  203. Derived Values
  204. --------------------*/
  205. /* Makes sure padded grid can fit at 320px */
  206. /* Used to match floats with text */
  207. /* Positive / Negative Dupes */
  208. /* Header Colors */
  209. /* Responsive */
  210. /* Columns */
  211. /*******************************
  212. States
  213. *******************************/
  214. /*-------------------
  215. Disabled
  216. --------------------*/
  217. /*-------------------
  218. Hover
  219. --------------------*/
  220. /*--- Colors ---*/
  221. /*--- Emotive ---*/
  222. /*--- Neutrals ---*/
  223. /*-------------------
  224. Down (:active)
  225. --------------------*/
  226. /*--- Colors ---*/
  227. /*--- Emotive ---*/
  228. /*--- Neutrals ---*/
  229. /*-------------------
  230. Active
  231. --------------------*/
  232. /*--- Standard ---*/
  233. /*--- Emotive ---*/
  234. /*--- Neutrals ---*/
  235. /*******************************
  236. Reveal
  237. *******************************/
  238. /*------------------
  239. Load Site
  240. -------------------*/
  241. /*******************************
  242. User Global Variables
  243. *******************************/
  244. /*******************************
  245. User Variable Overrides
  246. *******************************/
  247. /*------------------
  248. Override Loader
  249. -------------------*/
  250. /*******************************
  251. Reveal
  252. *******************************/
  253. .ui.reveal {
  254. display: inline-block;
  255. position: relative !important;
  256. z-index: 3 !important;
  257. font-size: 0em !important;
  258. }
  259. .ui.reveal > .visible.content {
  260. position: absolute !important;
  261. top: 0em !important;
  262. left: 0em !important;
  263. z-index: 4 !important;
  264. -webkit-transition: all 0.8s cubic-bezier(0.175, 0.885, 0.32, 1) 0.15s;
  265. transition: all 0.8s cubic-bezier(0.175, 0.885, 0.32, 1) 0.15s;
  266. }
  267. .ui.reveal > .hidden.content {
  268. position: relative !important;
  269. z-index: 3 !important;
  270. }
  271. /*******************************
  272. Types
  273. *******************************/
  274. /*--------------
  275. Slide
  276. ---------------*/
  277. .ui.slide.reveal {
  278. position: relative !important;
  279. display: block;
  280. overflow: hidden !important;
  281. white-space: nowrap;
  282. }
  283. .ui.slide.reveal > .content {
  284. display: block;
  285. float: left;
  286. margin: 0em;
  287. -webkit-transition: top 0.8s cubic-bezier(0.175, 0.885, 0.32, 1) 0.15s, left 0.8s cubic-bezier(0.175, 0.885, 0.32, 1) 0.15s, right 0.8s cubic-bezier(0.175, 0.885, 0.32, 1) 0.15s, bottom 0.8s cubic-bezier(0.175, 0.885, 0.32, 1) 0.15s;
  288. transition: top 0.8s cubic-bezier(0.175, 0.885, 0.32, 1) 0.15s, left 0.8s cubic-bezier(0.175, 0.885, 0.32, 1) 0.15s, right 0.8s cubic-bezier(0.175, 0.885, 0.32, 1) 0.15s, bottom 0.8s cubic-bezier(0.175, 0.885, 0.32, 1) 0.15s;
  289. }
  290. .ui.slide.reveal > .visible.content {
  291. position: relative !important;
  292. }
  293. .ui.slide.reveal > .hidden.content {
  294. position: absolute !important;
  295. left: 100% !important;
  296. width: 100% !important;
  297. }
  298. .ui.slide.reveal:hover > .visible.content {
  299. left: -100% !important;
  300. }
  301. .ui.slide.reveal:hover > .hidden.content {
  302. left: 0% !important;
  303. }
  304. .ui.right.slide.reveal > .visible.content {
  305. left: 0%;
  306. }
  307. .ui.right.slide.reveal > .hidden.content {
  308. left: auto !important;
  309. right: 100% !important;
  310. }
  311. .ui.right.slide.reveal:hover > .visible.content {
  312. left: 100% !important;
  313. right: auto !important;
  314. }
  315. .ui.right.slide.reveal:hover > .hidden.content {
  316. left: auto !important;
  317. right: 0% !important;
  318. }
  319. .ui.up.slide.reveal > .visible.content {
  320. top: 0% !important;
  321. left: 0% !important;
  322. right: auto !important;
  323. bottom: auto !important;
  324. }
  325. .ui.up.slide.reveal > .hidden.content {
  326. top: 100% !important;
  327. left: 0% !important;
  328. right: auto !important;
  329. bottom: auto !important;
  330. }
  331. .ui.slide.up.reveal:hover > .visible.content {
  332. top: -100% !important;
  333. left: 0% !important;
  334. }
  335. .ui.slide.up.reveal:hover > .hidden.content {
  336. top: 0% !important;
  337. left: 0% !important;
  338. }
  339. .ui.down.slide.reveal > .visible.content {
  340. top: auto !important;
  341. right: auto !important;
  342. bottom: auto !important;
  343. bottom: 0% !important;
  344. }
  345. .ui.down.slide.reveal > .hidden.content {
  346. top: auto !important;
  347. right: auto !important;
  348. bottom: 100% !important;
  349. left: 0% !important;
  350. }
  351. .ui.slide.down.reveal:hover > .visible.content {
  352. left: 0% !important;
  353. bottom: -100% !important;
  354. }
  355. .ui.slide.down.reveal:hover > .hidden.content {
  356. left: 0% !important;
  357. bottom: 0% !important;
  358. }
  359. /*--------------
  360. Fade
  361. ---------------*/
  362. .ui.fade.reveal > .visible.content {
  363. opacity: 1;
  364. }
  365. .ui.fade.reveal:hover > .visible.content {
  366. opacity: 0;
  367. }
  368. /*--------------
  369. Move
  370. ---------------*/
  371. .ui.move.reveal > .visible.content,
  372. .ui.move.left.reveal > .visible.content {
  373. left: auto !important;
  374. top: auto !important;
  375. bottom: auto !important;
  376. right: 0% !important;
  377. }
  378. .ui.move.reveal:hover > .visible.content,
  379. .ui.move.left.reveal:hover > .visible.content {
  380. right: 100% !important;
  381. }
  382. .ui.move.right.reveal > .visible.content {
  383. right: auto !important;
  384. top: auto !important;
  385. bottom: auto !important;
  386. left: 0% !important;
  387. }
  388. .ui.move.right.reveal:hover > .visible.content {
  389. left: 100% !important;
  390. }
  391. .ui.move.up.reveal > .visible.content {
  392. right: auto !important;
  393. left: auto !important;
  394. top: auto !important;
  395. bottom: 0% !important;
  396. }
  397. .ui.move.up.reveal:hover > .visible.content {
  398. bottom: 100% !important;
  399. }
  400. .ui.move.down.reveal > .visible.content {
  401. right: auto !important;
  402. left: auto !important;
  403. top: 0% !important;
  404. bottom: auto !important;
  405. }
  406. .ui.move.down.reveal:hover > .visible.content {
  407. top: 100% !important;
  408. }
  409. /*--------------
  410. Rotate
  411. ---------------*/
  412. .ui.rotate.reveal > .visible.content {
  413. -webkit-transition-duration: 0.8s;
  414. transition-duration: 0.8s;
  415. -webkit-transform: rotate(0deg);
  416. -ms-transform: rotate(0deg);
  417. transform: rotate(0deg);
  418. }
  419. .ui.rotate.reveal > .visible.content,
  420. .ui.rotate.right.reveal > .visible.content {
  421. -webkit-transform-origin: bottom right;
  422. -ms-transform-origin: bottom right;
  423. transform-origin: bottom right;
  424. }
  425. .ui.rotate.reveal:hover > .visible.content,
  426. .ui.rotate.right.reveal:hover > .visible.content {
  427. -webkit-transform: rotate(110deg);
  428. -ms-transform: rotate(110deg);
  429. transform: rotate(110deg);
  430. }
  431. .ui.rotate.left.reveal > .visible.content {
  432. -webkit-transform-origin: bottom left;
  433. -ms-transform-origin: bottom left;
  434. transform-origin: bottom left;
  435. }
  436. .ui.rotate.left.reveal:hover > .visible.content {
  437. -webkit-transform: rotate(-110deg);
  438. -ms-transform: rotate(-110deg);
  439. transform: rotate(-110deg);
  440. }
  441. /*******************************
  442. States
  443. *******************************/
  444. .ui.disabled.reveal {
  445. opacity: 1 !important;
  446. }
  447. .ui.disabled.reveal > .content {
  448. -webkit-transition: none !important;
  449. transition: none !important;
  450. }
  451. .ui.disabled.reveal:hover > .visible.content {
  452. position: static !important;
  453. display: block !important;
  454. opacity: 1 !important;
  455. top: 0 !important;
  456. left: 0 !important;
  457. right: auto !important;
  458. bottom: auto !important;
  459. -webkit-transform: none !important;
  460. -ms-transform: none !important;
  461. transform: none !important;
  462. }
  463. .ui.disabled.reveal:hover > .hidden.content {
  464. display: none !important;
  465. }
  466. /*******************************
  467. Variations
  468. *******************************/
  469. /*--------------
  470. Masked
  471. ---------------*/
  472. .ui.masked.reveal {
  473. overflow: hidden;
  474. }
  475. /*--------------
  476. Instant
  477. ---------------*/
  478. .ui.instant.reveal > .content {
  479. -webkit-transition-delay: 0s !important;
  480. transition-delay: 0s !important;
  481. }
  482. /*--------------
  483. Sizing
  484. ---------------*/
  485. .ui.reveal > .content {
  486. font-size: 1rem !important;
  487. }