codecheck

1
// core
2
.p-breadcrumb {
3
    overflow-x: auto;
4
}
5

6
.p-breadcrumb .p-breadcrumb-list {
7
    margin: 0;
8
    padding: 0;
9
    list-style-type: none;
10
    display: flex;
11
    align-items: center;
12
    flex-wrap: nowrap;
13
}
14

15
.p-breadcrumb .p-menuitem-text {
16
    line-height: 1;
17
}
18

19
.p-breadcrumb .p-menuitem-link {
20
    text-decoration: none;
21
    display: flex;
22
    align-items: center;
23
}
24

25
.p-breadcrumb .p-menuitem-separator {
26
    display: flex;
27
    align-items: center;
28
}
29

30
.p-breadcrumb::-webkit-scrollbar {
31
    display: none;
32
}
33

34
// theme
35
.p-breadcrumb {
36
    background: $breadcrumbBg;
37
    border: $breadcrumbBorder;
38
    border-radius: $borderRadius;
39
    padding: $breadcrumbPadding;
40

41
    .p-breadcrumb-list {
42
        li {
43
            .p-menuitem-link {
44
                transition: $listItemTransition;
45
                border-radius: $borderRadius;
46
                outline-color: transparent;
47

48
                &:focus-visible {
49
                    @include focused();
50
                }
51

52
                .p-menuitem-text {
53
                    color: $breadcrumbItemTextColor;
54
                }
55

56
                .p-menuitem-icon {
57
                    color: $breadcrumbItemIconColor;
58
                }
59
            }
60

61
            &.p-menuitem-separator {
62
                margin: 0 $inlineSpacing 0 $inlineSpacing;
63
                color: $breadcrumbSeparatorColor;
64
            }
65

66
            &:last-child {
67
                .p-menuitem-text {
68
                    color: $breadcrumbLastItemTextColor;
69
                }
70

71
                .p-menuitem-icon {
72
                    color: $breadcrumbLastItemIconColor;
73
                }
74
            }
75
        }
76
    }
77
}
78