3 // Kickstart any navigation component with a set of style resets. Works with
4 // `<nav>`s or `<ul>`s.
15 padding: $nav-link-padding;
17 @include hover-focus {
18 text-decoration: none;
21 // Disabled state lightens text and removes hover/tab effects
23 color: $nav-disabled-link-color;
24 cursor: $cursor-disabled;
34 border-bottom: $nav-tabs-border-width solid $nav-tabs-border-color;
37 margin-bottom: -$nav-tabs-border-width;
41 border: $nav-tabs-border-width solid transparent;
42 @include border-top-radius($nav-tabs-border-radius);
44 @include hover-focus {
45 border-color: $nav-tabs-link-hover-border-color $nav-tabs-link-hover-border-color $nav-tabs-border-color;
49 color: $nav-disabled-link-color;
50 background-color: transparent;
51 border-color: transparent;
56 .nav-item.show .nav-link {
57 color: $nav-tabs-active-link-hover-color;
58 background-color: $nav-tabs-active-link-hover-bg;
59 border-color: $nav-tabs-active-link-hover-border-color $nav-tabs-active-link-hover-border-color $nav-tabs-active-link-hover-bg;
63 // Make dropdown border overlap tab border
64 margin-top: -$nav-tabs-border-width;
65 // Remove the top rounded corners here since there is a hard edge above the menu
66 @include border-top-radius(0);
77 @include border-radius($nav-pills-border-radius);
81 .nav-item.show .nav-link {
82 color: $nav-pills-active-link-color;
84 background-color: $nav-pills-active-link-bg;
110 // Hide tabbable panes to start, show them when `.active`