breadcrumb-item.scss 1.2 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758
  1. @use 'mixins/mixins' as *;
  2. @use 'mixins/utils' as *;
  3. @use 'common/var' as *;
  4. @include b(breadcrumb) {
  5. @include e(separator) {
  6. margin: 0 9px;
  7. font-weight: bold;
  8. color: getCssVar('text-color', 'placeholder');
  9. &.#{$namespace}-icon {
  10. margin: 0 6px;
  11. font-weight: normal;
  12. svg {
  13. vertical-align: middle;
  14. }
  15. }
  16. }
  17. @include e(item) {
  18. float: left;
  19. display: inline-flex;
  20. align-items: center;
  21. @include e(inner) {
  22. color: getCssVar('text-color', 'regular');
  23. &.is-link,
  24. & a {
  25. font-weight: bold;
  26. text-decoration: none;
  27. transition: getCssVar('transition', 'color');
  28. color: getCssVar('text-color', 'primary');
  29. &:hover {
  30. color: getCssVar('color-primary');
  31. cursor: pointer;
  32. }
  33. }
  34. }
  35. &:last-child {
  36. .#{$namespace}-breadcrumb__inner,
  37. .#{$namespace}-breadcrumb__inner a {
  38. &,
  39. &:hover {
  40. font-weight: normal;
  41. color: getCssVar('text-color', 'regular');
  42. cursor: text;
  43. }
  44. }
  45. .#{$namespace}-breadcrumb__separator {
  46. display: none;
  47. }
  48. }
  49. }
  50. }