_breadcrumb.scss 2.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111
  1. .breadcrumb {
  2. font-size: $font-size-base;
  3. font-family: $font-family-monospace;
  4. background-color: transparent;
  5. padding: 0.5rem 0 0.5rem $breadcrumb-padding-x !important;
  6. border-left: 1px solid lighten($gray-600, 10%);
  7. border-radius: 0;
  8. > li {
  9. + li::before {
  10. padding-right: .6rem;
  11. padding-left: .6rem;
  12. }
  13. }
  14. /* .breadcrumb-item:first-child{
  15. a{
  16. &:after{
  17. content: "\e965";
  18. font-family: 'feather';
  19. }
  20. }
  21. } */
  22. .breadcrumb-item + .breadcrumb-item{
  23. padding-left: 0;
  24. &:before{
  25. content: "\e847";
  26. font-family: 'feather';
  27. color: $body-color;
  28. }
  29. }
  30. .breadcrumb-item.active{
  31. color: $body-color;
  32. }
  33. }
  34. /* Custom scss for page headers style */
  35. .breadcrumbs-right{
  36. .breadcrumb {
  37. float:right;
  38. }
  39. }
  40. .breadcrumbs-top{
  41. .breadcrumb {
  42. margin: 0;
  43. padding: 0;
  44. }
  45. }
  46. /* Component Specific */
  47. #component-breadcrumbs{
  48. .breadcrumb{
  49. border: none;
  50. .breadcrumb-item + .breadcrumb-item:before{
  51. font-family: none;
  52. padding: 0 1rem;
  53. }
  54. }
  55. .default-breadcrumb{
  56. &.breadcrumb{
  57. .breadcrumb-item + .breadcrumb-item:before{
  58. content: "/";
  59. }
  60. }
  61. }
  62. .breadcrumb-dots{
  63. &.breadcrumb{
  64. .breadcrumb-item + .breadcrumb-item:before{
  65. content: ".";
  66. position: relative;
  67. top: -4px;
  68. }
  69. }
  70. }
  71. .breadcrumb-dashes{
  72. &.breadcrumb{
  73. .breadcrumb-item + .breadcrumb-item:before{
  74. content: "-";
  75. }
  76. }
  77. }
  78. .breadcrumb-pipes{
  79. &.breadcrumb{
  80. .breadcrumb-item + .breadcrumb-item:before{
  81. content: "|";
  82. }
  83. }
  84. }
  85. .breadcrumb-chevron{
  86. &.breadcrumb{
  87. .breadcrumb-item + .breadcrumb-item:before{
  88. content: "\e844";
  89. font-family: 'feather';
  90. position: relative;
  91. top: 1px;
  92. }
  93. }
  94. }
  95. }
  96. #breadcrumb-alignment{
  97. .breadcrumb-wrapper{
  98. box-shadow: 1px 1px 10px rgba($pure-black,.1);
  99. padding: 1px;
  100. border-radius: 10px;
  101. .breadcrumb{
  102. margin-top: .8rem;
  103. }
  104. }
  105. }