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.

407 lines
9.6 KiB

10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
  1. /*
  2. * # Semantic - Nag
  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. Nag
  136. *******************************/
  137. /*--------------
  138. Collection
  139. ---------------*/
  140. /*--------------
  141. Elements
  142. ---------------*/
  143. /* Title */
  144. /*--------------
  145. States
  146. ---------------*/
  147. /* Hover */
  148. /*--------------
  149. Variations
  150. ---------------*/
  151. /* Top / Bottom */
  152. /* Inverted */
  153. /*--------------
  154. Plural
  155. ---------------*/
  156. /*------------------
  157. Load Theme
  158. -------------------*/
  159. /*******************************
  160. Site Settings
  161. *******************************/
  162. /*-------------------
  163. Paths
  164. --------------------*/
  165. /*-------------------
  166. Fonts
  167. --------------------*/
  168. /*-------------------
  169. Site Colors
  170. --------------------*/
  171. /*--- Colors ---*/
  172. /*--- Light Colors ---*/
  173. /*-------------------
  174. Page
  175. --------------------*/
  176. /*-------------------
  177. Background Colors
  178. --------------------*/
  179. /* Used for differentiating neutrals */
  180. /* Used for differentiating layers */
  181. /*-------------------
  182. Grid
  183. --------------------*/
  184. /*-------------------
  185. Breakpoints
  186. --------------------*/
  187. /*******************************
  188. Power-User
  189. *******************************/
  190. /*-------------------
  191. Icons
  192. --------------------*/
  193. /* Max Width of Icon */
  194. /*-------------------
  195. Easing
  196. --------------------*/
  197. /*--- Neutrals ---*/
  198. /*--- Colored Backgrounds ---*/
  199. /*--- Colored Text ---*/
  200. /*--- Colored Headers ---*/
  201. /*-------------------
  202. Emotive Colors
  203. --------------------*/
  204. /* Mood */
  205. /* Status */
  206. /*-------------------
  207. Neutral Text
  208. --------------------*/
  209. /*-------------------
  210. Brand Colors
  211. --------------------*/
  212. /*-------------------
  213. Borders
  214. --------------------*/
  215. /*-------------------
  216. Sizes
  217. --------------------*/
  218. /*-------------------
  219. Transitions
  220. --------------------*/
  221. /*-------------------
  222. Derived Values
  223. --------------------*/
  224. /* Makes sure padded grid can fit at 320px */
  225. /* Used to match floats with text */
  226. /* Positive / Negative Dupes */
  227. /* Header Colors */
  228. /* Responsive */
  229. /* Columns */
  230. /*******************************
  231. States
  232. *******************************/
  233. /*-------------------
  234. Disabled
  235. --------------------*/
  236. /*-------------------
  237. Hover
  238. --------------------*/
  239. /*--- Colors ---*/
  240. /*--- Emotive ---*/
  241. /*--- Neutrals ---*/
  242. /*-------------------
  243. Down (:active)
  244. --------------------*/
  245. /*--- Colors ---*/
  246. /*--- Emotive ---*/
  247. /*--- Neutrals ---*/
  248. /*-------------------
  249. Active
  250. --------------------*/
  251. /*--- Standard ---*/
  252. /*--- Emotive ---*/
  253. /*--- Neutrals ---*/
  254. /*******************************
  255. Nag
  256. *******************************/
  257. /*--------------
  258. Collection
  259. ---------------*/
  260. /*--------------
  261. Elements
  262. ---------------*/
  263. /* Title */
  264. /*--------------
  265. States
  266. ---------------*/
  267. /* Hover */
  268. /*--------------
  269. Variations
  270. ---------------*/
  271. /* Top / Bottom */
  272. /* Inverted */
  273. /*--------------
  274. Plural
  275. ---------------*/
  276. /*------------------
  277. Load Site
  278. -------------------*/
  279. /*******************************
  280. User Global Variables
  281. *******************************/
  282. /*******************************
  283. User Variable Overrides
  284. *******************************/
  285. /*------------------
  286. Override Loader
  287. -------------------*/
  288. /*******************************
  289. Nag
  290. *******************************/
  291. .ui.nag {
  292. display: none;
  293. opacity: 0.95;
  294. position: relative;
  295. top: 0em;
  296. left: 0px;
  297. z-index: 999;
  298. min-height: 0em;
  299. width: 100%;
  300. margin: 0em;
  301. padding: 0.75em 1em;
  302. background: #555555;
  303. box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.2);
  304. font-size: 1rem;
  305. text-align: center;
  306. color: rgba(0, 0, 0, 0.8);
  307. border-radius: 0em 0em 0.25em 0.25em;
  308. -webkit-transition: 0.2s background ease;
  309. transition: 0.2s background ease;
  310. }
  311. a.ui.nag {
  312. cursor: pointer;
  313. }
  314. .ui.nag > .title {
  315. display: inline-block;
  316. margin: 0em 0.5em;
  317. color: #ffffff;
  318. }
  319. .ui.nag > .close.icon {
  320. cursor: pointer;
  321. opacity: 0.4;
  322. position: absolute;
  323. top: 50%;
  324. right: 1em;
  325. font-size: 1em;
  326. margin: -0.5em 0em 0em;
  327. color: #ffffff;
  328. -webkit-transition: opacity 0.2s ease;
  329. transition: opacity 0.2s ease;
  330. }
  331. /*******************************
  332. States
  333. *******************************/
  334. /* Hover */
  335. .ui.nag:hover {
  336. background: #555555;
  337. opacity: 1;
  338. }
  339. .ui.nag .close:hover {
  340. opacity: 1;
  341. }
  342. /*******************************
  343. Variations
  344. *******************************/
  345. /*--------------
  346. Static
  347. ---------------*/
  348. .ui.overlay.nag {
  349. position: absolute;
  350. display: block;
  351. }
  352. /*--------------
  353. Fixed
  354. ---------------*/
  355. .ui.fixed.nag {
  356. position: fixed;
  357. }
  358. /*--------------
  359. Bottom
  360. ---------------*/
  361. .ui.bottom.nags,
  362. .ui.bottom.nag {
  363. border-radius: 0.25em 0.25em 0em 0em;
  364. top: auto;
  365. bottom: 0em;
  366. }
  367. /*--------------
  368. White
  369. ---------------*/
  370. .ui.inverted.nags .nag,
  371. .ui.inverted.nag {
  372. background-color: #f0f0f0;
  373. color: rgba(0, 0, 0, 0.85);
  374. }
  375. .ui.inverted.nags .nag .close,
  376. .ui.inverted.nags .nag .title,
  377. .ui.inverted.nag .close,
  378. .ui.inverted.nag .title {
  379. color: rgba(0, 0, 0, 0.4);
  380. }
  381. /*******************************
  382. Groups
  383. *******************************/
  384. .ui.nags .nag {
  385. border-radius: 0em !important;
  386. }
  387. .ui.nags .nag:last-child {
  388. border-radius: 0em 0em 0.25em 0.25em;
  389. }
  390. .ui.bottom.nags .nag:last-child {
  391. border-radius: 0.25em 0.25em 0em 0em;
  392. }
  393. /*******************************
  394. Overrides
  395. *******************************/
  396. /*******************************
  397. User Overrides
  398. *******************************/