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.

371 lines
24 KiB

10 years ago
10 years ago
10 years ago
  1. /*
  2. * # Semantic - Rating
  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 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. Rating
  132. *******************************/
  133. /*-------------------
  134. Types
  135. --------------------*/
  136. /* Star */
  137. /* Heart */
  138. /*-------------------
  139. States
  140. --------------------*/
  141. /*-------------------
  142. Variations
  143. --------------------*/
  144. /*------------------
  145. Load Theme
  146. -------------------*/
  147. /*------------------
  148. Load Site
  149. -------------------*/
  150. /*******************************
  151. User Global Variables
  152. *******************************/
  153. /*******************************
  154. Overrides
  155. *******************************/
  156. /*------------------
  157. Override Mix-in
  158. -------------------*/
  159. /*******************************
  160. Rating
  161. *******************************/
  162. .ui.rating {
  163. display: inline-block;
  164. font-size: 0em;
  165. vertical-align: baseline;
  166. margin: 0em 0.5rem 0em 0em;
  167. }
  168. .ui.rating:last-child {
  169. margin-right: 0em;
  170. }
  171. .ui.rating:before {
  172. display: block;
  173. content: '';
  174. visibility: hidden;
  175. clear: both;
  176. height: 0;
  177. }
  178. /* Icon */
  179. .ui.rating .icon {
  180. cursor: pointer;
  181. margin: 0em;
  182. width: 1.1em;
  183. text-align: center;
  184. height: auto;
  185. padding: 0em;
  186. font-weight: normal;
  187. font-style: normal;
  188. vertical-align: baseline;
  189. }
  190. /*******************************
  191. Types
  192. *******************************/
  193. /*-------------------
  194. Star
  195. --------------------*/
  196. /* Inactive */
  197. .ui.star.rating .icon {
  198. width: 1.1em;
  199. color: rgba(0, 0, 0, 0.15);
  200. }
  201. /* Active Star */
  202. .ui.star.rating .active.icon {
  203. color: #ffe623 !important;
  204. text-shadow: 0px -1px 0px #cfa300, -1px 0px 0px #cfa300, 0px 1px 0px #cfa300, 1px 0px 0px #cfa300;
  205. }
  206. /* Selected Star */
  207. .ui.star.rating .icon.selected,
  208. .ui.star.rating .icon.selected.active {
  209. color: #ffb70a !important;
  210. }
  211. .ui.star.rating.partial {
  212. position: relative;
  213. z-index: 1;
  214. }
  215. .ui.star.rating.partial:before {
  216. position: absolute;
  217. z-index: -1;
  218. }
  219. /*-------------------
  220. Heart
  221. --------------------*/
  222. .ui.heart.rating .icon {
  223. width: 1.25em;
  224. color: rgba(0, 0, 0, 0.15);
  225. }
  226. /* Active Heart */
  227. .ui.heart.rating .active.icon {
  228. color: #ff2733 !important;
  229. text-shadow: 0px -1px 0px #9e0000, -1px 0px 0px #9e0000, 0px 1px 0px #9e0000, 1px 0px 0px #9e0000;
  230. }
  231. /* Selected Heart */
  232. .ui.heart.rating .icon.selected,
  233. .ui.heart.rating .icon.selected.active {
  234. color: #ff2733 !important;
  235. }
  236. /*******************************
  237. States
  238. *******************************/
  239. /* Inactive Icon */
  240. .ui.rating .icon {
  241. color: rgba(0, 0, 0, 0.15);
  242. }
  243. /* Active Icon */
  244. .ui.rating .active.icon {
  245. color: rgba(0, 0, 0, 0.85);
  246. }
  247. /* Selected Icon */
  248. .ui.rating .icon.selected,
  249. .ui.rating .icon.selected.active {
  250. color: rgba(0, 0, 0, 0.8);
  251. }
  252. /*-------------------
  253. Disabled
  254. --------------------*/
  255. /* disabled rating */
  256. .ui.disabled.rating .icon {
  257. cursor: default;
  258. }
  259. /*-------------------
  260. Interacting (Active)
  261. --------------------*/
  262. /* Selected Rating */
  263. .ui.rating.selected .active.icon {
  264. opacity: 0.5;
  265. }
  266. .ui.rating.selected .icon.selected,
  267. .ui.rating .icon.selected {
  268. opacity: 1;
  269. }
  270. /*******************************
  271. Variations
  272. *******************************/
  273. .ui.mini.rating .icon {
  274. font-size: 0.7rem;
  275. }
  276. .ui.tiny.rating .icon {
  277. font-size: 0.8rem;
  278. }
  279. .ui.small.rating .icon {
  280. font-size: 0.875rem;
  281. }
  282. .ui.rating .icon {
  283. font-size: 1rem;
  284. }
  285. .ui.large.rating .icon {
  286. font-size: 1.1rem;
  287. }
  288. .ui.huge.rating .icon {
  289. font-size: 1.5rem;
  290. }
  291. .ui.massive.rating .icon {
  292. font-size: 2rem;
  293. }
  294. /* Realign */
  295. .ui.large.rating,
  296. .ui.huge.rating,
  297. .ui.massive.rating {
  298. vertical-align: middle;
  299. }
  300. /*******************************
  301. Overrides
  302. *******************************/
  303. @font-face {
  304. font-family: 'Rating';
  305. src: url(data:application/x-font-ttf;charset=utf-8;base64,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
  306. font-weight: normal;
  307. font-style: normal;
  308. }
  309. .ui.rating .icon {
  310. font-family: 'Rating';
  311. line-height: 1;
  312. height: 1em;
  313. -webkit-backface-visibility: hidden;
  314. backface-visibility: hidden;
  315. font-weight: normal;
  316. font-style: normal;
  317. text-align: center;
  318. }
  319. /* Empty Star */
  320. .ui.rating .icon:before {
  321. content: '\f006';
  322. }
  323. /* Active Star */
  324. .ui.rating .active.icon:before {
  325. content: '\f005';
  326. }
  327. /*-------------------
  328. Star
  329. --------------------*/
  330. /* Unfilled Star */
  331. .ui.star.rating .icon:before {
  332. content: '\f005';
  333. }
  334. /* Active Star */
  335. .ui.star.rating .active.icon:before {
  336. content: '\f005';
  337. }
  338. /* Partial */
  339. .ui.star.rating .partial.icon:before {
  340. content: '\f006';
  341. }
  342. .ui.star.rating .partial.icon {
  343. content: '\f005';
  344. }
  345. /*-------------------
  346. Heart
  347. --------------------*/
  348. /* Empty Heart
  349. .ui.heart.rating .icon:before {
  350. content: '\f08a';
  351. }
  352. */
  353. .ui.heart.rating .icon:before {
  354. content: '\f004';
  355. }
  356. /* Active */
  357. .ui.heart.rating .active.icon:before {
  358. content: '\f004';
  359. }
  360. /*******************************
  361. Overrides
  362. *******************************/