diff options
Diffstat (limited to 'vendor/twbs/bootstrap/site/assets/scss/_sidebar.scss')
-rw-r--r-- | vendor/twbs/bootstrap/site/assets/scss/_sidebar.scss | 155 |
1 files changed, 65 insertions, 90 deletions
diff --git a/vendor/twbs/bootstrap/site/assets/scss/_sidebar.scss b/vendor/twbs/bootstrap/site/assets/scss/_sidebar.scss index 7c350f8e3..d893ba9dc 100644 --- a/vendor/twbs/bootstrap/site/assets/scss/_sidebar.scss +++ b/vendor/twbs/bootstrap/site/assets/scss/_sidebar.scss @@ -1,112 +1,87 @@ -// -// Left side navigation -// - .bd-sidebar { - order: 0; - // background-color: #f5f2f9; - border-bottom: 1px solid rgba(0, 0, 0, .1); - - @include media-breakpoint-up(md) { - @supports (position: sticky) { - position: sticky; - top: 4rem; - z-index: 1000; - height: subtract(100vh, 4rem); - } - border-right: 1px solid rgba(0, 0, 0, .1); - } - - @include media-breakpoint-up(xl) { - flex: 0 1 320px; + @include media-breakpoint-down(md) { + margin: 0 -.75rem 1rem; } } .bd-links { - width: 100%; - padding-top: 1rem; - padding-bottom: 1rem; - border-top: 1px solid rgba(0, 0, 0, .05); + overflow: auto; + font-weight: 600; @include media-breakpoint-up(md) { - @supports (position: sticky) { - max-height: subtract(100vh, 9rem); - overflow-y: auto; - } + position: sticky; + top: 5rem; + // Override collapse behaviors + // stylelint-disable-next-line declaration-no-important + display: block !important; + height: subtract(100vh, 7rem); + // Prevent focus styles to be cut off: + padding-left: .25rem; + margin-left: -.25rem; + overflow-y: auto; } -} - -.bd-search { - position: relative; // To contain the Algolia search - padding: 1rem 15px; - margin-right: -15px; - margin-left: -15px; - .form-control:focus { - border-color: $bd-purple-bright; - box-shadow: 0 0 0 3px rgba($bd-purple-bright, .25); + > ul { + @include media-breakpoint-down(md) { + padding: 1.5rem .75rem; + background-color: $gray-100; + border-bottom: 1px solid $gray-200; + } } -} - -.bd-search-docs-toggle { - color: $gray-900; -} - -.bd-sidenav { - display: none; -} -.bd-toc-link { - display: block; - padding: .25rem 1.5rem; - font-weight: 600; - color: rgba(0, 0, 0, .65); - - &:hover { - color: rgba(0, 0, 0, .85); - text-decoration: none; + a { + padding: .1875rem .5rem; + margin-top: .125rem; + margin-left: 1.25rem; + color: rgba($black, .65); + text-decoration: if($link-decoration == none, null, none); + + &:hover, + &:focus { + color: rgba($black, .85); + text-decoration: if($link-hover-decoration == underline, none, null); + background-color: rgba($bd-purple-bright, .1); + } } -} -.bd-toc-item { - &.active { - margin-bottom: 1rem; - - &:not(:first-child) { - margin-top: 1rem; + .btn { + // Custom styles (as we don't have a completely neutral button style) + padding: .25rem .5rem; + font-weight: 600; + color: rgba($black, .65); + background-color: transparent; + border: 0; + + &:hover, + &:focus { + color: rgba($black, .85); + background-color: rgba($bd-purple-bright, .1); } - > .bd-toc-link { - color: rgba(0, 0, 0, .85); - - &:hover { - background-color: transparent; - } + &:focus { + box-shadow: 0 0 0 1px rgba($bd-purple-bright, .7); } - > .bd-sidenav { - display: block; + // Add chevron if there's a submenu + &::before { + width: 1.25em; + line-height: 0; // Align in the middle + content: escape-svg($sidebar-collapse-icon); + @include transition(transform .35s ease); + transform-origin: .5em 50%; } - } -} -// All levels of nav -.bd-sidebar .nav > li > a { - display: block; - padding: .25rem 1.5rem; - @include font-size(90%); - color: rgba(0, 0, 0, .65); -} + &[aria-expanded="true"] { + color: rgba($black, .85); -.bd-sidebar .nav > li > a:hover { - color: rgba(0, 0, 0, .85); - text-decoration: none; - background-color: transparent; -} + &::before { + transform: rotate(90deg); + } + } + } -.bd-sidebar .nav > .active > a, -.bd-sidebar .nav > .active:hover > a { - font-weight: 600; - color: rgba(0, 0, 0, .85); - background-color: transparent; + .active { + font-weight: 600; + color: rgba($black, .85); + } } |