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.

247 lines
6.0 KiB

9 years ago
9 years ago
9 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
9 years ago
10 years ago
9 years ago
10 years ago
9 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
  1. /*!
  2. * # Semantic UI 2.0.0 - Divider
  3. * http://github.com/semantic-org/semantic-ui/
  4. *
  5. *
  6. * Copyright 2015 Contributors
  7. * Released under the MIT license
  8. * http://opensource.org/licenses/MIT
  9. *
  10. */
  11. /*******************************
  12. Divider
  13. *******************************/
  14. .ui.divider {
  15. margin: 1rem 0rem;
  16. line-height: 1;
  17. height: 0em;
  18. font-weight: bold;
  19. text-transform: uppercase;
  20. letter-spacing: 0.05em;
  21. color: rgba(0, 0, 0, 0.85);
  22. -webkit-user-select: none;
  23. -moz-user-select: none;
  24. -ms-user-select: none;
  25. user-select: none;
  26. -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  27. }
  28. /*--------------
  29. Basic
  30. ---------------*/
  31. .ui.divider:not(.vertical):not(.horizontal) {
  32. border-top: 1px solid rgba(34, 36, 38, 0.15);
  33. border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  34. }
  35. /*--------------
  36. Coupling
  37. ---------------*/
  38. .ui.grid > .ui.divider {
  39. font-size: 1rem;
  40. }
  41. /*--------------
  42. Horizontal
  43. ---------------*/
  44. .ui.horizontal.divider {
  45. display: table;
  46. white-space: nowrap;
  47. height: auto;
  48. margin: '';
  49. overflow: hidden;
  50. line-height: 1;
  51. text-align: center;
  52. }
  53. .ui.horizontal.divider:before,
  54. .ui.horizontal.divider:after {
  55. content: '';
  56. display: table-cell;
  57. position: relative;
  58. top: 50%;
  59. width: 50%;
  60. background-repeat: no-repeat;
  61. }
  62. .ui.horizontal.divider:before {
  63. background-position: right 1em top 50%;
  64. }
  65. .ui.horizontal.divider:after {
  66. background-position: left 1em top 50%;
  67. }
  68. /*--------------
  69. Vertical
  70. ---------------*/
  71. .ui.vertical.divider {
  72. position: absolute;
  73. z-index: 2;
  74. top: 50%;
  75. left: 50%;
  76. margin: 0rem;
  77. padding: 0em;
  78. width: auto;
  79. height: 50%;
  80. line-height: 0em;
  81. text-align: center;
  82. -webkit-transform: translateX(-50%);
  83. -ms-transform: translateX(-50%);
  84. transform: translateX(-50%);
  85. }
  86. .ui.vertical.divider:before,
  87. .ui.vertical.divider:after {
  88. position: absolute;
  89. left: 50%;
  90. content: '';
  91. z-index: 3;
  92. border-left: 1px solid rgba(34, 36, 38, 0.15);
  93. border-right: 1px solid rgba(255, 255, 255, 0.1);
  94. width: 0%;
  95. height: -webkit-calc(100% - 1rem );
  96. height: calc(100% - 1rem );
  97. }
  98. .ui.vertical.divider:before {
  99. top: -100%;
  100. }
  101. .ui.vertical.divider:after {
  102. top: auto;
  103. bottom: 0px;
  104. }
  105. /* Inside grid */
  106. @media only screen and (max-width: 767px) {
  107. .ui.stackable.grid .ui.vertical.divider,
  108. .ui.grid .stackable.row .ui.vertical.divider {
  109. position: relative;
  110. margin: 1rem 0rem;
  111. left: 50%;
  112. height: auto;
  113. overflow: hidden;
  114. line-height: 1;
  115. text-align: center;
  116. }
  117. .ui.stackable.grid .ui.vertical.divider:before,
  118. .ui.grid .stackable.row .ui.vertical.divider:before,
  119. .ui.stackable.grid .ui.vertical.divider:after,
  120. .ui.grid .stackable.row .ui.vertical.divider:after {
  121. position: absolute;
  122. left: auto;
  123. content: '';
  124. z-index: 3;
  125. width: 50%;
  126. top: 50%;
  127. height: 0px;
  128. border-top: 1px solid rgba(34, 36, 38, 0.15);
  129. border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  130. }
  131. .ui.stackable.grid .ui.vertical.divider:before,
  132. .ui.grid .stackable.row .ui.vertical.divider:before {
  133. margin-left: -51%;
  134. }
  135. .ui.stackable.grid .ui.vertical.divider:after,
  136. .ui.grid .stackable.row .ui.vertical.divider:after {
  137. margin-left: 1em;
  138. }
  139. }
  140. /*--------------
  141. Icon
  142. ---------------*/
  143. .ui.divider > .icon {
  144. margin: 0rem;
  145. font-size: 1rem;
  146. height: 1em;
  147. vertical-align: middle;
  148. }
  149. /*******************************
  150. Variations
  151. *******************************/
  152. /*--------------
  153. Hidden
  154. ---------------*/
  155. .ui.hidden.divider {
  156. border-color: transparent !important;
  157. }
  158. .ui.hidden.divider:before,
  159. .ui.hidden.divider:after {
  160. display: none;
  161. }
  162. /*--------------
  163. Inverted
  164. ---------------*/
  165. .ui.divider.inverted,
  166. .ui.vertical.inverted.divider,
  167. .ui.horizontal.inverted.divider {
  168. color: #ffffff;
  169. }
  170. .ui.divider.inverted,
  171. .ui.divider.inverted:after,
  172. .ui.divider.inverted:before {
  173. border-top-color: rgba(34, 36, 38, 0.15) !important;
  174. border-left-color: rgba(34, 36, 38, 0.15) !important;
  175. border-bottom-color: rgba(255, 255, 255, 0.15) !important;
  176. border-right-color: rgba(255, 255, 255, 0.15) !important;
  177. }
  178. /*--------------
  179. Fitted
  180. ---------------*/
  181. .ui.fitted.divider {
  182. margin: 0em;
  183. }
  184. /*--------------
  185. Clearing
  186. ---------------*/
  187. .ui.clearing.divider {
  188. clear: both;
  189. }
  190. /*--------------
  191. Section
  192. ---------------*/
  193. .ui.section.divider {
  194. margin-top: 2rem;
  195. margin-bottom: 2rem;
  196. }
  197. /*--------------
  198. Sizes
  199. ---------------*/
  200. .ui.divider {
  201. font-size: 1rem;
  202. }
  203. /*******************************
  204. Theme Overrides
  205. *******************************/
  206. .ui.horizontal.divider:before,
  207. .ui.horizontal.divider:after {
  208. background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAABaAAAAACCAYAAACuTHuKAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyFpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNS1jMDE0IDc5LjE1MTQ4MSwgMjAxMy8wMy8xMy0xMjowOToxNSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIChXaW5kb3dzKSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDo1OThBRDY4OUNDMTYxMUU0OUE3NUVGOEJDMzMzMjE2NyIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDo1OThBRDY4QUNDMTYxMUU0OUE3NUVGOEJDMzMzMjE2NyI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjU5OEFENjg3Q0MxNjExRTQ5QTc1RUY4QkMzMzMyMTY3IiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjU5OEFENjg4Q0MxNjExRTQ5QTc1RUY4QkMzMzMyMTY3Ii8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+VU513gAAADVJREFUeNrs0DENACAQBDBIWLGBJQby/mUcJn5sJXQmOQMAAAAAAJqt+2prAAAAAACg2xdgANk6BEVuJgyMAAAAAElFTkSuQmCC');
  209. }
  210. /*******************************
  211. Site Overrides
  212. *******************************/