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.

1104 lines
26 KiB

9 years ago
9 years ago
9 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
9 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
9 years ago
10 years ago
9 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
9 years ago
10 years ago
10 years ago
10 years ago
10 years ago
9 years ago
10 years ago
10 years ago
9 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
9 years ago
10 years ago
10 years ago
10 years ago
10 years ago
9 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
9 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
9 years ago
9 years ago
9 years ago
9 years ago
9 years ago
9 years ago
9 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
9 years ago
10 years ago
9 years ago
10 years ago
10 years ago
9 years ago
10 years ago
9 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
9 years ago
10 years ago
9 years ago
9 years ago
9 years ago
9 years ago
9 years ago
9 years ago
9 years ago
9 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
9 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
9 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
9 years ago
9 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 UI 1.12.3 - Dropdown
  3. * http://github.com/semantic-org/semantic-ui/
  4. *
  5. *
  6. * Copyright 2014 Contributors
  7. * Released under the MIT license
  8. * http://opensource.org/licenses/MIT
  9. *
  10. */
  11. /*******************************
  12. Dropdown
  13. *******************************/
  14. .ui.dropdown {
  15. cursor: pointer;
  16. position: relative;
  17. display: inline-block;
  18. line-height: 1em;
  19. tap-highlight-color: rgba(0, 0, 0, 0);
  20. outline: none;
  21. text-align: left;
  22. -webkit-transition: border-radius 0.1s ease, width 0.2s ease;
  23. transition: border-radius 0.1s ease, width 0.2s ease;
  24. }
  25. /*******************************
  26. Content
  27. *******************************/
  28. /*--------------
  29. Menu
  30. ---------------*/
  31. .ui.dropdown .menu {
  32. cursor: auto;
  33. position: absolute;
  34. display: none;
  35. outline: none;
  36. top: 100%;
  37. margin: 0em;
  38. padding: 0em 0em;
  39. background: #ffffff;
  40. min-width: 100%;
  41. white-space: nowrap;
  42. font-size: 1rem;
  43. text-shadow: none;
  44. text-align: left;
  45. box-shadow: 0px 1px 4px 0px rgba(39, 41, 43, 0.15);
  46. border: 1px solid rgba(39, 41, 43, 0.15);
  47. border-radius: 0em 0em 0.2857rem 0.2857rem;
  48. -webkit-transition: opacity 0.2s ease;
  49. transition: opacity 0.2s ease;
  50. z-index: 11;
  51. will-change: transform, opacity;
  52. }
  53. /*--------------
  54. Hidden Input
  55. ---------------*/
  56. .ui.dropdown > input:not(.search):first-child,
  57. .ui.dropdown > select {
  58. display: none !important;
  59. }
  60. /*--------------
  61. Dropdown Icon
  62. ---------------*/
  63. .ui.dropdown > .dropdown.icon {
  64. width: auto;
  65. margin: 0em 0em 0em 1em;
  66. }
  67. .ui.dropdown .menu > .item .dropdown.icon {
  68. width: auto;
  69. float: right;
  70. margin: 0em 0em 0em 1em;
  71. }
  72. .ui.dropdown .menu > .item .dropdown.icon + .text {
  73. margin-right: 1em;
  74. }
  75. /*--------------
  76. Text
  77. ---------------*/
  78. .ui.dropdown > .text {
  79. display: inline-block;
  80. -webkit-transition: color 0.2s ease;
  81. transition: color 0.2s ease;
  82. }
  83. /*--------------
  84. Menu Item
  85. ---------------*/
  86. .ui.dropdown .menu > .item {
  87. position: relative;
  88. cursor: pointer;
  89. display: block;
  90. border: none;
  91. height: auto;
  92. border-top: none;
  93. line-height: 1em;
  94. color: rgba(0, 0, 0, 0.8);
  95. padding: 0.71428571em 1.14285714em !important;
  96. font-size: 1rem;
  97. text-transform: none;
  98. font-weight: normal;
  99. box-shadow: none;
  100. -webkit-touch-callout: none;
  101. }
  102. .ui.dropdown .menu > .item:first-child {
  103. border-top-width: 0px;
  104. }
  105. /*--------------
  106. Floated Content
  107. ---------------*/
  108. .ui.dropdown > .text > [class*="right floated"],
  109. .ui.dropdown .menu .item > [class*="right floated"] {
  110. float: right !important;
  111. margin-right: 0em !important;
  112. margin-left: 1em !important;
  113. }
  114. .ui.dropdown > .text > [class*="left floated"],
  115. .ui.dropdown .menu .item > [class*="left floated"] {
  116. float: left !important;
  117. margin-left: 0em !important;
  118. margin-right: 1em !important;
  119. }
  120. .ui.dropdown .menu .item > .icon.floated,
  121. .ui.dropdown .menu .item > .flag.floated,
  122. .ui.dropdown .menu .item > .image.floated,
  123. .ui.dropdown .menu .item > img.floated {
  124. margin-top: 0em;
  125. }
  126. /*--------------
  127. Menu Divider
  128. ---------------*/
  129. .ui.dropdown .menu > .header {
  130. margin: 1rem 0rem 0.75rem;
  131. padding: 0em 1.14285714em;
  132. color: rgba(0, 0, 0, 0.85);
  133. font-size: 0.7857rem;
  134. font-weight: bold;
  135. text-transform: uppercase;
  136. }
  137. .ui.dropdown .menu > .divider {
  138. border-top: 1px solid rgba(0, 0, 0, 0.05);
  139. height: 0em;
  140. margin: 0.5em 0em;
  141. }
  142. .ui.dropdown .menu > .input {
  143. margin: 0.75rem 1.14285714em;
  144. min-width: 200px;
  145. }
  146. .ui.dropdown .menu > .header + .input {
  147. margin-top: 0em;
  148. }
  149. .ui.dropdown .menu > .input:not(.transparent) input {
  150. padding: 0.5em 1em;
  151. }
  152. .ui.dropdown .menu > .input:not(.transparent) .button,
  153. .ui.dropdown .menu > .input:not(.transparent) .icon,
  154. .ui.dropdown .menu > .input:not(.transparent) .label {
  155. padding-top: 0.5em;
  156. padding-bottom: 0.5em;
  157. }
  158. /*-----------------
  159. Item Description
  160. -------------------*/
  161. .ui.dropdown > .text > .description,
  162. .ui.dropdown .menu > .item > .description {
  163. margin: 0em 0em 0em 1em;
  164. color: rgba(0, 0, 0, 0.4);
  165. }
  166. /*--------------
  167. Sub Menu
  168. ---------------*/
  169. .ui.dropdown .menu .menu {
  170. top: 0% !important;
  171. left: 100% !important;
  172. right: auto !important;
  173. margin: 0em 0em 0em -0.5em !important;
  174. border-radius: 0em 0.2857rem 0.2857rem 0em !important;
  175. z-index: 21 !important;
  176. }
  177. /* Hide Arrow */
  178. .ui.dropdown .menu .menu:after {
  179. display: none;
  180. }
  181. /*******************************
  182. Coupling
  183. *******************************/
  184. /*--------------
  185. Sub Elements
  186. ---------------*/
  187. /* Icons / Flags / Labels / Image */
  188. .ui.dropdown > .text > .icon,
  189. .ui.dropdown > .text > .label,
  190. .ui.dropdown > .text > .flag,
  191. .ui.dropdown > .text > img,
  192. .ui.dropdown > .text > .image {
  193. margin-top: 0em;
  194. }
  195. .ui.dropdown .menu > .item > .icon,
  196. .ui.dropdown .menu > .item > .label,
  197. .ui.dropdown .menu > .item > .flag,
  198. .ui.dropdown .menu > .item > .image,
  199. .ui.dropdown .menu > .item > img {
  200. margin-top: 0em;
  201. }
  202. .ui.dropdown > .text > .icon,
  203. .ui.dropdown > .text > .label,
  204. .ui.dropdown > .text > .flag,
  205. .ui.dropdown > .text > img,
  206. .ui.dropdown > .text > .image,
  207. .ui.dropdown .menu > .item > .icon,
  208. .ui.dropdown .menu > .item > .label,
  209. .ui.dropdown .menu > .item > .flag,
  210. .ui.dropdown .menu > .item > .image,
  211. .ui.dropdown .menu > .item > img {
  212. margin-left: 0em;
  213. float: none;
  214. margin-right: 0.75em;
  215. }
  216. /*--------------
  217. Image
  218. ---------------*/
  219. .ui.dropdown > .text > img,
  220. .ui.dropdown > .text > .image,
  221. .ui.dropdown .menu > .item > .image,
  222. .ui.dropdown .menu > .item > img {
  223. display: inline-block;
  224. vertical-align: middle;
  225. width: auto;
  226. max-height: 2.5em;
  227. }
  228. /*--------------
  229. Menu
  230. ---------------*/
  231. /* Remove Menu Item Divider */
  232. .ui.dropdown .ui.menu > .item:before,
  233. .ui.menu .ui.dropdown .menu > .item:before {
  234. display: none;
  235. }
  236. /* Prevent Menu Item Border */
  237. .ui.menu .ui.dropdown .menu .active.item {
  238. border-left: none;
  239. }
  240. /* Automatically float dropdown menu right on last menu item */
  241. .ui.menu .right.menu .dropdown:last-child .menu,
  242. .ui.menu .right.dropdown.item .menu,
  243. .ui.buttons > .ui.dropdown:last-child .menu {
  244. left: auto;
  245. right: 0em;
  246. }
  247. /*--------------
  248. Button
  249. ---------------*/
  250. /* No Margin On Icon Button */
  251. .ui.dropdown.icon.button > .dropdown.icon {
  252. margin: 0em;
  253. }
  254. .ui.dropdown.button:not(.pointing):not(.floating).active,
  255. .ui.dropdown.button:not(.pointing):not(.floating).visible {
  256. border-bottom-left-radius: 0em;
  257. border-bottom-right-radius: 0em;
  258. }
  259. /*******************************
  260. Types
  261. *******************************/
  262. /*--------------
  263. Selection
  264. ---------------*/
  265. /* Displays like a select box */
  266. .ui.selection.dropdown {
  267. cursor: pointer;
  268. word-wrap: break-word;
  269. white-space: normal;
  270. outline: 0;
  271. -webkit-transform: rotateZ(0deg);
  272. transform: rotateZ(0deg);
  273. min-width: 180px;
  274. background: #ffffff;
  275. display: inline-block;
  276. padding: 0.8em 1.1em;
  277. color: rgba(0, 0, 0, 0.8);
  278. box-shadow: none;
  279. border: 1px solid rgba(39, 41, 43, 0.15);
  280. border-radius: 0.2857rem;
  281. -webkit-transition: border-radius 0.1s ease, width 0.2s ease, box-shadow 0.2s ease, border 0.2s ease;
  282. transition: border-radius 0.1s ease, width 0.2s ease, box-shadow 0.2s ease, border 0.2s ease;
  283. }
  284. .ui.selection.dropdown.visible,
  285. .ui.selection.dropdown.active {
  286. z-index: 10;
  287. }
  288. select.ui.dropdown {
  289. height: 38px;
  290. padding: 0.5em;
  291. border: 1px solid rgba(39, 41, 43, 0.15);
  292. visibility: visible;
  293. }
  294. .ui.selection.dropdown > .text {
  295. margin-right: 2em;
  296. }
  297. .ui.selection.dropdown > .search.icon,
  298. .ui.selection.dropdown > .delete.icon,
  299. .ui.selection.dropdown > .dropdown.icon {
  300. cursor: pointer;
  301. position: absolute;
  302. top: auto;
  303. width: auto;
  304. margin: -0.8em;
  305. padding: 0.8em;
  306. right: 1.1em;
  307. opacity: 0.8;
  308. -webkit-transition: opacity 0.2s ease;
  309. transition: opacity 0.2s ease;
  310. }
  311. /* Compact */
  312. .ui.compact.selection.dropdown {
  313. min-width: 0px;
  314. }
  315. /* Selection Menu */
  316. .ui.selection.dropdown .menu {
  317. overflow-x: hidden;
  318. overflow-y: auto;
  319. -webkit-backface-visibility: hidden;
  320. backface-visibility: hidden;
  321. -webkit-overflow-scrolling: touch;
  322. border-top-width: 0px !important;
  323. width: auto;
  324. margin: 0px -1px;
  325. min-width: -webkit-calc(100% + 2px );
  326. min-width: calc(100% + 2px );
  327. outline: none;
  328. box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.08);
  329. -webkit-transition: box-shadow 0.2s ease, border 0.2s ease;
  330. transition: box-shadow 0.2s ease, border 0.2s ease;
  331. }
  332. .ui.selection.dropdown .menu:after,
  333. .ui.selection.dropdown .menu:before {
  334. display: none;
  335. }
  336. /* Scrollbar in IE */
  337. @media all and (-ms-high-contrast: none) {
  338. .ui.selection.dropdown .menu {
  339. min-width: -webkit-calc(100% - 15px );
  340. min-width: calc(100% - 15px );
  341. }
  342. }
  343. @media only screen and (max-width: 767px) {
  344. .ui.selection.dropdown .menu {
  345. max-height: 7.49991429em;
  346. }
  347. }
  348. @media only screen and (min-width: 768px) {
  349. .ui.selection.dropdown .menu {
  350. max-height: 9.99988571em;
  351. }
  352. }
  353. @media only screen and (min-width: 992px) {
  354. .ui.selection.dropdown .menu {
  355. max-height: 14.99982857em;
  356. }
  357. }
  358. @media only screen and (min-width: 1920px) {
  359. .ui.selection.dropdown .menu {
  360. max-height: 19.99977143em;
  361. }
  362. }
  363. /* Menu Item */
  364. .ui.selection.dropdown .menu > .item {
  365. border-top: 1px solid rgba(0, 0, 0, 0.05);
  366. padding: 0.71428571em 1.14285714em !important;
  367. white-space: normal;
  368. word-wrap: normal;
  369. }
  370. /* Hover */
  371. .ui.selection.dropdown:hover {
  372. border-color: rgba(39, 41, 43, 0.3);
  373. box-shadow: 0px 0px 2px 0px rgba(0, 0, 0, 0.05);
  374. }
  375. /* Disabled */
  376. .ui.selection.dropdown.disabled,
  377. .ui.selection.dropdown.disabled:hover {
  378. cursor: default;
  379. box-shadow: none;
  380. color: rgba(0, 0, 0, 0.8);
  381. border: 1px solid rgba(39, 41, 43, 0.15);
  382. opacity: 0.3 !important;
  383. }
  384. /* Visible */
  385. .ui.selection.dropdown.visible {
  386. border-color: rgba(39, 41, 43, 0.3);
  387. box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.08);
  388. }
  389. .ui.selection.visible.dropdown .menu {
  390. border-color: rgba(39, 41, 43, 0.3);
  391. box-shadow: 0px 2px 6px 0px rgba(39, 41, 43, 0.15);
  392. }
  393. /* Visible Hover */
  394. .ui.selection.visible.dropdown:hover {
  395. border-color: rgba(39, 41, 43, 0.3);
  396. box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.08);
  397. }
  398. .ui.selection.visible.dropdown .menu {
  399. border-color: rgba(39, 41, 43, 0.3);
  400. box-shadow: 0px 2px 6px 0px rgba(39, 41, 43, 0.15);
  401. }
  402. /* Active Item */
  403. .ui.selection.active.dropdown > .text:not(.default),
  404. .ui.selection.visible.dropdown > .text:not(.default) {
  405. font-weight: normal;
  406. color: rgba(0, 0, 0, 0.8);
  407. }
  408. /* Dropdown Icon */
  409. .ui.active.selection.dropdown > .dropdown.icon,
  410. .ui.visible.selection.dropdown > .dropdown.icon {
  411. opacity: 1;
  412. z-index: 3;
  413. }
  414. /* Connecting Border */
  415. .ui.active.selection.dropdown,
  416. .ui.visible.selection.dropdown {
  417. border-bottom-left-radius: 0em !important;
  418. border-bottom-right-radius: 0em !important;
  419. }
  420. /*--------------
  421. Searchable
  422. ---------------*/
  423. /* Search Selection */
  424. .ui.search.dropdown {
  425. min-width: '';
  426. }
  427. /* Search Dropdown */
  428. .ui.search.dropdown > input.search {
  429. background: none transparent !important;
  430. border: none !important;
  431. box-shadow: none !important;
  432. border-radius: 0em !important;
  433. cursor: pointer;
  434. top: 0em;
  435. left: 0em;
  436. width: 100%;
  437. outline: none;
  438. -webkit-tap-highlight-color: rgba(255, 255, 255, 0);
  439. padding: inherit;
  440. }
  441. /* Text Layering */
  442. .ui.search.dropdown > input.search {
  443. position: absolute;
  444. z-index: 2;
  445. }
  446. .ui.search.dropdown > .text {
  447. cursor: text;
  448. position: relative;
  449. z-index: 3;
  450. }
  451. /* Search Selection */
  452. .ui.search.selection.dropdown > input.search {
  453. line-height: 1.2142em;
  454. padding: 0.6929em 1.1em;
  455. }
  456. /* Active/Visible Search */
  457. .ui.search.dropdown.active > input.search,
  458. .ui.search.dropdown.visible > input.search {
  459. cursor: auto;
  460. }
  461. .ui.search.dropdown.active > .text,
  462. .ui.search.dropdown.visible > .text {
  463. pointer-events: none;
  464. }
  465. .ui.active.search.dropdown > input.search:focus + .text {
  466. color: rgba(0, 0, 0, 0.4) !important;
  467. }
  468. /* Search Menu */
  469. .ui.search.dropdown .menu {
  470. overflow-x: hidden;
  471. overflow-y: auto;
  472. -webkit-backface-visibility: hidden;
  473. backface-visibility: hidden;
  474. -webkit-overflow-scrolling: touch;
  475. }
  476. @media only screen and (max-width: 767px) {
  477. .ui.search.dropdown .menu {
  478. max-height: 7.49991429em;
  479. }
  480. }
  481. @media only screen and (min-width: 768px) {
  482. .ui.search.dropdown .menu {
  483. max-height: 9.99988571em;
  484. }
  485. }
  486. @media only screen and (min-width: 992px) {
  487. .ui.search.dropdown .menu {
  488. max-height: 14.99982857em;
  489. }
  490. }
  491. @media only screen and (min-width: 1920px) {
  492. .ui.search.dropdown .menu {
  493. max-height: 19.99977143em;
  494. }
  495. }
  496. /*--------------
  497. Inline
  498. ---------------*/
  499. .ui.inline.dropdown {
  500. cursor: pointer;
  501. display: inline-block;
  502. color: inherit;
  503. }
  504. .ui.inline.dropdown .dropdown.icon {
  505. margin: 0em 0.5em 0em 0.25em;
  506. vertical-align: top;
  507. }
  508. .ui.inline.dropdown > .text {
  509. font-weight: bold;
  510. }
  511. .ui.inline.dropdown .menu {
  512. cursor: auto;
  513. margin-top: 0.25em;
  514. border-radius: 0.2857rem;
  515. }
  516. /*******************************
  517. States
  518. *******************************/
  519. /*--------------------
  520. Hover
  521. ----------------------*/
  522. /* Menu Item Hover */
  523. .ui.dropdown .menu > .item:hover {
  524. background: rgba(0, 0, 0, 0.05);
  525. color: rgba(0, 0, 0, 0.8);
  526. z-index: 13;
  527. }
  528. /*--------------------
  529. Active
  530. ----------------------*/
  531. /* Menu Item Active */
  532. .ui.dropdown .menu .active.item {
  533. background: transparent;
  534. font-weight: bold;
  535. color: rgba(0, 0, 0, 0.8);
  536. box-shadow: none;
  537. z-index: 12;
  538. }
  539. /*--------------------
  540. Default Text
  541. ----------------------*/
  542. .ui.dropdown > .default.text,
  543. .ui.default.dropdown > .text {
  544. color: rgba(179, 179, 179, 0.7);
  545. }
  546. .ui.dropdown:hover > .default.text,
  547. .ui.default.dropdown:hover > .text {
  548. color: rgba(140, 140, 140, 0.7);
  549. }
  550. /*--------------------
  551. Loading
  552. ----------------------*/
  553. .ui.loading.dropdown > .text {
  554. -webkit-transition: none;
  555. transition: none;
  556. }
  557. .ui.dropdown > .loading.menu {
  558. display: block;
  559. visibility: hidden;
  560. z-index: -1;
  561. }
  562. /*--------------------
  563. Keyboard Select
  564. ----------------------*/
  565. /* Selected Item */
  566. .ui.dropdown.selected,
  567. .ui.dropdown .menu .selected.item {
  568. background: rgba(0, 0, 0, 0.03);
  569. color: rgba(0, 0, 0, 0.8);
  570. }
  571. /*--------------------
  572. Search Filtered
  573. ----------------------*/
  574. /* Filtered Item */
  575. .ui.dropdown > .filtered.text {
  576. visibility: hidden;
  577. }
  578. .ui.dropdown .filtered.item {
  579. display: none !important;
  580. }
  581. /*--------------------
  582. Error
  583. ----------------------*/
  584. .ui.dropdown.error,
  585. .ui.dropdown.error > .text,
  586. .ui.dropdown.error > .default.text {
  587. color: #a94442;
  588. }
  589. .ui.selection.dropdown.error {
  590. background: #fff0f0;
  591. border-color: #dbb1b1;
  592. }
  593. .ui.selection.dropdown.error:hover {
  594. border-color: #dbb1b1;
  595. }
  596. .ui.dropdown.error > .menu,
  597. .ui.dropdown.error > .menu .menu {
  598. border-color: #dbb1b1;
  599. }
  600. .ui.dropdown.error > .menu > .item {
  601. color: #d95c5c;
  602. }
  603. /* Item Hover */
  604. .ui.dropdown.error > .menu > .item:hover {
  605. background-color: #fff2f2;
  606. }
  607. /* Item Active */
  608. .ui.dropdown.error > .menu .active.item {
  609. background-color: #fdcfcf;
  610. }
  611. /*--------------------
  612. Disabled
  613. ----------------------*/
  614. /* Disabled */
  615. .ui.disabled.dropdown {
  616. cursor: default;
  617. pointer-events: none;
  618. opacity: 0.3;
  619. }
  620. /*******************************
  621. Variations
  622. *******************************/
  623. /*--------------
  624. Direction
  625. ---------------*/
  626. /* Flyout Direction */
  627. .ui.dropdown .menu {
  628. left: 0px;
  629. }
  630. /* Default Side (Right) */
  631. .ui.dropdown .right.menu > .menu,
  632. .ui.dropdown .menu .right.menu {
  633. left: 100% !important;
  634. right: auto !important;
  635. }
  636. /* Left Flyout Menu */
  637. .ui.dropdown > .left.menu .menu,
  638. .ui.dropdown .menu .left.menu {
  639. left: auto !important;
  640. right: 100% !important;
  641. }
  642. .ui.dropdown .item .left.dropdown.icon,
  643. .ui.dropdown .left.menu .item .dropdown.icon {
  644. width: auto;
  645. float: left;
  646. margin: 0em 0.75em 0em 0em;
  647. }
  648. .ui.dropdown .item .left.dropdown.icon,
  649. .ui.dropdown .left.menu .item .dropdown.icon {
  650. width: auto;
  651. float: left;
  652. margin: 0em 0.75em 0em 0em;
  653. }
  654. .ui.dropdown .item .left.dropdown.icon + .text,
  655. .ui.dropdown .left.menu .item .dropdown.icon + .text {
  656. margin-left: 1em;
  657. }
  658. /*--------------
  659. Upward
  660. ---------------*/
  661. .ui.upward.dropdown > .menu {
  662. top: auto;
  663. bottom: 100%;
  664. box-shadow: 0px 0px 4px 0px rgba(39, 41, 43, 0.15);
  665. border-radius: 0.2857rem 0.2857rem 0em 0em;
  666. }
  667. /* Active Upward */
  668. .ui.simple.upward.active.dropdown,
  669. .ui.simple.upward.dropdown:hover {
  670. border-radius: 0.2857rem 0.2857rem 0em 0em !important;
  671. }
  672. .ui.upward.dropdown.button:not(.pointing):not(.floating).active,
  673. .ui.upward.dropdown.button:not(.pointing):not(.floating).visible {
  674. border-radius: 0.2857rem 0.2857rem 0em 0em;
  675. }
  676. /* Selection */
  677. .ui.upward.selection.dropdown .menu {
  678. border-top-width: 1px !important;
  679. border-bottom-width: 0px !important;
  680. }
  681. .ui.upward.selection.dropdown:hover {
  682. box-shadow: 0px 0px 2px 0px rgba(0, 0, 0, 0.05);
  683. }
  684. .ui.upward.selection.visible.dropdown:hover {
  685. box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.05);
  686. }
  687. .ui.active.upward.selection.dropdown,
  688. .ui.visible.upward.selection.dropdown {
  689. border-radius: 0em 0em 0.2857rem 0.2857rem !important;
  690. }
  691. .ui.upward.selection.dropdown.visible {
  692. box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.08);
  693. }
  694. .ui.upward.selection.visible.dropdown:hover .menu {
  695. box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.08);
  696. }
  697. /*--------------
  698. Simple
  699. ---------------*/
  700. /* Displays without javascript */
  701. .ui.simple.dropdown .menu:before,
  702. .ui.simple.dropdown .menu:after {
  703. display: none;
  704. }
  705. .ui.simple.dropdown .menu {
  706. position: absolute;
  707. display: block;
  708. overflow: hidden;
  709. top: -9999px !important;
  710. opacity: 0;
  711. width: 0;
  712. height: 0;
  713. -webkit-transition: opacity 0.2s ease;
  714. transition: opacity 0.2s ease;
  715. }
  716. .ui.simple.active.dropdown,
  717. .ui.simple.dropdown:hover {
  718. border-bottom-left-radius: 0em !important;
  719. border-bottom-right-radius: 0em !important;
  720. }
  721. .ui.simple.active.dropdown > .menu,
  722. .ui.simple.dropdown:hover > .menu {
  723. overflow: visible;
  724. width: auto;
  725. height: auto;
  726. top: 100% !important;
  727. opacity: 1;
  728. }
  729. .ui.simple.dropdown > .menu > .item:active > .menu,
  730. .ui.simple.dropdown:hover > .menu > .item:hover > .menu {
  731. overflow: visible;
  732. width: auto;
  733. height: auto;
  734. top: 0% !important;
  735. left: 100% !important;
  736. opacity: 1;
  737. }
  738. .ui.simple.disabled.dropdown:hover .menu {
  739. display: none;
  740. height: 0px;
  741. width: 0px;
  742. overflow: hidden;
  743. }
  744. /* Visible */
  745. .ui.simple.visible.dropdown > .menu {
  746. display: block;
  747. }
  748. /*--------------
  749. Fluid
  750. ---------------*/
  751. .ui.fluid.dropdown {
  752. display: block;
  753. width: 100%;
  754. min-width: 0em;
  755. }
  756. .ui.fluid.dropdown > .dropdown.icon {
  757. float: right;
  758. }
  759. /*--------------
  760. Floating
  761. ---------------*/
  762. .ui.floating.dropdown .menu {
  763. left: 0;
  764. right: auto;
  765. box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.15);
  766. border-radius: 0.2857rem;
  767. }
  768. .ui.floating.dropdown > .menu {
  769. margin-top: 0.5em !important;
  770. }
  771. /*--------------
  772. Pointing
  773. ---------------*/
  774. .ui.pointing.dropdown > .menu {
  775. top: 100%;
  776. margin-top: 0.75em;
  777. border-radius: 0.2857rem;
  778. }
  779. .ui.pointing.dropdown > .menu:after {
  780. display: block;
  781. position: absolute;
  782. pointer-events: none;
  783. content: '';
  784. visibility: visible;
  785. -webkit-transform: rotate(45deg);
  786. -ms-transform: rotate(45deg);
  787. transform: rotate(45deg);
  788. width: 0.5em;
  789. height: 0.5em;
  790. box-shadow: -1px -1px 0px 1px rgba(0, 0, 0, 0.1);
  791. background: #ffffff;
  792. z-index: 2;
  793. }
  794. .ui.pointing.dropdown > .menu:after {
  795. top: -0.25em;
  796. left: 50%;
  797. margin: 0em 0em 0em -0.25em;
  798. }
  799. /* Top Left Pointing */
  800. .ui.top.left.pointing.dropdown > .menu {
  801. top: 100%;
  802. bottom: auto;
  803. left: 0%;
  804. right: auto;
  805. margin: 1em 0em 0em;
  806. }
  807. .ui.top.left.pointing.dropdown > .menu {
  808. top: 100%;
  809. bottom: auto;
  810. left: 0%;
  811. right: auto;
  812. margin: 1em 0em 0em;
  813. }
  814. .ui.top.left.pointing.dropdown > .menu:after {
  815. top: -0.25em;
  816. left: 1em;
  817. right: auto;
  818. margin: 0em;
  819. -webkit-transform: rotate(45deg);
  820. -ms-transform: rotate(45deg);
  821. transform: rotate(45deg);
  822. }
  823. /* Top Right Pointing */
  824. .ui.top.right.pointing.dropdown > .menu {
  825. top: 100%;
  826. bottom: auto;
  827. right: 0%;
  828. left: auto;
  829. margin: 1em 0em 0em;
  830. }
  831. .ui.top.right.pointing.dropdown > .menu:after {
  832. top: -0.25em;
  833. left: auto;
  834. right: 1em;
  835. margin: 0em;
  836. -webkit-transform: rotate(45deg);
  837. -ms-transform: rotate(45deg);
  838. transform: rotate(45deg);
  839. }
  840. /* Left Pointing */
  841. .ui.left.pointing.dropdown > .menu {
  842. top: 0%;
  843. left: 100%;
  844. right: auto;
  845. margin: 0em 0em 0em 1em;
  846. }
  847. .ui.left.pointing.dropdown > .menu:after {
  848. top: 1em;
  849. left: -0.25em;
  850. margin: 0em 0em 0em 0em;
  851. -webkit-transform: rotate(-45deg);
  852. -ms-transform: rotate(-45deg);
  853. transform: rotate(-45deg);
  854. }
  855. /* Right Pointing */
  856. .ui.right.pointing.dropdown > .menu {
  857. top: 0%;
  858. left: auto;
  859. right: 100%;
  860. margin: 0em 1em 0em 0em;
  861. }
  862. .ui.right.pointing.dropdown > .menu:after {
  863. top: 1em;
  864. left: auto;
  865. right: -0.25em;
  866. margin: 0em 0em 0em 0em;
  867. -webkit-transform: rotate(135deg);
  868. -ms-transform: rotate(135deg);
  869. transform: rotate(135deg);
  870. }
  871. /* Bottom Pointing */
  872. .ui.bottom.pointing.dropdown > .menu {
  873. top: auto;
  874. bottom: 100%;
  875. left: 0%;
  876. right: auto;
  877. margin: 0em 0em 1em;
  878. }
  879. .ui.bottom.pointing.dropdown > .menu:after {
  880. top: auto;
  881. bottom: -0.25em;
  882. right: auto;
  883. margin: 0em;
  884. -webkit-transform: rotate(-135deg);
  885. -ms-transform: rotate(-135deg);
  886. transform: rotate(-135deg);
  887. }
  888. /* Reverse Sub-Menu Direction */
  889. .ui.bottom.pointing.dropdown > .menu .menu {
  890. top: auto !important;
  891. bottom: 0px !important;
  892. }
  893. /* Bottom Left */
  894. .ui.bottom.left.pointing.dropdown > .menu {
  895. left: 0%;
  896. right: auto;
  897. }
  898. .ui.bottom.left.pointing.dropdown > .menu:after {
  899. left: 1em;
  900. right: auto;
  901. }
  902. /* Bottom Right */
  903. .ui.bottom.right.pointing.dropdown > .menu {
  904. right: 0%;
  905. left: auto;
  906. }
  907. .ui.bottom.right.pointing.dropdown > .menu:after {
  908. left: auto;
  909. right: 1em;
  910. }
  911. /*******************************
  912. Theme Overrides
  913. *******************************/
  914. /* Dropdown Carets */
  915. @font-face {
  916. font-family: 'Dropdown';
  917. src: url(data:application/x-font-ttf;charset=utf-8;base64,AAEAAAALAIAAAwAwT1MvMggjB5AAAAC8AAAAYGNtYXAPfuIIAAABHAAAAExnYXNwAAAAEAAAAWgAAAAIZ2x5Zjo82LgAAAFwAAABVGhlYWQAQ88bAAACxAAAADZoaGVhAwcB6QAAAvwAAAAkaG10eAS4ABIAAAMgAAAAIGxvY2EBNgDeAAADQAAAABJtYXhwAAoAFgAAA1QAAAAgbmFtZVcZpu4AAAN0AAABRXBvc3QAAwAAAAAEvAAAACAAAwIAAZAABQAAAUwBZgAAAEcBTAFmAAAA9QAZAIQAAAAAAAAAAAAAAAAAAAABEAAAAAAAAAAAAAAAAAAAAABAAADw2gHg/+D/4AHgACAAAAABAAAAAAAAAAAAAAAgAAAAAAACAAAAAwAAABQAAwABAAAAFAAEADgAAAAKAAgAAgACAAEAIPDa//3//wAAAAAAIPDX//3//wAB/+MPLQADAAEAAAAAAAAAAAAAAAEAAf//AA8AAQAAAAAAAAAAAAIAADc5AQAAAAABAAAAAAAAAAAAAgAANzkBAAAAAAEAAAAAAAAAAAACAAA3OQEAAAAAAQAAAIABJQElABMAABM0NzY3BTYXFhUUDwEGJwYvASY1AAUGBwEACAUGBoAFCAcGgAUBEgcGBQEBAQcECQYHfwYBAQZ/BwYAAQAAAG4BJQESABMAADc0PwE2MzIfARYVFAcGIyEiJyY1AAWABgcIBYAGBgUI/wAHBgWABwaABQWABgcHBgUFBgcAAAABABIASQC3AW4AEwAANzQ/ATYXNhcWHQEUBwYnBi8BJjUSBoAFCAcFBgYFBwgFgAbbBwZ/BwEBBwQJ/wgEBwEBB38GBgAAAAABAAAASQClAW4AEwAANxE0NzYzMh8BFhUUDwEGIyInJjUABQYHCAWABgaABQgHBgVbAQAIBQYGgAUIBwWABgYFBwAAAAEAAAABAADZuaKOXw889QALAgAAAAAA0ABHWAAAAADQAEdYAAAAAAElAW4AAAAIAAIAAAAAAAAAAQAAAeD/4AAAAgAAAAAAASUAAQAAAAAAAAAAAAAAAAAAAAgAAAAAAAAAAAAAAAABAAAAASUAAAElAAAAtwASALcAAAAAAAAACgAUAB4AQgBkAIgAqgAAAAEAAAAIABQAAQAAAAAAAgAAAAAAAAAAAAAAAAAAAAAAAAAOAK4AAQAAAAAAAQAOAAAAAQAAAAAAAgAOAEcAAQAAAAAAAwAOACQAAQAAAAAABAAOAFUAAQAAAAAABQAWAA4AAQAAAAAABgAHADIAAQAAAAAACgA0AGMAAwABBAkAAQAOAAAAAwABBAkAAgAOAEcAAwABBAkAAwAOACQAAwABBAkABAAOAFUAAwABBAkABQAWAA4AAwABBAkABgAOADkAAwABBAkACgA0AGMAaQBjAG8AbQBvAG8AbgBWAGUAcgBzAGkAbwBuACAAMQAuADAAaQBjAG8AbQBvAG8Abmljb21vb24AaQBjAG8AbQBvAG8AbgBSAGUAZwB1AGwAYQByAGkAYwBvAG0AbwBvAG4ARgBvAG4AdAAgAGcAZQBuAGUAcgBhAHQAZQBkACAAYgB5ACAASQBjAG8ATQBvAG8AbgAuAAAAAAMAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA=) format('truetype'), url(data:application/font-woff;charset=utf-8;base64,d09GRk9UVE8AAAVwAAoAAAAABSgAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAABDRkYgAAAA9AAAAdkAAAHZLDXE/09TLzIAAALQAAAAYAAAAGAIIweQY21hcAAAAzAAAABMAAAATA9+4ghnYXNwAAADfAAAAAgAAAAIAAAAEGhlYWQAAAOEAAAANgAAADYAQ88baGhlYQAAA7wAAAAkAAAAJAMHAelobXR4AAAD4AAAACAAAAAgBLgAEm1heHAAAAQAAAAABgAAAAYACFAAbmFtZQAABAgAAAFFAAABRVcZpu5wb3N0AAAFUAAAACAAAAAgAAMAAAEABAQAAQEBCGljb21vb24AAQIAAQA6+BwC+BsD+BgEHgoAGVP/i4seCgAZU/+LiwwHi2v4lPh0BR0AAACIDx0AAACNER0AAAAJHQAAAdASAAkBAQgPERMWGyAlKmljb21vb25pY29tb29udTB1MXUyMHVGMEQ3dUYwRDh1RjBEOXVGMERBAAACAYkABgAIAgABAAQABwAKAA0AVgCfAOgBL/yUDvyUDvyUDvuUDvtvi/emFYuQjZCOjo+Pj42Qiwj3lIsFkIuQiY6Hj4iNhouGi4aJh4eHCPsU+xQFiIiGiYaLhouHjYeOCPsU9xQFiI+Jj4uQCA77b4v3FBWLkI2Pjo8I9xT3FAWPjo+NkIuQi5CJjogI9xT7FAWPh42Hi4aLhomHh4eIiIaJhosI+5SLBYaLh42HjoiPiY+LkAgO+92d928Vi5CNkI+OCPcU9xQFjo+QjZCLkIuPiY6Hj4iNhouGCIv7lAWLhomHh4iIh4eJhouGi4aNiI8I+xT3FAWHjomPi5AIDvvdi+YVi/eUBYuQjZCOjo+Pj42Qi5CLkImOhwj3FPsUBY+IjYaLhouGiYeHiAj7FPsUBYiHhomGi4aLh42Hj4iOiY+LkAgO+JQU+JQViwwKAAAAAAMCAAGQAAUAAAFMAWYAAABHAUwBZgAAAPUAGQCEAAAAAAAAAAAAAAAAAAAAARAAAAAAAAAAAAAAAAAAAAAAQAAA8NoB4P/g/+AB4AAgAAAAAQAAAAAAAAAAAAAAIAAAAAAAAgAAAAMAAAAUAAMAAQAAABQABAA4AAAACgAIAAIAAgABACDw2v/9//8AAAAAACDw1//9//8AAf/jDy0AAwABAAAAAAAAAAAAAAABAAH//wAPAAEAAAABAAA5emozXw889QALAgAAAAAA0ABHWAAAAADQAEdYAAAAAAElAW4AAAAIAAIAAAAAAAAAAQAAAeD/4AAAAgAAAAAAASUAAQAAAAAAAAAAAAAAAAAAAAgAAAAAAAAAAAAAAAABAAAAASUAAAElAAAAtwASALcAAAAAUAAACAAAAAAADgCuAAEAAAAAAAEADgAAAAEAAAAAAAIADgBHAAEAAAAAAAMADgAkAAEAAAAAAAQADgBVAAEAAAAAAAUAFgAOAAEAAAAAAAYABwAyAAEAAAAAAAoANABjAAMAAQQJAAEADgAAAAMAAQQJAAIADgBHAAMAAQQJAAMADgAkAAMAAQQJAAQADgBVAAMAAQQJAAUAFgAOAAMAAQQJAAYADgA5AAMAAQQJAAoANABjAGkAYwBvAG0AbwBvAG4AVgBlAHIAcwBpAG8AbgAgADEALgAwAGkAYwBvAG0AbwBvAG5pY29tb29uAGkAYwBvAG0AbwBvAG4AUgBlAGcAdQBsAGEAcgBpAGMAbwBtAG8AbwBuAEYAbwBuAHQAIABnAGUAbgBlAHIAYQB0AGUAZAAgAGIAeQAgAEkAYwBvAE0AbwBvAG4ALgAAAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA) format('woff');
  918. font-weight: normal;
  919. font-style: normal;
  920. }
  921. .ui.dropdown > .dropdown.icon {
  922. font-family: 'Dropdown';
  923. line-height: 1;
  924. height: 1em;
  925. width: 1.23em;
  926. -webkit-backface-visibility: hidden;
  927. backface-visibility: hidden;
  928. font-weight: normal;
  929. font-style: normal;
  930. text-align: center;
  931. }
  932. .ui.dropdown > .dropdown.icon {
  933. width: auto;
  934. }
  935. .ui.dropdown > .dropdown.icon:before {
  936. content: '\f0d7';
  937. }
  938. /* Sub Menu */
  939. .ui.dropdown .menu .item .dropdown.icon:before {
  940. content: '\f0da' /*rtl:'\f0d9'*/;
  941. }
  942. .ui.dropdown .item .left.dropdown.icon:before,
  943. .ui.dropdown .left.menu .item .dropdown.icon:before {
  944. content: "\f0d9" /*rtl:"\f0da"*/;
  945. }
  946. /* Upward Dropdown */
  947. .ui.upward.dropdown > .dropdown.icon:before {
  948. content: "\f0d8";
  949. }
  950. /* Vertical Menu Dropdown */
  951. .ui.vertical.menu .dropdown.item > .dropdown.icon:before {
  952. content: "\f0da" /*rtl:"\f0d9"*/;
  953. }
  954. /* Icons for Reference
  955. .dropdown.down.icon {
  956. content: "\f0d7";
  957. }
  958. .dropdown.up.icon {
  959. content: "\f0d8";
  960. }
  961. .dropdown.left.icon {
  962. content: "\f0d9";
  963. }
  964. .dropdown.icon.icon {
  965. content: "\f0da";
  966. }
  967. */
  968. /*******************************
  969. User Overrides
  970. *******************************/