Skip to content
This repository was archived by the owner on Sep 15, 2020. It is now read-only.

Commit fef6451

Browse files
XhmikosRXhmikosR
committed
Simplify navbar.
1 parent 117e384 commit fef6451

File tree

2 files changed

+49
-52
lines changed

2 files changed

+49
-52
lines changed

‎source/_includes/header.html‎

Lines changed: 45 additions & 35 deletions
Original file line numberDiff line numberDiff line change
@@ -74,44 +74,54 @@ <h4><span class="fa fa-exclamation-circle" aria-hidden="true"></span> Warning</h
7474
<![endif]-->
7575
<nav class="navbar navbar-default navbar-fixed-top">
7676
<div class="container">
77+
<div class="row">
7778

78-
<div class="navbar-header">
79-
<a class="navbar-brand" href="/">MPC-HC</a>
80-
<button type="button" class="navbar-toggle collapsed" data-target="#navbar" data-toggle="collapse" aria-expanded="false">
81-
<span class="sr-only">Toggle navigation</span>
82-
<span class="icon-bar top-bar"></span>
83-
<span class="icon-bar middle-bar"></span>
84-
<span class="icon-bar bottom-bar"></span>
85-
</button>
86-
</div>
87-
88-
<div id="navbar" class="navbar-collapse collapse">
89-
<ul class="nav navbar-nav navbar-left">
90-
<li{% if page.slug == "downloads" %} class="active"{% endif %}><a href="/downloads/"><span class="fa fa-download fa-fw" aria-hidden="true"></span> Downloads</a></li>
91-
<li{% if page.slug == "changelog" %} class="active"{% endif %}><a href="/changelog/"><span class="fa fa-file-text fa-fw" aria-hidden="true"></span> Changelog</a></li>
92-
<li{% if page.slug == "faq" %} class="active"{% endif %}><a href="/faq/"><span class="fa fa-info fa-fw" aria-hidden="true"></span> FAQ</a></li>
93-
<li{% if page.slug == "about" %} class="active"{% endif %}><a href="/about/"><span class="fa fa-users fa-fw" aria-hidden="true"></span> About</a></li>
94-
<li class="dropdown">
95-
<a id="dLabel" href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">
96-
<span class="fa fa-question fa-fw" aria-hidden="true"></span> Help <span class="fa fa-caret-down" aria-hidden="true"></span>
79+
<div class="col-md-3">
80+
<div class="navbar-header">
81+
<a class="navbar-brand" href="/">
82+
<img src="/assets/img/[email protected]" alt="Logo" width="20" height="20">
83+
MPC-HC
9784
</a>
98-
<ul class="dropdown-menu" aria-labelledby="dLabel">
99-
<li {% if page.slug == "contact-us" %} class="active"{% endif %}><a href="/contact-us/">Contact us</a></li>
100-
<li class="divider"></li>
101-
<li><a href="https://trac.mpc-hc.org/wiki/How_to_Report_Issues">Bug reports</a></li>
102-
<li><a href="https://trac.mpc-hc.org/">Wiki</a></li>
85+
86+
<button type="button" class="navbar-toggle collapsed" data-target="#navbar" data-toggle="collapse" aria-expanded="false">
87+
<span class="sr-only">Toggle navigation</span>
88+
<span class="icon-bar top-bar"></span>
89+
<span class="icon-bar middle-bar"></span>
90+
<span class="icon-bar bottom-bar"></span>
91+
</button>
92+
</div>
93+
</div> <!-- .col-md-3 -->
94+
95+
<div class="col-md-9">
96+
<div id="navbar" class="navbar-collapse collapse">
97+
<ul class="nav navbar-nav navbar-left">
98+
<li{% if page.slug == "downloads" %} class="active"{% endif %}><a href="/downloads/"><span class="fa fa-download fa-fw" aria-hidden="true"></span> Downloads</a></li>
99+
<li{% if page.slug == "changelog" %} class="active"{% endif %}><a href="/changelog/"><span class="fa fa-file-text fa-fw" aria-hidden="true"></span> Changelog</a></li>
100+
<li{% if page.slug == "faq" %} class="active"{% endif %}><a href="/faq/"><span class="fa fa-info fa-fw" aria-hidden="true"></span> FAQ</a></li>
101+
<li{% if page.slug == "about" %} class="active"{% endif %}><a href="/about/"><span class="fa fa-users fa-fw" aria-hidden="true"></span> About</a></li>
102+
<li class="dropdown">
103+
<a id="dLabel" href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">
104+
<span class="fa fa-question fa-fw" aria-hidden="true"></span> Help <span class="fa fa-caret-down" aria-hidden="true"></span>
105+
</a>
106+
<ul class="dropdown-menu" aria-labelledby="dLabel">
107+
<li {% if page.slug == "contact-us" %} class="active"{% endif %}><a href="/contact-us/">Contact us</a></li>
108+
<li class="divider"></li>
109+
<li><a href="https://trac.mpc-hc.org/wiki/How_to_Report_Issues">Bug reports</a></li>
110+
<li><a href="https://trac.mpc-hc.org/">Wiki</a></li>
111+
</ul>
112+
</li>
103113
</ul>
104-
</li>
105-
</ul>
106-
<ul class="nav navbar-nav navbar-right">
107-
<li {% if page.slug == "donate" %} class="active"{% endif %}>
108-
<a href="/donate/" title="Donate">
109-
<span class="fa fa-cc-paypal fa-2x" aria-hidden="true"></span>
110-
<span class="sr-only">Donate</span>
111-
</a>
112-
</li>
113-
</ul>
114-
</div> <!-- .navbar-collapse -->
114+
<ul class="nav navbar-nav navbar-right">
115+
<li {% if page.slug == "donate" %} class="active"{% endif %}>
116+
<a href="/donate/" title="Donate">
117+
<span class="fa fa-cc-paypal fa-2x" aria-hidden="true"></span>
118+
<span class="sr-only">Donate</span>
119+
</a>
120+
</li>
121+
</ul>
122+
</div> <!-- .navbar-collapse -->
123+
</div> <!-- .col-md-9 -->
124+
</div> <!-- .row -->
115125

116126
</div> <!-- .container -->
117127
</nav>

‎source/assets/css/style.css‎

Lines changed: 4 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,7 @@ body {
1919
}
2020

2121
.button-sub {
22-
margin-top: 0.5em;
22+
margin-top: 1em;
2323
}
2424

2525
.page-home .lead {
@@ -89,15 +89,10 @@ body {
8989
content: "\f078"; /* fa-chevron-down */
9090
}
9191

92-
.navbar-brand::before {
93-
background: url("../img/[email protected]") no-repeat;
94-
background-size: 20px 20px;
95-
content: "";
92+
.navbar-brand img {
9693
display: inline-block;
97-
margin-right: 8px;
94+
margin-right: 2px;
9895
vertical-align: middle;
99-
width: 20px;
100-
height: 20px;
10196
}
10297

10398
.full-news a[href*="//"]:not([href^="mpc-hc.org"]):not([href*="trac.mpc-hc.org"]):after,
@@ -464,10 +459,6 @@ h6[id]:before {
464459
}
465460

466461
@media (min-width: 768px) {
467-
.navbar-left {
468-
margin-left: 4em;
469-
}
470-
471462
.navbar-right > li:last-of-type > a {
472463
padding-bottom: 10px;
473464
padding-top: 11px;
@@ -515,12 +506,8 @@ h6[id]:before {
515506
}
516507

517508
@media (min-width: 768px) and (max-width: 991px) {
518-
.navbar-left {
519-
margin-left: 2em;
520-
}
521-
522509
.nav > li > a {
523-
font-size: 0.90em;
510+
font-size: 0.9em;
524511
}
525512

526513
}

0 commit comments

Comments
 (0)