Difference between revisions of "Template:Team:Michigan/navbar"

Line 10: Line 10:
 
<!-- Latest compiled and minified JavaScript -->
 
<!-- Latest compiled and minified JavaScript -->
 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
 +
 +
<style type="text/css">
 +
 +
.navbar-default {
 +
    border-color: rgba(34,34,34,.05);
 +
    font-family: 'Open Sans','Helvetica Neue',Arial,sans-serif;
 +
    background-color: transparent;
 +
    -webkit-transition: all .35s;
 +
    -moz-transition: all .35s;
 +
    transition: all .35s;
 +
}
 +
 +
.navbar-default .navbar-header .navbar-brand {
 +
    text-transform: uppercase;
 +
    font-family: 'Open Sans','Helvetica Neue',Arial,sans-serif;
 +
    font-weight: 700;
 +
    color: #f05f40;
 +
}
 +
 +
.navbar-default .navbar-header .navbar-brand:hover,
 +
.navbar-default .navbar-header .navbar-brand:focus {
 +
    color: #eb3812;
 +
}
 +
 +
.navbar-default .nav > li>a,
 +
.navbar-default .nav>li>a:focus {
 +
    text-transform: uppercase;
 +
    font-size: 13px;
 +
    font-weight: 700;
 +
    color: #222;
 +
}
 +
 +
.navbar-default .nav > li>a:hover,
 +
.navbar-default .nav>li>a:focus:hover {
 +
    color: #f05f40;
 +
}
 +
 +
.navbar-default .nav > li.active>a,
 +
.navbar-default .nav>li.active>a:focus {
 +
    color: #f05f40!important;
 +
    background-color: transparent;
 +
}
 +
 +
.navbar-default .nav > li.active>a:hover,
 +
.navbar-default .nav>li.active>a:focus:hover {
 +
    background-color: transparent;
 +
}
 +
 +
@media(min-width:768px) {
 +
    .navbar-default {
 +
        border-color: rgba(255,255,255,.3);
 +
        background-color: transparent;
 +
    }
 +
 +
    .navbar-default .navbar-header .navbar-brand {
 +
        color: rgba(255,255,255,.7);
 +
    }
 +
 +
    .navbar-default .navbar-header .navbar-brand:hover,
 +
    .navbar-default .navbar-header .navbar-brand:focus {
 +
        color: #fff;
 +
    }
 +
 +
    .navbar-default .nav > li>a,
 +
    .navbar-default .nav>li>a:focus {
 +
        color: rgba(255,255,255,.7);
 +
    }
 +
 +
    .navbar-default .nav > li>a:hover,
 +
    .navbar-default .nav>li>a:focus:hover {
 +
        color: #fff;
 +
    }
 +
 +
    .navbar-default.affix {
 +
        border-color: rgba(34,34,34,.05);
 +
        background-color: #000;
 +
    }
 +
 +
    .navbar-default.affix .navbar-header .navbar-brand {
 +
        font-size: 14px;
 +
        color: #f05f40;
 +
    }
 +
 +
    .navbar-default.affix .navbar-header .navbar-brand:hover,
 +
    .navbar-default.affix .navbar-header .navbar-brand:focus {
 +
        color: #eb3812;
 +
    }
 +
 +
    .navbar-default.affix .nav > li>a,
 +
    .navbar-default.affix .nav>li>a:focus {
 +
        color: #222;
 +
    }
 +
 +
    .navbar-default.affix .nav > li>a:hover,
 +
    .navbar-default.affix .nav>li>a:focus:hover {
 +
        color: #f05f40;
 +
    }
 +
}
 +
 +
</style>
  
 
</head>
 
</head>
 
<body>
 
<body>
−
<nav class="navbar navbar-default" style="position:fixed">
+
<nav class="navbar navbar-default navbar-fixed-top affix-top" id="mainNav">
 
                           <div class="collapse navbar-collapse">
 
                           <div class="collapse navbar-collapse">
 
                               <ul class="nav navbar-nav">
 
                               <ul class="nav navbar-nav">

Revision as of 23:59, 31 July 2016