feat: prepare breadcrumb
This commit is contained in:
parent
a5f67de09b
commit
2580d191ad
1 changed files with 34 additions and 12 deletions
|
@ -9,6 +9,7 @@ $color-button-dark: get-color("dark");
|
|||
|
||||
$button_large: $lineheight;
|
||||
$button_small: $lineheight_quarter;
|
||||
$breadcrumb_margin: $button-large/2.5;
|
||||
|
||||
@mixin button($size) {
|
||||
@include button-layout($size);
|
||||
|
@ -124,13 +125,24 @@ $grouped-test: $button-large/1.5 - 0.05rem ;
|
|||
}
|
||||
|
||||
.btn-group {
|
||||
padding: 0px;
|
||||
background-color:transparent;
|
||||
margin-bottom: 1.33em;
|
||||
& > .btn {
|
||||
@include border-radius($btn-radius);
|
||||
margin:0 $breadcrumb_margin 0 $breadcrumb_margin!important;
|
||||
}
|
||||
|
||||
.btn-group .btn {
|
||||
margin:0 $grouped-test 0 $grouped-test!important;
|
||||
&:not(:first-child) > .btn {
|
||||
border-top-left-radius: 0;
|
||||
border-bottom-left-radius:0;
|
||||
&:before {
|
||||
content: " "!important;
|
||||
border-left:1px solid rgba(0,0,0,0.2);
|
||||
}
|
||||
}
|
||||
|
||||
&:not(:last-child) > .btn {
|
||||
border-top-right-radius: 0;
|
||||
border-bottom-right-radius:0;
|
||||
}
|
||||
}
|
||||
|
||||
/* ------------------ BREADCRUMB ------------------- */
|
||||
|
@ -144,6 +156,7 @@ ul.breadcrumb, ol.breadcrumb, .breadcrumb {
|
|||
|
||||
.breadcrumb li.breadcrumb-item {
|
||||
padding:0;
|
||||
margin:0!important;
|
||||
&:before {
|
||||
display:none;
|
||||
}
|
||||
|
@ -152,18 +165,27 @@ ul.breadcrumb, ol.breadcrumb, .breadcrumb {
|
|||
display:inline-block;
|
||||
@include button($button-large);
|
||||
@include button-fullcontrol($color-background-alt, accentuate($color-background-alt), get-color("dark2"));
|
||||
margin:0 $button-large/2.5 0 $button-large/2.5;
|
||||
|
||||
&:before {
|
||||
content: " "!important;
|
||||
border-right:1px solid rgba(0,0,0,0.2);
|
||||
}
|
||||
margin:0 $breadcrumb_margin 0 $breadcrumb_margin;
|
||||
|
||||
&.active {
|
||||
@include button-fullcontrol($color-primary, $color-primary, $color-font-light);
|
||||
}
|
||||
}
|
||||
|
||||
&:not(:first-child) a, &:not(:first-child) > span {
|
||||
border-top-left-radius: 0;
|
||||
border-bottom-left-radius:0;
|
||||
&:before {
|
||||
content: " "!important;
|
||||
border-left:1px solid rgba(0,0,0,0.2);
|
||||
}
|
||||
}
|
||||
|
||||
&:not(:last-child) a, &:not(:last-child) > span {
|
||||
border-top-right-radius: 0;
|
||||
border-bottom-right-radius:0;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
// COLORIZE BUTTONS
|
||||
|
|
Loading…
Reference in a new issue