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.

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