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.

116 lines
2.4 KiB

11 years ago
11 years ago
11 years ago
  1. /*
  2. * # Dividers
  3. * http://github.com/quirkyinc/semantic
  4. *
  5. *
  6. * Copyright 2013 Contributors
  7. * Released under the MIT license
  8. * http://opensource.org/licenses/MIT
  9. *
  10. * Released: April 17 2013
  11. */
  12. /*******************************
  13. Divider
  14. *******************************/
  15. .ui.divider {
  16. margin: 1em 0em;
  17. height: 1px;
  18. background-color: rgba(0, 0, 0, 0.1);
  19. border-top: none;
  20. border-bottom: 1px solid rgba(255, 255, 255, 0.8);
  21. }
  22. .ui.vertical.divider,
  23. .ui.horizontal.divider {
  24. position: relative;
  25. margin: 25px 0px 10px;
  26. font-size: 14px;
  27. line-height: 14px;
  28. text-align: center;
  29. text-transform: uppercase;
  30. text-shadow: 0px 1px 0px rgba(255, 255, 255, 0.8);
  31. color: #555555;
  32. font-weight: bold;
  33. }
  34. .ui.divider .rule {
  35. position: absolute;
  36. top: 6px;
  37. width: 45%;
  38. height: 1px;
  39. background-color: #ADADAD;
  40. background-color: rgba(0, 0, 0, 0.1);
  41. border-bottom: 1px solid #F8F8F8;
  42. border-bottom: 1px solid rgba(255, 255, 255, 0.9);
  43. }
  44. .ui.divider .left.rule {
  45. left: 0px;
  46. }
  47. .ui.divider .right.rule {
  48. right: 0px;
  49. }
  50. .ui.divider .label {
  51. display: block;
  52. margin: 14px 0px 0px;
  53. text-transform: none;
  54. color: #333333;
  55. }
  56. /*--------------
  57. Vertical
  58. ---------------*/
  59. .vertical.ui.divider {
  60. position: absolute;
  61. top: 0px;
  62. left: 50%;
  63. height: 100%;
  64. margin: 0px 0px 0px -50px;
  65. min-width: 100px;
  66. color: #555555;
  67. font-weight: bold;
  68. }
  69. .vertical.ui.divider .rule {
  70. position: absolute;
  71. left: 50%;
  72. width: 1px;
  73. height: 45%;
  74. background-color: #ADADAD;
  75. background-color: rgba(0, 0, 0, 0.2);
  76. border-right: 1px solid #F8F8F8;
  77. border-right: 1px solid rgba(255, 255, 255, 0.9);
  78. }
  79. .vertical.ui.divider .top.rule {
  80. top: 0px;
  81. }
  82. .vertical.ui.divider .bottom.rule {
  83. top: auto;
  84. bottom: 0px;
  85. }
  86. .vertical.ui.divider .label {
  87. position: relative;
  88. top: 50%;
  89. margin-top: -7px;
  90. display: block;
  91. width: 100%;
  92. font-size: 14px;
  93. line-height: 14px;
  94. text-align: center;
  95. text-shadow: 0px 1px 0px rgba(255, 255, 255, 0.8);
  96. text-transform: none;
  97. color: #333333;
  98. }
  99. /* Inverted Color Divider (Black BG) */
  100. .ui.divider.inverted {
  101. text-shadow: 0px 1px 0px rgba(0, 0, 0, 0.8);
  102. color: #FFFFFF;
  103. }
  104. .ui.divider.inverted .rule {
  105. border-color: #4A4A4A;
  106. border-color: rgba(255, 255, 255, 0.2);
  107. }
  108. /*******************************
  109. Variations
  110. *******************************/
  111. /*--------------
  112. Clearing
  113. ---------------*/
  114. .ui.clearing.divider {
  115. clear: both;
  116. }