amazeui
Version:
Sleek, intuitive, and powerful front-end framework for faster and easier web development.
58 lines (46 loc) • 1.33 kB
text/less
// Name: Breadcrumb
//
// Description: Define style for breadcrumb
//
// Component: `.am-breadcrumb`
//
// States: `.am-active`
//
// =============================================================================
/* ==========================================================================
Component: Breadcrumb
============================================================================ */
.@{ns}breadcrumb {
padding: .7em .5em;
margin-bottom: @line-height-computed;
list-style: none;
background-color: @breadcrumb-bg;
border-radius: @global-radius;
font-size: @breadcrumb-font-size;
> li {
display: inline-block;
[class*="@{ns}icon-"] {
&:before {
color: @breadcrumb-active-color;
margin-right: 5px;
}
}
+ li:before {
content: "@{breadcrumb-separator}\00a0"; // Unicode space added since inline-block means non-collapsing white-space
padding: 0 8px;
color: @breadcrumb-divider-color;
}
}
> .@{ns}active {
color: @breadcrumb-active-color;
}
.hook-breadcrumb;
}
.@{ns}breadcrumb-slash {
> li + li:before {
content: "/\00a0";
}
}
// Hooks
// =============================================================================
.hook-breadcrumb() {}