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.

1016 lines
23 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
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
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
  1. /*
  2. * # Semantic - Label
  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. /*-------------------
  53. Page
  54. --------------------*/
  55. /*-------------------
  56. Background Colors
  57. --------------------*/
  58. /* Used for differentiating neutrals */
  59. /* Used for differentiating layers */
  60. /*-------------------
  61. Grid
  62. --------------------*/
  63. /*-------------------
  64. Breakpoints
  65. --------------------*/
  66. /*******************************
  67. Power-User
  68. *******************************/
  69. /*-------------------
  70. Icons
  71. --------------------*/
  72. /* Max Width of Icon */
  73. /*-------------------
  74. Easing
  75. --------------------*/
  76. /*--- Light Variations ---*/
  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. Label
  132. *******************************/
  133. /*-------------------
  134. Element
  135. --------------------*/
  136. /* Group */
  137. /*-------------------
  138. Parts
  139. --------------------*/
  140. /*-------------------
  141. Types
  142. --------------------*/
  143. /* Image Label */
  144. /* Computed Values */
  145. /*-------------------
  146. States
  147. --------------------*/
  148. /*-------------------
  149. Variations
  150. --------------------*/
  151. /* Tag */
  152. /* Ribbon */
  153. /* Attached */
  154. /* Corner */
  155. /* Corner Text */
  156. /* Horizontal */
  157. /* Circular Padding */
  158. /* Pointing */
  159. /* Floating */
  160. /*-------------------
  161. Group
  162. --------------------*/
  163. /* Sizing */
  164. /*------------------
  165. Load Theme
  166. -------------------*/
  167. /*------------------
  168. Load Site
  169. -------------------*/
  170. /*******************************
  171. User Global Variables
  172. *******************************/
  173. /*******************************
  174. User Variable Overrides
  175. *******************************/
  176. /*------------------
  177. Override Mix-in
  178. -------------------*/
  179. /*******************************
  180. Label
  181. *******************************/
  182. .ui.label {
  183. display: inline-block;
  184. vertical-align: baseline;
  185. line-height: 1;
  186. margin: 0.25em 0.125em;
  187. background-color: #e8e8e8;
  188. border-color: #e8e8e8;
  189. background-image: none;
  190. padding: 0.6em 0.8em;
  191. color: rgba(0, 0, 0, 0.6);
  192. text-transform: none;
  193. font-weight: bold;
  194. border-radius: 0.325em;
  195. box-sizing: border-box;
  196. -webkit-transition: background 0.1s linear
  197. ;
  198. transition: background 0.1s linear
  199. ;
  200. }
  201. .ui.label:first-child {
  202. margin-left: 0em;
  203. }
  204. .ui.label:last-child {
  205. margin-right: 0em;
  206. }
  207. /* Link */
  208. a.ui.label {
  209. cursor: pointer;
  210. }
  211. /* Inside Link */
  212. .ui.label a {
  213. cursor: pointer;
  214. color: inherit;
  215. opacity: 0.8;
  216. -webkit-transition: 0.25s opacity ease;
  217. transition: 0.25s opacity ease;
  218. }
  219. .ui.label a:hover {
  220. opacity: 1;
  221. }
  222. /* Icon */
  223. .ui.label .icon {
  224. width: auto;
  225. margin: 0em 0.75em 0em 0em;
  226. }
  227. /* Detail */
  228. .ui.label .detail {
  229. display: inline-block;
  230. margin-left: 1em;
  231. font-weight: bold;
  232. opacity: 0.8;
  233. }
  234. .ui.label .detail .icon {
  235. margin: 0em 0.25em 0em 0em;
  236. }
  237. /* Removable label */
  238. .ui.label .close.icon,
  239. .ui.label .delete.icon {
  240. cursor: pointer;
  241. margin-right: 0em;
  242. margin-left: 0.5em;
  243. opacity: 0.8;
  244. -webkit-transition: background 0.1s linear
  245. ;
  246. transition: background 0.1s linear
  247. ;
  248. }
  249. .ui.label .delete.icon:hover {
  250. opacity: 1;
  251. }
  252. /*-------------------
  253. Group
  254. --------------------*/
  255. .ui.labels .label {
  256. margin: 0em 0.5em 0.75em 0em;
  257. }
  258. /*-------------------
  259. Coupling
  260. --------------------*/
  261. /* Padding on next content after a label */
  262. .ui.segment > .top.attached.label:first-child + * {
  263. margin-top: 2rem;
  264. }
  265. .ui.segment > .bottom.attached.label:first-child ~ :last-child {
  266. margin-top: 0em;
  267. margin-bottom: 2rem;
  268. }
  269. /*******************************
  270. Types
  271. *******************************/
  272. .ui.image.label {
  273. width: auto !important;
  274. margin-top: 0em;
  275. margin-bottom: 0em;
  276. max-width: 9999px;
  277. vertical-align: baseline;
  278. text-transform: none;
  279. background: #e8e8e8;
  280. padding: 0.6em 0.8em 0.6em 0.5em;
  281. border-radius: 0.325em;
  282. box-shadow: none;
  283. }
  284. .ui.image.label img {
  285. display: inline-block;
  286. vertical-align: top;
  287. height: 2.2em;
  288. margin: -0.6em 0.5em -0.6em -0.5em;
  289. border-radius: 0.325em;
  290. }
  291. .ui.image.label .detail {
  292. background: rgba(0, 0, 0, 0.1);
  293. margin: -0.6em -0.8em -0.6em 0.5em;
  294. padding: 0.6em 0.8em;
  295. border-radius: 0em 0.325em 0.325em 0em;
  296. }
  297. /*-------------------
  298. Tag
  299. --------------------*/
  300. .ui.tag.labels .label,
  301. .ui.tag.label {
  302. margin-left: 1em;
  303. position: relative;
  304. padding-left: 1.5em;
  305. padding-right: 1.5em;
  306. border-radius: 0em 0.325em 0.325em 0em;
  307. }
  308. .ui.tag.labels .label:before,
  309. .ui.tag.label:before {
  310. position: absolute;
  311. top: 50%;
  312. right: 100%;
  313. content: '';
  314. background-color: #e8e8e8;
  315. background-image: none;
  316. width: 1.56em;
  317. height: 1.56em;
  318. -webkit-transform: translateY(-50%) translateX(50%) rotate(-45deg);
  319. -ms-transform: translateY(-50%) translateX(50%) rotate(-45deg);
  320. transform: translateY(-50%) translateX(50%) rotate(-45deg);
  321. -webkit-transition: background 0.1s linear
  322. ;
  323. transition: background 0.1s linear
  324. ;
  325. }
  326. .ui.tag.labels .label:after,
  327. .ui.tag.label:after {
  328. position: absolute;
  329. content: '';
  330. top: 50%;
  331. left: -0.25em;
  332. margin-top: -0.25em;
  333. background-color: #ffffff !important;
  334. width: 0.5em;
  335. height: 0.5em;
  336. box-shadow: 0 -1px 1px 0 rgba(0, 0, 0, 0.3);
  337. border-radius: 500rem;
  338. }
  339. /*-------------------
  340. Corner Label
  341. --------------------*/
  342. .ui.corner.label {
  343. position: absolute;
  344. top: 0em;
  345. right: 0em;
  346. z-index: 10;
  347. margin: 0em;
  348. width: 3.25em;
  349. height: 3.25em;
  350. padding: 0em;
  351. text-align: center;
  352. -webkit-transition: color 0.25s ease;
  353. transition: color 0.25s ease;
  354. }
  355. /* Icon Label */
  356. .ui.corner.label {
  357. background-color: transparent !important;
  358. }
  359. .ui.corner.label:after {
  360. position: absolute;
  361. content: "";
  362. right: 0em;
  363. top: 0em;
  364. z-index: -1;
  365. width: 0em;
  366. height: 0em;
  367. background-color: transparent !important;
  368. border-top: 0em solid transparent;
  369. border-right: 3.25em solid transparent;
  370. border-bottom: 3.25em solid transparent;
  371. border-left: 0em solid transparent;
  372. border-right-color: inherit;
  373. -webkit-transition: border-color 0.25s ease;
  374. transition: border-color 0.25s ease;
  375. }
  376. .ui.corner.label .icon {
  377. position: relative;
  378. top: 0.4em;
  379. left: 0.75em;
  380. font-size: 1em;
  381. margin: 0em;
  382. }
  383. /* Text Label
  384. .ui.text.corner.label {
  385. font-weight: @cornerTextWeight;
  386. text-align: center;
  387. padding: 0.25em 0;
  388. top: 1.1em;
  389. transform: rotate(45deg);
  390. width: 4em;
  391. height: auto;
  392. }
  393. .ui.left.text.corner.label {
  394. transform: rotate(-45deg);
  395. }
  396. .ui.text.corner.label:before,
  397. .ui.text.corner.label:after {
  398. position: absolute;
  399. content: '';
  400. top: 0em;
  401. width: 0em;
  402. height: 0em;
  403. }
  404. .ui.text.corner.label:before {
  405. left: auto;
  406. right: 100%;
  407. border-top: 0em solid transparent;
  408. border-right-width: @ribbonTriangleSize;
  409. border-right-color: inherit;
  410. border-right-style: solid;
  411. border-bottom: @ribbonTriangleSize solid transparent;
  412. border-left: 0em solid transparent;
  413. }
  414. .ui.text.corner.label:after {
  415. left: 100%;
  416. right: auto;
  417. border-top: 0em solid transparent;
  418. border-right-width: @ribbonTriangleSize;
  419. border-right-color: inherit;
  420. border-right-style: solid;
  421. border-bottom: @ribbonTriangleSize solid transparent;
  422. border-left: 0em solid transparent;
  423. }
  424. */
  425. /* Left Corner */
  426. .ui.left.corner.label,
  427. .ui.left.corner.label:after {
  428. right: auto;
  429. left: 0em;
  430. }
  431. .ui.left.corner.label:after {
  432. border-top: 3.25em solid transparent;
  433. border-right: 3.25em solid transparent;
  434. border-bottom: 0em solid transparent;
  435. border-left: 0em solid transparent;
  436. border-top-color: inherit;
  437. }
  438. .ui.left.corner.label .icon {
  439. left: -0.75em;
  440. }
  441. /* Segment */
  442. .ui.segment > .ui.corner.label {
  443. top: -1px;
  444. right: -1px;
  445. }
  446. .ui.segment > .ui.left.corner.label {
  447. right: auto;
  448. left: -1px;
  449. }
  450. /* Input */
  451. .ui.input > .ui.corner.label {
  452. top: 1px;
  453. right: 1px;
  454. }
  455. .ui.input > .ui.right.corner.label {
  456. right: auto;
  457. left: 1px;
  458. }
  459. /*-------------------
  460. Ribbon
  461. --------------------*/
  462. .ui.ribbon.label {
  463. position: relative;
  464. margin: 0em;
  465. left: -2rem;
  466. padding-left: 2rem;
  467. border-radius: 0em 0.325em 0.325em 0em;
  468. border-color: rgba(0, 0, 0, 0.15);
  469. }
  470. .ui.ribbon.label:after {
  471. position: absolute;
  472. content: "";
  473. top: 100%;
  474. left: 0%;
  475. background-color: transparent !important;
  476. border-top: 0em solid transparent;
  477. border-right-width: 1.3em;
  478. border-right-color: inherit;
  479. border-right-style: solid;
  480. border-bottom: 1.3em solid transparent;
  481. border-left: 0em solid transparent;
  482. width: 0em;
  483. height: 0em;
  484. }
  485. /*-------------------
  486. Attached
  487. --------------------*/
  488. .ui.top.attached.label,
  489. .ui.attached.label {
  490. width: 100%;
  491. position: absolute;
  492. margin: 0em;
  493. top: 0em;
  494. left: 0em;
  495. padding: 0.75em 1em;
  496. border-radius: 0.325em 0.325em 0em 0em;
  497. }
  498. .ui.bottom.attached.label {
  499. top: auto;
  500. bottom: 0em;
  501. border-radius: 0em 0em 0.325em 0.325em;
  502. }
  503. .ui.top.left.attached.label {
  504. width: auto;
  505. margin-top: 0em !important;
  506. border-radius: 0.325em 0em 0.325em 0em;
  507. }
  508. .ui.top.right.attached.label {
  509. width: auto;
  510. left: auto;
  511. right: 0em;
  512. border-radius: 0em 0.325em 0em 0.325em;
  513. }
  514. .ui.bottom.left.attached.label {
  515. width: auto;
  516. top: auto;
  517. bottom: 0em;
  518. border-radius: 0em 0em 0.325em 0.325em;
  519. }
  520. .ui.bottom.right.attached.label {
  521. top: auto;
  522. bottom: 0em;
  523. left: auto;
  524. right: 0em;
  525. width: auto;
  526. border-radius: 0.325em 0em 0.325em 0em;
  527. }
  528. /*******************************
  529. States
  530. *******************************/
  531. /*-------------------
  532. Disabled
  533. --------------------*/
  534. .ui.label.disabled {
  535. opacity: 0.5;
  536. }
  537. /*-------------------
  538. Hover
  539. --------------------*/
  540. a.ui.labels .label:hover,
  541. a.ui.label:hover {
  542. background-color: #e0e0e0;
  543. border-color: #e0e0e0;
  544. background-image: none;
  545. color: rgba(0, 0, 0, 0.8);
  546. }
  547. .ui.labels a.label:hover:before,
  548. a.ui.label:hover:before {
  549. background-color: #e0e0e0;
  550. background-image: none;
  551. color: rgba(0, 0, 0, 0.8);
  552. }
  553. /*-------------------
  554. Visible
  555. --------------------*/
  556. .ui.labels.visible .label,
  557. .ui.label.visible {
  558. display: inline-block !important;
  559. }
  560. /*-------------------
  561. Hidden
  562. --------------------*/
  563. .ui.labels.hidden .label,
  564. .ui.label.hidden {
  565. display: none !important;
  566. }
  567. /*******************************
  568. Variations
  569. *******************************/
  570. /*-------------------
  571. Colors
  572. --------------------*/
  573. /*--- Black ---*/
  574. .ui.black.labels .label,
  575. .ui.black.label {
  576. background-color: #191919 !important;
  577. border-color: #191919 !important;
  578. color: #ffffff !important;
  579. }
  580. .ui.labels .black.label:before,
  581. .ui.black.labels .label:before,
  582. .ui.black.label:before {
  583. background-color: #191919 !important;
  584. }
  585. a.ui.black.labels .label:hover,
  586. a.ui.black.label:hover {
  587. background-color: #262626 !important;
  588. border-color: #262626 !important;
  589. }
  590. .ui.labels a.black.label:hover:before,
  591. .ui.black.labels a.label:hover:before,
  592. a.ui.black.label:hover:before {
  593. background-color: #262626 !important;
  594. }
  595. .ui.black.corner.label,
  596. .ui.black.corner.label:hover {
  597. background-color: transparent !important;
  598. }
  599. .ui.black.ribbon.label {
  600. border-color: #191919 !important;
  601. }
  602. /*--- Blue ---*/
  603. .ui.blue.labels .label,
  604. .ui.blue.label {
  605. background-color: #0074d9 !important;
  606. border-color: #0074d9 !important;
  607. color: #ffffff !important;
  608. }
  609. .ui.labels .blue.label:before,
  610. .ui.blue.labels .label:before,
  611. .ui.blue.label:before {
  612. background-color: #0074d9 !important;
  613. }
  614. a.ui.blue.labels .label:hover,
  615. .ui.blue.labels a.label:hover,
  616. a.ui.blue.label:hover {
  617. background-color: #0082f3 !important;
  618. border-color: #0082f3 !important;
  619. color: #ffffff !important;
  620. }
  621. .ui.labels a.blue.label:hover:before,
  622. .ui.blue.labels a.label:hover:before,
  623. a.ui.blue.label:hover:before {
  624. background-color: #0082f3 !important;
  625. }
  626. .ui.blue.corner.label,
  627. .ui.blue.corner.label:hover {
  628. background-color: transparent !important;
  629. }
  630. .ui.blue.ribbon.label {
  631. border-color: #0074d9 !important;
  632. }
  633. /*--- Green ---*/
  634. .ui.green.labels .label,
  635. .ui.green.label {
  636. background-color: #2ecc40 !important;
  637. border-color: #2ecc40 !important;
  638. color: #ffffff !important;
  639. }
  640. .ui.labels .green.label:before,
  641. .ui.green.labels .label:before,
  642. .ui.green.label:before {
  643. background-color: #2ecc40 !important;
  644. }
  645. a.ui.green.labels .label:hover,
  646. a.ui.green.label:hover {
  647. background-color: #40d451 !important;
  648. border-color: #40d451 !important;
  649. }
  650. .ui.labels a.green.label:hover:before,
  651. .ui.green.labels a.label:hover:before,
  652. a.ui.green.label:hover:before {
  653. background-color: #40d451 !important;
  654. }
  655. .ui.green.corner.label,
  656. .ui.green.corner.label:hover {
  657. background-color: transparent !important;
  658. }
  659. .ui.green.ribbon.label {
  660. border-color: #2ecc40 !important;
  661. }
  662. /*--- Orange ---*/
  663. .ui.orange.labels .label,
  664. .ui.orange.label {
  665. background-color: #ff851b !important;
  666. border-color: #ff851b !important;
  667. color: #ffffff !important;
  668. }
  669. .ui.labels .orange.label:before,
  670. .ui.orange.labels .label:before,
  671. .ui.orange.label:before {
  672. background-color: #ff851b !important;
  673. }
  674. a.ui.orange.labels .label:hover,
  675. .ui.orange.labels a.label:hover,
  676. a.ui.orange.label:hover {
  677. background-color: #ff9335 !important;
  678. border-color: #ff9335 !important;
  679. color: #ffffff !important;
  680. }
  681. .ui.labels a.orange.label:hover:before,
  682. .ui.orange.labels a.label:hover:before,
  683. a.ui.orange.label:hover:before {
  684. background-color: #ff9335 !important;
  685. }
  686. .ui.orange.corner.label,
  687. .ui.orange.corner.label:hover {
  688. background-color: transparent !important;
  689. }
  690. .ui.orange.ribbon.label {
  691. border-color: #ff851b !important;
  692. }
  693. /*--- Pink ---*/
  694. .ui.pink.labels .label,
  695. .ui.pink.label {
  696. background-color: #d9499a !important;
  697. border-color: #d9499a !important;
  698. color: #ffffff !important;
  699. }
  700. .ui.labels .pink.label:before,
  701. .ui.pink.labels .label:before,
  702. .ui.pink.label:before {
  703. background-color: #d9499a !important;
  704. }
  705. a.ui.pink.labels .label:hover,
  706. .ui.pink.labels a.label:hover,
  707. a.ui.pink.label:hover {
  708. background-color: #dd5ea6 !important;
  709. border-color: #dd5ea6 !important;
  710. color: #ffffff !important;
  711. }
  712. .ui.labels a.pink.label:hover:before,
  713. .ui.pink.labels a.label:hover:before,
  714. a.ui.pink.label:hover:before {
  715. background-color: #dd5ea6 !important;
  716. }
  717. .ui.pink.corner.label,
  718. .ui.pink.corner.label:hover {
  719. background-color: transparent !important;
  720. }
  721. .ui.pink.ribbon.label {
  722. border-color: #d9499a !important;
  723. }
  724. /*--- Purple ---*/
  725. .ui.purple.labels .label,
  726. .ui.purple.label {
  727. background-color: #a24096 !important;
  728. border-color: #a24096 !important;
  729. color: #ffffff !important;
  730. }
  731. .ui.labels .purple.label:before,
  732. .ui.purple.labels .label:before,
  733. .ui.purple.label:before {
  734. background-color: #a24096 !important;
  735. }
  736. a.ui.purple.labels .label:hover,
  737. .ui.purple.labels a.label:hover,
  738. a.ui.purple.label:hover {
  739. background-color: #b447a7 !important;
  740. border-color: #b447a7 !important;
  741. color: #ffffff !important;
  742. }
  743. .ui.labels a.purple.label:hover:before,
  744. .ui.purple.labels a.label:hover:before,
  745. a.ui.purple.label:hover:before {
  746. background-color: #b447a7 !important;
  747. }
  748. .ui.purple.corner.label,
  749. .ui.purple.corner.label:hover {
  750. background-color: transparent !important;
  751. }
  752. .ui.purple.ribbon.label {
  753. border-color: #a24096 !important;
  754. }
  755. /*--- Red ---*/
  756. .ui.red.labels .label,
  757. .ui.red.label {
  758. background-color: #ff4136 !important;
  759. border-color: #ff4136 !important;
  760. color: #ffffff !important;
  761. }
  762. .ui.labels .red.label:before,
  763. .ui.red.labels .label:before,
  764. .ui.red.label:before {
  765. background-color: #ff4136 !important;
  766. }
  767. .ui.red.corner.label,
  768. .ui.red.corner.label:hover {
  769. background-color: transparent !important;
  770. }
  771. a.ui.red.labels .label:hover,
  772. a.ui.red.label:hover {
  773. background-color: #ff5950 !important;
  774. border-color: #ff5950 !important;
  775. color: #ffffff !important;
  776. }
  777. .ui.labels a.red.label:hover:before,
  778. .ui.red.labels a.label:hover:before,
  779. a.ui.red.label:hover:before {
  780. background-color: #ff5950 !important;
  781. }
  782. .ui.red.ribbon.label {
  783. border-color: #ff4136 !important;
  784. }
  785. /*--- Teal ---*/
  786. .ui.teal.labels .label,
  787. .ui.teal.label {
  788. background-color: #39cccc !important;
  789. border-color: #39cccc !important;
  790. color: #ffffff !important;
  791. }
  792. .ui.labels .teal.label:before,
  793. .ui.teal.labels .label:before,
  794. .ui.teal.label:before {
  795. background-color: #39cccc !important;
  796. }
  797. a.ui.teal.labels .label:hover,
  798. .ui.teal.labels a.label:hover,
  799. a.ui.teal.label:hover {
  800. background-color: #4dd1d1 !important;
  801. border-color: #4dd1d1 !important;
  802. color: #ffffff !important;
  803. }
  804. .ui.labels a.teal.label:hover:before,
  805. .ui.teal.labels a.label:hover:before,
  806. a.ui.teal.label:hover:before {
  807. background-color: #4dd1d1 !important;
  808. }
  809. .ui.teal.corner.label,
  810. .ui.teal.corner.label:hover {
  811. background-color: transparent !important;
  812. }
  813. .ui.teal.ribbon.label {
  814. border-color: #39cccc !important;
  815. }
  816. /*--- Yellow ---*/
  817. .ui.yellow.labels .label,
  818. .ui.yellow.label {
  819. background-color: #ffcb08 !important;
  820. border-color: #ffcb08 !important;
  821. color: #ffffff !important;
  822. }
  823. .ui.labels .yellow.label:before,
  824. .ui.yellow.labels .label:before,
  825. .ui.yellow.label:before {
  826. background-color: #ffcb08 !important;
  827. }
  828. a.ui.yellow.labels .label:hover,
  829. .ui.yellow.labels a.label:hover,
  830. a.ui.yellow.label:hover {
  831. background-color: #ffd021 !important;
  832. border-color: #ffd021 !important;
  833. color: #ffffff !important;
  834. }
  835. .ui.labels a.yellow.label:hover:before,
  836. .ui.yellow.labels a.label:hover:before,
  837. a.ui.yellow.label:hover:before {
  838. background-color: #ffd021 !important;
  839. }
  840. .ui.yellow.corner.label,
  841. .ui.yellow.corner.label:hover {
  842. background-color: transparent !important;
  843. }
  844. .ui.yellow.ribbon.label {
  845. border-color: #ffcb08 !important;
  846. }
  847. /*-------------------
  848. Fluid
  849. --------------------*/
  850. .ui.label.fluid,
  851. .ui.fluid.labels > .label {
  852. width: 100%;
  853. box-sizing: border-box;
  854. }
  855. /*-------------------
  856. Inverted
  857. --------------------*/
  858. .ui.inverted.labels .label,
  859. .ui.inverted.label {
  860. color: #ffffff !important;
  861. }
  862. /*-------------------
  863. Horizontal
  864. --------------------*/
  865. .ui.horizontal.labels .label,
  866. .ui.horizontal.label {
  867. margin: 0em 0.5em 0em 0em;
  868. padding: 0.4em 0.8em;
  869. min-width: 3em;
  870. text-align: center;
  871. }
  872. /*-------------------
  873. Circular
  874. --------------------*/
  875. .ui.circular.labels .label,
  876. .ui.circular.label {
  877. min-width: 2em;
  878. min-height: 2em;
  879. padding: 0.5em !important;
  880. line-height: 1em;
  881. text-align: center;
  882. border-radius: 500rem;
  883. }
  884. .ui.empty.circular.labels .label,
  885. .ui.empty.circular.label {
  886. min-width: 0.5em;
  887. min-height: 0.5em;
  888. vertical-align: middle;
  889. }
  890. /*-------------------
  891. Pointing
  892. --------------------*/
  893. .ui.pointing.label {
  894. position: relative;
  895. }
  896. .ui.attached.pointing.label {
  897. position: absolute;
  898. }
  899. .ui.pointing.label:before {
  900. position: absolute;
  901. content: '';
  902. width: 0.6em;
  903. height: 0.6em;
  904. background-image: none;
  905. -webkit-transform: rotate(45deg);
  906. -ms-transform: rotate(45deg);
  907. transform: rotate(45deg);
  908. z-index: 2;
  909. -webkit-transition: background 0.1s linear
  910. ;
  911. transition: background 0.1s linear
  912. ;
  913. }
  914. /*--- Above ---*/
  915. .ui.pointing.label:before {
  916. background-color: #e8e8e8;
  917. background-image: none;
  918. }
  919. .ui.pointing.label,
  920. .ui.pointing.above.label {
  921. margin-top: 1em;
  922. }
  923. .ui.pointing.label:before,
  924. .ui.pointing.above.label:before {
  925. margin-left: -0.3em;
  926. top: -0.3em;
  927. left: 50%;
  928. }
  929. /*--- Below ---*/
  930. .ui.pointing.below.label {
  931. margin-top: 0em;
  932. margin-bottom: 1em;
  933. }
  934. .ui.pointing.below.label:before {
  935. margin-left: -0.3em;
  936. top: auto;
  937. right: auto;
  938. bottom: -0.3em;
  939. left: 50%;
  940. }
  941. /*--- Left ---*/
  942. .ui.pointing.left.label {
  943. margin-top: 0em;
  944. margin-left: 1em;
  945. }
  946. .ui.pointing.left.label:before {
  947. margin-top: -0.3em;
  948. bottom: auto;
  949. right: auto;
  950. top: 50%;
  951. left: 0em;
  952. }
  953. /*--- Right ---*/
  954. .ui.pointing.right.label {
  955. margin-top: 0em;
  956. margin-right: 1em;
  957. }
  958. .ui.pointing.right.label:before {
  959. margin-top: -0.3em;
  960. right: -0.3em;
  961. top: 50%;
  962. bottom: auto;
  963. left: auto;
  964. }
  965. /*------------------
  966. Floating Label
  967. -------------------*/
  968. .ui.floating.label {
  969. position: absolute;
  970. z-index: 100;
  971. top: -1em;
  972. left: 100%;
  973. margin: 0em 0em 0em -1.5em !important;
  974. }
  975. /*-------------------
  976. Sizes
  977. --------------------*/
  978. .ui.mini.labels .label,
  979. .ui.mini.label {
  980. font-size: 0.7rem;
  981. }
  982. .ui.tiny.labels .label,
  983. .ui.tiny.label {
  984. font-size: 0.75rem;
  985. }
  986. .ui.small.labels .label,
  987. .ui.small.label {
  988. font-size: 0.8rem;
  989. }
  990. .ui.labels .label,
  991. .ui.label {
  992. font-size: 0.875rem;
  993. }
  994. .ui.large.labels .label,
  995. .ui.large.label {
  996. font-size: 1rem;
  997. }
  998. .ui.huge.labels .label,
  999. .ui.huge.label {
  1000. font-size: 1.25rem;
  1001. }
  1002. /*******************************
  1003. Overrides
  1004. *******************************/
  1005. /*******************************
  1006. Overrides
  1007. *******************************/