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.

902 lines
21 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
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
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 UI
  3. * git://github.com/Semantic-Org/Semantic-UI.git#1.0
  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: 1;
  19. -webkit-transition: border-radius 0.1s ease, width 0.2s ease;
  20. transition: border-radius 0.1s ease, width 0.2s ease;
  21. tap-highlight-color: rgba(0, 0, 0, 0);
  22. outline: none;
  23. text-align: left;
  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(0, 0, 0, 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[type="hidden"],
  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: 0.2em 0em 0em;
  71. }
  72. /*--------------
  73. Text
  74. ---------------*/
  75. .ui.dropdown > .text {
  76. display: inline-block;
  77. -webkit-transition: color 0.2s ease;
  78. transition: color 0.2s ease;
  79. }
  80. /*--------------
  81. Menu Item
  82. ---------------*/
  83. .ui.dropdown .menu > .item {
  84. position: relative;
  85. cursor: pointer;
  86. display: block;
  87. border: none;
  88. height: auto;
  89. border-top: none;
  90. line-height: 1.2em;
  91. color: rgba(0, 0, 0, 0.8);
  92. padding: 0.65rem 1.25rem !important;
  93. font-size: 1rem;
  94. text-transform: none;
  95. font-weight: normal;
  96. box-shadow: none;
  97. -webkit-touch-callout: none;
  98. }
  99. .ui.dropdown .menu > .item:first-child {
  100. border-top: none;
  101. }
  102. /*--------------
  103. Menu Divider
  104. ---------------*/
  105. .ui.dropdown .menu > .header {
  106. margin: 1rem 0rem 0.75rem;
  107. padding: 0em 1.25rem;
  108. color: rgba(0, 0, 0, 0.85);
  109. font-size: 0.8em;
  110. font-weight: bold;
  111. text-transform: uppercase;
  112. }
  113. .ui.dropdown .menu > .divider {
  114. border-top: 1px solid rgba(0, 0, 0, 0.05);
  115. height: 0em;
  116. margin: 0.5em 0em;
  117. }
  118. .ui.dropdown .menu > .input {
  119. margin: 0.75rem 1.25rem 0.25rem;
  120. min-width: 200px;
  121. }
  122. .ui.dropdown .menu > .header + .input {
  123. margin-top: 0em;
  124. }
  125. .ui.dropdown .menu > .input:not(.transparent) input {
  126. padding: 0.5em 1em;
  127. }
  128. /*--------------
  129. Item Image
  130. ---------------*/
  131. .ui.dropdown > .text > img,
  132. .ui.dropdown > .text > .image,
  133. .ui.dropdown .menu > .item > .image,
  134. .ui.dropdown .menu > .item > img {
  135. display: inline-block;
  136. vertical-align: middle;
  137. width: auto;
  138. max-height: 2.5em;
  139. margin: 0em 0.75em 0em 0em;
  140. }
  141. /*--------------
  142. Sub Menu
  143. ---------------*/
  144. .ui.dropdown .menu .menu {
  145. top: 0% !important;
  146. left: 100% !important;
  147. right: auto !important;
  148. margin: 0em 0em 0em -0.5em !important;
  149. border-radius: 0em 0.2857rem 0.2857rem 0em !important;
  150. z-index: 21 !important;
  151. }
  152. /* Hide Arrow */
  153. .ui.dropdown .menu .menu:after {
  154. display: none;
  155. }
  156. /*******************************
  157. Coupling
  158. *******************************/
  159. /* Icons / Flags / Labels */
  160. .ui.dropdown > .text > .icon,
  161. .ui.dropdown .menu > .item > .icon {
  162. margin: 0em 0.75em 0em 0em;
  163. }
  164. .ui.dropdown > .text > .label,
  165. .ui.dropdown .menu > .item > .label {
  166. margin: 0em 0.75em 0em 0em;
  167. }
  168. .ui.dropdown > .text > .flag,
  169. .ui.dropdown .menu > .item > .flag {
  170. margin: 0em 0.75em 0em 0em;
  171. }
  172. .ui.dropdown .menu > .item > .icon + .text {
  173. display: block;
  174. margin-right: 1em;
  175. }
  176. /* Remove Menu Item Divider */
  177. .ui.dropdown .ui.menu > .item:before,
  178. .ui.menu .ui.dropdown .menu > .item:before {
  179. display: none;
  180. }
  181. /* Prevent Menu Item Border */
  182. .ui.menu .ui.dropdown .menu .active.item {
  183. border-left: none;
  184. }
  185. /* No Margin On Icon Button */
  186. .ui.dropdown.icon.button > .dropdown.icon {
  187. margin: 0em;
  188. }
  189. .ui.dropdown.button:not(.pointing):not(.floating).active,
  190. .ui.dropdown.button:not(.pointing):not(.floating).visible {
  191. border-bottom-left-radius: 0em;
  192. border-bottom-right-radius: 0em;
  193. }
  194. /* Automatically float dropdown menu right on last menu item */
  195. .ui.menu .right.menu .dropdown:last-child .menu,
  196. .ui.buttons > .ui.dropdown:last-child .menu {
  197. left: auto;
  198. right: 0em;
  199. }
  200. /*******************************
  201. Types
  202. *******************************/
  203. /*--------------
  204. Selection
  205. ---------------*/
  206. /* Displays like a select box */
  207. .ui.selection.dropdown {
  208. cursor: pointer;
  209. word-wrap: break-word;
  210. white-space: normal;
  211. outline: 0;
  212. -webkit-transform: rotateZ(0deg);
  213. transform: rotateZ(0deg);
  214. min-width: 180px;
  215. background: #ffffff;
  216. display: inline-block;
  217. padding: 0.8em 1.1em;
  218. color: rgba(0, 0, 0, 0.8);
  219. box-shadow: none;
  220. border: 1px solid rgba(39, 41, 43, 0.15);
  221. border-radius: 0.2857rem;
  222. -webkit-transition: border-radius 0.1s ease, width 0.2s ease, box-shadow 0.2s ease, border 0.2s ease;
  223. transition: border-radius 0.1s ease, width 0.2s ease, box-shadow 0.2s ease, border 0.2s ease;
  224. }
  225. .ui.selection.dropdown.visible,
  226. .ui.selection.dropdown.active {
  227. z-index: 10;
  228. }
  229. select.ui.dropdown {
  230. height: 38px;
  231. padding: 0em;
  232. margin: 0em;
  233. visibility: hidden;
  234. }
  235. .ui.selection.dropdown > .text {
  236. margin-right: 2em;
  237. }
  238. .ui.selection.dropdown > .search.icon,
  239. .ui.selection.dropdown > .delete.icon,
  240. .ui.selection.dropdown > .dropdown.icon {
  241. position: absolute;
  242. top: auto;
  243. margin: 0em;
  244. width: auto;
  245. right: 1.1em;
  246. opacity: 0.8;
  247. -webkit-transition: opacity 0.2s ease;
  248. transition: opacity 0.2s ease;
  249. }
  250. /* Compact */
  251. .ui.compact.selection.dropdown {
  252. min-width: 0px;
  253. }
  254. /* Remove Selection */
  255. .ui.selection.dropdown > .delete.icon {
  256. opacity: 0.6;
  257. }
  258. .ui.selection.dropdown > .delete.icon:hover {
  259. opacity: 1;
  260. }
  261. /* Selection Menu */
  262. .ui.selection.dropdown .menu {
  263. overflow-x: hidden;
  264. overflow-y: auto;
  265. -webkit-backface-visibility: hidden;
  266. backface-visibility: hidden;
  267. -webkit-overflow-scrolling: touch;
  268. border-top: none !important;
  269. width: auto;
  270. margin: 0px -1px;
  271. min-width: -webkit-calc(100% + 2px);
  272. min-width: calc(100% + 2px);
  273. outline: none;
  274. box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.08);
  275. -webkit-transition: box-shadow 0.2s ease, border 0.2s ease;
  276. transition: box-shadow 0.2s ease, border 0.2s ease;
  277. }
  278. .ui.selection.dropdown .menu:after,
  279. .ui.selection.dropdown .menu:before {
  280. display: none;
  281. }
  282. @media only screen and (max-width: 767px) {
  283. .ui.selection.dropdown .menu {
  284. max-height: 7.7142rem;
  285. }
  286. }
  287. @media only screen and (min-width: 768px) {
  288. .ui.selection.dropdown .menu {
  289. max-height: 10.2856rem;
  290. }
  291. }
  292. @media only screen and (min-width: 992px) {
  293. .ui.selection.dropdown .menu {
  294. max-height: 15.4284rem;
  295. }
  296. }
  297. @media only screen and (min-width: 1920px) {
  298. .ui.selection.dropdown .menu {
  299. max-height: 20.5712rem;
  300. }
  301. }
  302. /* Menu Item */
  303. .ui.selection.dropdown .menu > .item {
  304. border-top: 1px solid rgba(0, 0, 0, 0.05);
  305. padding-left: 1.1em !important;
  306. /* Add in spacing for scroll bar */
  307. padding-right: -webkit-calc(2.1em) !important;
  308. padding-right: calc(2.1em) !important;
  309. white-space: normal;
  310. word-wrap: normal;
  311. }
  312. /* Hover */
  313. .ui.selection.dropdown:hover {
  314. border-color: rgba(39, 41, 43, 0.3);
  315. box-shadow: 0px 0px 2px 0px rgba(0, 0, 0, 0.05);
  316. }
  317. /* Visible Hover */
  318. .ui.selection.visible.dropdown:hover {
  319. border-color: rgba(39, 41, 43, 0.3);
  320. box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.08);
  321. }
  322. .ui.selection.visible.dropdown:hover .menu {
  323. border: 1px solid rgba(39, 41, 43, 0.3);
  324. box-shadow: 0px 4px 6px 0px rgba(0, 0, 0, 0.08);
  325. }
  326. /* Visible */
  327. .ui.selection.dropdown.visible {
  328. border-color: rgba(39, 41, 43, 0.15);
  329. box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.08);
  330. }
  331. .ui.visible.selection.dropdown > .dropdown.icon {
  332. opacity: 1;
  333. }
  334. /* Active Item */
  335. .ui.selection.active.dropdown > .text:not(.default),
  336. .ui.selection.visible.dropdown > .text:not(.default) {
  337. font-weight: normal;
  338. color: rgba(0, 0, 0, 0.8);
  339. }
  340. /* Connecting Border */
  341. .ui.active.selection.dropdown,
  342. .ui.visible.selection.dropdown {
  343. border-bottom-left-radius: 0em !important;
  344. border-bottom-right-radius: 0em !important;
  345. }
  346. /*--------------
  347. Searchable
  348. ---------------*/
  349. /* Search Selection */
  350. .ui.search.dropdown {
  351. min-width: auto;
  352. }
  353. /* Search Dropdown */
  354. .ui.search.dropdown > input.search {
  355. background: none transparent;
  356. border: none;
  357. cursor: pointer;
  358. position: absolute;
  359. border-radius: 0em !important;
  360. top: 0em;
  361. left: 0em;
  362. width: 100%;
  363. outline: none;
  364. -webkit-tap-highlight-color: rgba(255, 255, 255, 0);
  365. padding: inherit;
  366. /*Amazing trick */
  367. }
  368. /* Search Selection */
  369. .ui.search.selection.dropdown > input.search {
  370. line-height: 1.2em;
  371. }
  372. .ui.search.dropdown.active > input.search,
  373. .ui.search.dropdown.visible > input.search {
  374. cursor: auto;
  375. }
  376. .ui.search.dropdown > input.search:focus + .text {
  377. color: rgba(0, 0, 0, 0.4) !important;
  378. }
  379. /* Search Menu */
  380. .ui.search.dropdown .menu {
  381. overflow-x: hidden;
  382. overflow-y: auto;
  383. -webkit-backface-visibility: hidden;
  384. backface-visibility: hidden;
  385. -webkit-overflow-scrolling: touch;
  386. }
  387. @media only screen and (max-width: 767px) {
  388. .ui.search.dropdown .menu {
  389. max-height: 7.7142rem;
  390. }
  391. }
  392. @media only screen and (min-width: 768px) {
  393. .ui.search.dropdown .menu {
  394. max-height: 10.2856rem;
  395. }
  396. }
  397. @media only screen and (min-width: 992px) {
  398. .ui.search.dropdown .menu {
  399. max-height: 15.4284rem;
  400. }
  401. }
  402. @media only screen and (min-width: 1920px) {
  403. .ui.search.dropdown .menu {
  404. max-height: 20.5712rem;
  405. }
  406. }
  407. /*--------------
  408. Inline
  409. ---------------*/
  410. .ui.inline.dropdown {
  411. cursor: pointer;
  412. display: inline-block;
  413. color: inherit;
  414. }
  415. .ui.inline.dropdown .dropdown.icon {
  416. margin: 0em 0.5em 0em 0.25em;
  417. vertical-align: top;
  418. }
  419. .ui.inline.dropdown > .text {
  420. font-weight: bold;
  421. }
  422. .ui.inline.dropdown .menu {
  423. cursor: auto;
  424. margin-top: 0.25em;
  425. border-radius: 0.2857rem;
  426. }
  427. /*******************************
  428. States
  429. *******************************/
  430. /*--------------------
  431. Hover
  432. ----------------------*/
  433. /* Menu Item Hover */
  434. .ui.dropdown .menu > .item:hover {
  435. background: rgba(0, 0, 0, 0.05);
  436. color: rgba(0, 0, 0, 0.8);
  437. z-index: 12;
  438. }
  439. /*--------------------
  440. Active
  441. ----------------------*/
  442. /* Menu Item Active */
  443. .ui.dropdown .menu .active.item {
  444. background: transparent;
  445. font-weight: bold;
  446. color: rgba(0, 0, 0, 0.8);
  447. box-shadow: none;
  448. z-index: 12;
  449. }
  450. /*--------------------
  451. Default Text
  452. ----------------------*/
  453. .ui.dropdown > .default.text,
  454. .ui.default.dropdown > .text {
  455. color: rgba(179, 179, 179, 0.7);
  456. }
  457. .ui.dropdown:hover > .default.text,
  458. .ui.default.dropdown:hover > .text {
  459. color: rgba(140, 140, 140, 0.7);
  460. }
  461. /*--------------------
  462. Loading
  463. ----------------------*/
  464. .ui.loading.dropdown > .text {
  465. -webkit-transition: none;
  466. transition: none;
  467. }
  468. /*--------------------
  469. Keyboard Select
  470. ----------------------*/
  471. /* Selected Item */
  472. .ui.dropdown.selected,
  473. .ui.dropdown .menu .selected.item {
  474. background: rgba(0, 0, 0, 0.03);
  475. color: rgba(0, 0, 0, 0.8);
  476. }
  477. /*--------------------
  478. Search Filtered
  479. ----------------------*/
  480. /* Filtered Item */
  481. .ui.dropdown > .filtered.text {
  482. visibility: hidden;
  483. }
  484. .ui.dropdown .filtered.item {
  485. display: none;
  486. }
  487. /*--------------------
  488. Error
  489. ----------------------*/
  490. .ui.dropdown.error,
  491. .ui.dropdown.error > .text,
  492. .ui.dropdown.error > .default.text {
  493. color: #a94442;
  494. }
  495. .ui.selection.dropdown.error {
  496. background: #fff0f0;
  497. border-color: #dbb1b1;
  498. }
  499. .ui.selection.dropdown.error:hover {
  500. border-color: #dbb1b1;
  501. }
  502. .ui.dropdown.error > .menu,
  503. .ui.dropdown.error > .menu .menu {
  504. border-color: #dbb1b1;
  505. }
  506. .ui.dropdown.error > .menu > .item {
  507. color: #d95c5c;
  508. }
  509. /* Item Hover */
  510. .ui.dropdown.error > .menu > .item:hover {
  511. background-color: #fff2f2;
  512. }
  513. /* Item Active */
  514. .ui.dropdown.error > .menu .active.item {
  515. background-color: #fdcfcf;
  516. }
  517. /*******************************
  518. Variations
  519. *******************************/
  520. /*--------------
  521. Direction
  522. ---------------*/
  523. /* Flyout Direction */
  524. .ui.dropdown .menu {
  525. left: 0px;
  526. }
  527. /*--------------
  528. Simple
  529. ---------------*/
  530. /* Displays without javascript */
  531. .ui.simple.dropdown .menu:before,
  532. .ui.simple.dropdown .menu:after {
  533. display: none;
  534. }
  535. .ui.simple.dropdown .menu {
  536. position: absolute;
  537. display: block;
  538. overflow: hidden;
  539. top: -9999px !important;
  540. opacity: 0;
  541. width: 0;
  542. height: 0;
  543. -webkit-transition: opacity 0.2s ease;
  544. transition: opacity 0.2s ease;
  545. }
  546. .ui.simple.active.dropdown,
  547. .ui.simple.dropdown:hover {
  548. border-bottom-left-radius: 0em !important;
  549. border-bottom-right-radius: 0em !important;
  550. }
  551. .ui.simple.active.dropdown > .menu,
  552. .ui.simple.dropdown:hover > .menu {
  553. overflow: visible;
  554. width: auto;
  555. height: auto;
  556. top: 100% !important;
  557. opacity: 1;
  558. }
  559. .ui.simple.dropdown > .menu > .item:active > .menu,
  560. .ui.simple.dropdown:hover > .menu > .item:hover > .menu {
  561. overflow: visible;
  562. width: auto;
  563. height: auto;
  564. top: 0% !important;
  565. left: 100% !important;
  566. opacity: 1;
  567. }
  568. .ui.simple.disabled.dropdown:hover .menu {
  569. display: none;
  570. height: 0px;
  571. width: 0px;
  572. overflow: hidden;
  573. }
  574. /* Visible */
  575. .ui.simple.visible.dropdown > .menu {
  576. display: block;
  577. }
  578. /*--------------
  579. Fluid
  580. ---------------*/
  581. .ui.fluid.dropdown {
  582. display: block;
  583. width: 100%;
  584. min-width: 0em;
  585. }
  586. .ui.fluid.dropdown > .dropdown.icon {
  587. float: right;
  588. }
  589. /*--------------
  590. Floating
  591. ---------------*/
  592. .ui.floating.dropdown .menu {
  593. left: 0;
  594. right: auto;
  595. margin-top: 0.5em !important;
  596. box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.15);
  597. border-radius: 0.2857rem;
  598. }
  599. /*--------------
  600. Pointing
  601. ---------------*/
  602. .ui.pointing.dropdown > .menu {
  603. top: 100%;
  604. margin-top: 0.75em;
  605. border-radius: 0.2857rem;
  606. }
  607. .ui.pointing.dropdown > .menu:after {
  608. display: block;
  609. position: absolute;
  610. pointer-events: none;
  611. content: '';
  612. visibility: visible;
  613. -webkit-transform: rotate(45deg);
  614. -ms-transform: rotate(45deg);
  615. transform: rotate(45deg);
  616. width: 0.5em;
  617. height: 0.5em;
  618. box-shadow: -1px -1px 0px 1px rgba(0, 0, 0, 0.1);
  619. background: #ffffff;
  620. z-index: 2;
  621. }
  622. .ui.pointing.dropdown > .menu:after {
  623. top: -0.25em;
  624. left: 50%;
  625. margin: 0em 0em 0em -0.25em;
  626. }
  627. /* Top Left Pointing */
  628. .ui.top.left.pointing.dropdown > .menu {
  629. top: 100%;
  630. bottom: auto;
  631. left: 0%;
  632. right: auto;
  633. margin: 1em 0em 0em;
  634. }
  635. .ui.top.left.pointing.dropdown > .menu {
  636. top: 100%;
  637. bottom: auto;
  638. left: 0%;
  639. right: auto;
  640. margin: 1em 0em 0em;
  641. }
  642. .ui.top.left.pointing.dropdown > .menu:after {
  643. top: -0.25em;
  644. left: 1em;
  645. right: auto;
  646. margin: 0em;
  647. -webkit-transform: rotate(45deg);
  648. -ms-transform: rotate(45deg);
  649. transform: rotate(45deg);
  650. }
  651. /* Top Right Pointing */
  652. .ui.top.right.pointing.dropdown > .menu {
  653. top: 100%;
  654. bottom: auto;
  655. right: 0%;
  656. left: auto;
  657. margin: 1em 0em 0em;
  658. }
  659. .ui.top.right.pointing.dropdown > .menu:after {
  660. top: -0.25em;
  661. left: auto;
  662. right: 1em;
  663. margin: 0em;
  664. -webkit-transform: rotate(45deg);
  665. -ms-transform: rotate(45deg);
  666. transform: rotate(45deg);
  667. }
  668. /* Left Pointing */
  669. .ui.left.pointing.dropdown > .menu {
  670. top: 0%;
  671. left: 100%;
  672. right: auto;
  673. margin: 0em 0em 0em 1em;
  674. }
  675. .ui.left.pointing.dropdown > .menu:after {
  676. top: 1em;
  677. left: -0.25em;
  678. margin: 0em 0em 0em 0em;
  679. -webkit-transform: rotate(-45deg);
  680. -ms-transform: rotate(-45deg);
  681. transform: rotate(-45deg);
  682. }
  683. /* Right Pointing */
  684. .ui.right.pointing.dropdown > .menu {
  685. top: 0%;
  686. left: auto;
  687. right: 100%;
  688. margin: 0em 1em 0em 0em;
  689. }
  690. .ui.right.pointing.dropdown > .menu:after {
  691. top: 1em;
  692. left: auto;
  693. right: -0.25em;
  694. margin: 0em 0em 0em 0em;
  695. -webkit-transform: rotate(135deg);
  696. -ms-transform: rotate(135deg);
  697. transform: rotate(135deg);
  698. }
  699. /* Bottom Pointing */
  700. .ui.bottom.pointing.dropdown > .menu {
  701. top: auto;
  702. bottom: 100%;
  703. left: 0%;
  704. right: auto;
  705. margin: 0em 0em 1em;
  706. }
  707. .ui.bottom.pointing.dropdown > .menu:after {
  708. top: auto;
  709. bottom: -0.25em;
  710. right: auto;
  711. margin: 0em;
  712. -webkit-transform: rotate(-135deg);
  713. -ms-transform: rotate(-135deg);
  714. transform: rotate(-135deg);
  715. }
  716. /* Reverse Sub-Menu Direction */
  717. .ui.bottom.pointing.dropdown > .menu .menu {
  718. top: auto !important;
  719. bottom: 0px !important;
  720. }
  721. /* Bottom Left */
  722. .ui.bottom.left.pointing.dropdown > .menu {
  723. left: 0%;
  724. right: auto;
  725. }
  726. .ui.bottom.left.pointing.dropdown > .menu:after {
  727. left: 1em;
  728. right: auto;
  729. }
  730. /* Bottom Right */
  731. .ui.bottom.right.pointing.dropdown > .menu {
  732. right: 0%;
  733. left: auto;
  734. }
  735. .ui.bottom.right.pointing.dropdown > .menu:after {
  736. left: auto;
  737. right: 1em;
  738. }
  739. /*******************************
  740. Theme Overrides
  741. *******************************/
  742. /* Dropdown Carets */
  743. @font-face {
  744. font-family: 'Dropdown';
  745. 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');
  746. font-weight: normal;
  747. font-style: normal;
  748. }
  749. .ui.dropdown > .dropdown.icon {
  750. font-family: 'Dropdown';
  751. line-height: 1;
  752. height: 1em;
  753. width: 1.23em;
  754. -webkit-backface-visibility: hidden;
  755. backface-visibility: hidden;
  756. font-weight: normal;
  757. font-style: normal;
  758. text-align: center;
  759. }
  760. .ui.dropdown > .dropdown.icon {
  761. width: auto;
  762. }
  763. .ui.dropdown > .dropdown.icon:before {
  764. content: '\f0d7';
  765. }
  766. /* Sub Menu */
  767. .ui.dropdown .menu .item .dropdown.icon:before {
  768. content: '\f0da' /*rtl:'\f0d9'*/;
  769. }
  770. /* Vertical Menu Dropdown */
  771. .ui.vertical.menu .dropdown.item > .dropdown.icon:before {
  772. content: "\f0da" /*rtl:"\f0d9"*/;
  773. }
  774. /* Icons for Reference
  775. .dropdown.down.icon {
  776. content: "\f0d7";
  777. }
  778. .dropdown.up.icon {
  779. content: "\f0d8";
  780. }
  781. .dropdown.left.icon {
  782. content: "\f0d9";
  783. }
  784. .dropdown.icon.icon {
  785. content: "\f0da";
  786. }
  787. */
  788. /*******************************
  789. User Overrides
  790. *******************************/