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.

132 lines
2.3 KiB

  1. .ui.divider {
  2. margin: 1rem 0rem;
  3. border-top: 1px solid rgba(0,0,0,.1);
  4. border-bottom: 1px solid rgba(255,255,255,.8);
  5. line-height: 1;
  6. height: 0;
  7. -webkit-box-sizing: border-box;
  8. -moz-box-sizing: border-box;
  9. -ms-box-sizing: border-box;
  10. box-sizing: border-box;
  11. -webkit-user-select: none;
  12. -moz-user-select: none;
  13. -ms-user-select: none;
  14. user-select: none;
  15. -webkit-tap-highlight-color: rgba(0,0,0,0);
  16. }
  17. .ui.vertical.divider,
  18. .ui.horizontal.divider {
  19. position: absolute;
  20. border: 0;
  21. height: 0;
  22. margin: 0;
  23. background-color: transparent;
  24. font-size: .875rem;
  25. font-weight: 700;
  26. text-align: center;
  27. text-transform: uppercase;
  28. color: rgba(0,0,0,.8);
  29. }
  30. .ui.vertical.divider {
  31. position: absolute;
  32. z-index: 2;
  33. top: 50%;
  34. right: 50%;
  35. margin: 0 -3% 0 0;
  36. width: 6%;
  37. height: 50%;
  38. line-height: 0;
  39. padding: 0;
  40. }
  41. .ui.vertical.divider:before,
  42. .ui.vertical.divider:after {
  43. position: absolute;
  44. right: 50%;
  45. content: " ";
  46. z-index: 3;
  47. border-right: 1px solid rgba(0,0,0,.1);
  48. border-left: 1px solid rgba(255,255,255,.8);
  49. width: 0;
  50. height: 80%;
  51. }
  52. .ui.vertical.divider:before {
  53. top: -100%;
  54. }
  55. .ui.vertical.divider:after {
  56. top: auto;
  57. bottom: 0;
  58. }
  59. .ui.horizontal.divider {
  60. position: relative;
  61. top: 0;
  62. right: 0;
  63. margin: 1rem 1.5rem;
  64. height: auto;
  65. padding: 0;
  66. line-height: 1;
  67. }
  68. .ui.horizontal.divider:before,
  69. .ui.horizontal.divider:after {
  70. position: absolute;
  71. content: " ";
  72. z-index: 3;
  73. width: 50%;
  74. top: 50%;
  75. height: 0;
  76. border-top: 1px solid rgba(0,0,0,.1);
  77. border-bottom: 1px solid rgba(255,255,255,.8);
  78. }
  79. .ui.horizontal.divider:before {
  80. right: 0;
  81. margin-right: -1.5rem;
  82. }
  83. .ui.horizontal.divider:after {
  84. right: auto;
  85. left: 0;
  86. margin-left: -1.5rem;
  87. }
  88. .ui.divider>.icon {
  89. margin: 0;
  90. font-size: 1rem;
  91. vertical-align: middle;
  92. }
  93. .ui.divider.inverted {
  94. color: #fff;
  95. }
  96. .ui.vertical.inverted.divider,
  97. .ui.horizontal.inverted.divider {
  98. color: rgba(255,255,255,.9);
  99. }
  100. .ui.divider.inverted,
  101. .ui.divider.inverted:after,
  102. .ui.divider.inverted:before {
  103. border-top-color: rgba(0,0,0,.15);
  104. border-bottom-color: rgba(255,255,255,.15);
  105. border-right-color: rgba(0,0,0,.15);
  106. border-left-color: rgba(255,255,255,.15);
  107. }
  108. .ui.fitted.divider {
  109. margin: 0;
  110. }
  111. .ui.clearing.divider {
  112. clear: both;
  113. }
  114. .ui.section.divider {
  115. margin-top: 2rem;
  116. margin-bottom: 2rem;
  117. }