rooty/Bootstrap
0
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2024-12-02 14:24:19 +01:00
Code Issues Actions Packages Releases Activity

purple nav

Browse Source
This commit is contained in:
Mark Otto 2017-05-27 20:10:35 -07:00
parent 0322e7e83b
commit ed3b308c27
2 changed files with 9 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
docs/_includes/nav-home.html
View File

@ -1,4 +1,4 @@
<header class="navbar navbar-light navbar-sticky-top navbar-expand-md bd-navbar"> <header class="navbar navbar-dark navbar-sticky-top navbar-expand-md bd-navbar">
<div class="d-flex w-100 align-items-center justify-content-between d-md-none bd-navbar-brand-wrap"> <div class="d-flex w-100 align-items-center justify-content-between d-md-none bd-navbar-brand-wrap">
<a class="navbar-brand" href="{{ site.baseurl }}/"> <a class="navbar-brand" href="{{ site.baseurl }}/">
Bootstrap Bootstrap
@ -48,6 +48,6 @@
</li> </li>
</ul> </ul>
<a class="btn btn-primary mb-3 mb-md-0 ml-md-3" href="{{ site.download.source }}">Download</a> <a class="btn btn-outline-secondary mb-3 mb-md-0 ml-md-3" href="{{ site.download.source }}">Download</a>
</div> </div>
</header> </header>

24
docs/assets/scss/_nav.scss
View File

@ -5,37 +5,27 @@
// //
.bd-navbar { .bd-navbar {
// @include media-breakpoint-up(md) {
position: -webkit-sticky; position: -webkit-sticky;
position: sticky; position: sticky;
top: 0; top: 0;
z-index: 1030; // over everything in bootstrap z-index: 1030; // over everything in bootstrap
min-height: 4rem; min-height: 4rem;
// max-height: calc(100vh - 4rem); background-color: $bd-purple;
// overflow-y: auto;
// }
// padding-right: 0;
// padding-left: 0;
// margin-bottom: 2rem;
background-color: #fff;
background-clip: padding-box;
border-bottom: 1px solid rgba(0,0,0,.1); border-bottom: 1px solid rgba(0,0,0,.1);
box-shadow: 0 .5rem 1rem rgba(0,0,0,.05); box-shadow: 0 .5rem 1rem rgba(0,0,0,.05);
.navbar-nav { .navbar-nav {
.nav-link { .nav-link {
color: $bd-graphite-light; color: $bd-purple-light;
&.active, &.active,
&:hover, &:hover {
&:focus { color: #fff;
color: $gray-dark;
background-color: transparent; background-color: transparent;
} }
&.active { &.active {
font-weight: 500; font-weight: 500;
color: darken($gray-dark, 15%);
} }
} }
} }
@ -51,9 +41,9 @@
font-size: .875rem; font-size: .875rem;
} }
.navbar-brand { // .navbar-brand {
color: $bd-purple; // color: #fff;
} // }
.bd-navbar-brand-wrap { .bd-navbar-brand-wrap {
padding-top: .25rem; padding-top: .25rem;