_breadcrumbs.scss 1.5 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394
  1. @import "globals";
  2. /* BREADCRUMBS */
  3. div.breadcrumbs {
  4. font-size: 12px;
  5. font-weight: bold;
  6. text-transform: uppercase;
  7. line-height: $top-height;
  8. color: $top-text-color;
  9. padding: 10px 175px + 20px + 20px 10px 20px;
  10. visibility: hidden;
  11. white-space: nowrap;
  12. text-overflow: ellipsis;
  13. overflow: hidden;
  14. min-height: 32px;
  15. display: inline;
  16. @include for-mobile {
  17. padding: 20px 20px 10px 0;
  18. white-space: normal;
  19. text-overflow: clip;
  20. overflow: auto;
  21. }
  22. &.initialized {
  23. visibility: inherit;
  24. }
  25. body.menu-pinned & {
  26. padding-left: 0;
  27. }
  28. a {
  29. &, &:visited {
  30. color: $top-link-color;
  31. }
  32. &:focus, &:hover {
  33. color: $top-hover-link-color;
  34. }
  35. }
  36. }
  37. .breadcrumbs {
  38. &-separator {
  39. color: $top-separator-color;
  40. margin: 0 6px 0 6px;
  41. font-weight: bold !important;
  42. font-size: 15px;
  43. vertical-align: middle;
  44. }
  45. &-menu {
  46. float: left;
  47. display: inline-block;
  48. vertical-align: middle;
  49. cursor: pointer;
  50. line-height: 31px;
  51. padding: 0;
  52. &:hover {
  53. color: $hover-link-color;
  54. }
  55. body.menu-pinned & {
  56. display: none;
  57. }
  58. @include for-mobile {
  59. display: none;
  60. }
  61. }
  62. }
  63. .breadcrumbs-container {
  64. position: relative;
  65. min-height: 31px;
  66. padding: 10px 175px + 20px + 20px 10px 20px;
  67. box-shadow: 0 0 1px 1px rgba(0, 0, 0, 0.05);
  68. body.login & {
  69. display: none;
  70. }
  71. @include for-mobile {
  72. padding: 20px 20px 10px 20px;
  73. }
  74. @include for-phone {
  75. padding-left: 10px;
  76. }
  77. }