_dark.scss 2.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138
  1. // CONTENT BACKGROUND
  2. // -----------------------------------------------------------------------------
  3. /* Dark - Background */
  4. html.dark {
  5. &,
  6. body {
  7. background-color: $dark-bg;
  8. }
  9. &.boxed {
  10. .content-body {
  11. background-color: $dark-bg;
  12. }
  13. }
  14. }
  15. html.dark {
  16. body {
  17. color: $dark-default-text;
  18. }
  19. }
  20. // ELEMENTS
  21. // -----------------------------------------------------------------------------
  22. /* Dark - Titles */
  23. html.dark {
  24. h1,
  25. .h1,
  26. h2,
  27. .h2,
  28. h3,
  29. .h3,
  30. h4,
  31. .h4,
  32. h5,
  33. .h5,
  34. h6,
  35. .h6 {
  36. color: #FFF;
  37. }
  38. }
  39. /* Dark - Alerts */
  40. html.dark {
  41. .alert h1,
  42. .alert .h1,
  43. .alert h2,
  44. .alert .h2,
  45. .alert h3,
  46. .alert .h3,
  47. .alert h4,
  48. .alert .h4,
  49. .alert h5,
  50. .alert .h5,
  51. .alert h6,
  52. .alert .h6 {
  53. color: #111;
  54. }
  55. }
  56. /* Dark - Blockquote */
  57. html.dark {
  58. blockquote {
  59. border-color: $dark-color-3;
  60. }
  61. }
  62. /* Dark - Helpers */
  63. html.dark {
  64. .text-dark {
  65. color: #FFF !important;
  66. }
  67. }
  68. // NAV LIST
  69. // -----------------------------------------------------------------------------
  70. html.dark {
  71. ul.nav-list.primary > li a {
  72. border-bottom-color: #282d36;
  73. &:hover {
  74. background-color: #282d36;
  75. }
  76. }
  77. }
  78. // PAGINATION
  79. // -----------------------------------------------------------------------------
  80. html.dark {
  81. .pagination > li > a,
  82. .pagination > li > span {
  83. background-color: $dark-color-3;
  84. border-color: $dark-color-5;
  85. }
  86. .pagination > li.active > a,
  87. .pagination > li.active > span {
  88. background-color: $color-primary;
  89. border-color: $dark-color-5;
  90. }
  91. }
  92. // DROP-DOWN MENU
  93. // -----------------------------------------------------------------------------
  94. html.dark {
  95. .dropdown-menu {
  96. background-color: $dark-color-3;
  97. > li > a {
  98. color: #EEE;
  99. &:hover,
  100. &:focus {
  101. background-color: $dark-color-1;
  102. color: #FFF;
  103. }
  104. }
  105. }
  106. }
  107. // HR
  108. // -----------------------------------------------------------------------------
  109. html.dark {
  110. hr.dotted,
  111. hr.solid {
  112. border-color: #4C4C4C;
  113. }
  114. }
  115. // THUMBS
  116. // -----------------------------------------------------------------------------
  117. html.dark {
  118. .img-thumbnail,
  119. .thumbnail {
  120. background-color: $dark-color-2;
  121. border-color: $dark-color-3;
  122. }
  123. }