xshop/resources/sass/panel/_breadcrumbs.scss

$pnl-brc-height: 50px;

#panel-breadcrumb{
    height: $pnl-brc-height;
    background: #282d46;
    margin-bottom: 1rem;

    ul{
        padding: 0;
        display: grid;
        grid-auto-columns: minmax(0, 1fr);
        grid-auto-flow: column;
        list-style: none;
        //border: 1px solid black;
        border-radius: 4px ;
        transition: .5s;
        li{
            transition: 300ms;
            position: relative;
            overflow: hidden;
            a,span{
                height: $pnl-brc-height;
                display: flex;
                align-items: center;
                justify-content: center;
                padding: 0 1rem;
            }
            i{
                font-size: 25px;
                margin: 0 .5rem;
            }

            &:before {
                transition: 300ms;
                content: "";
                width: 37px;
                height: 37px;
                border: 1px solid black;
                transform: rotate(45deg);
                position: absolute;
                inset-inline-start: -1.05rem;
                background: #282d46;
                top: 7px;
            }

            &:first-child:before {
                display: none;
            }


            &:hover{
                background: #444e7c;
                //background-image: url("../images/pattern.png");

                & + li:before{
                    background: #444e7c;
                    //background-image: url("../images/pattern.png");
                }
            }
        }
    }

}

/*-500px width*/
@media (max-width: 600px) {
    #panel-breadcrumb{
        display: block;
        li{
            text-align: end;
        }

        span{
            display: none !important;
        }
        i{
            margin: 0;
            display: inline-block;
        }
        a{
            justify-content: end !important;
            padding-right: 0 !important;
            padding-left: 0 !important;
        }
    }


}