1
0
mirror of https://github.com/kirsle/kirsle.net synced 2024-12-22 06:59:29 +00:00

Add nav jump button for mobile

This commit is contained in:
Noah 2014-10-16 02:00:46 +00:00
parent 2453f0696f
commit d4a9e51d7d
2 changed files with 20 additions and 0 deletions

View File

@ -27,6 +27,10 @@
{% from "google-ads.inc.html" import leaderboard, nav_ads %} {% from "google-ads.inc.html" import leaderboard, nav_ads %}
<div class="mobile-nav">
<a href="#navbar" class="btn btn-primary"><i class="glyphicon glyphicon-list"></i></a>
</div>
<div class="k-supernova"></div> <div class="k-supernova"></div>
<div class="container-fluid"> <div class="container-fluid">
@ -71,6 +75,7 @@
<div class="col-sm-2 col-sm-pull-10"> <div class="col-sm-2 col-sm-pull-10">
<div class="k-navpanel"> <div class="k-navpanel">
<a name="navbar"></a>
<div class="k-section">Kirsle</div> <div class="k-section">Kirsle</div>
<ul> <ul>
<li>&#0187; <a href="/">Homepage</a> (<a href="{{ url_for('blog.rss') }}">RSS</a>)</li> <li>&#0187; <a href="/">Homepage</a> (<a href="{{ url_for('blog.rss') }}">RSS</a>)</li>

View File

@ -114,6 +114,21 @@ p {
margin: 10px 0px; margin: 10px 0px;
} }
/* Our own custom nav button for Bootstrap */
.mobile-nav {
display: none; /* for small screens only */
position: absolute;
z-index: 100;
top: 10px;
right: 10px;
}
@media (max-width: 768px) {
.mobile-nav {
display: block;
}
}
/******************************************************************************* /*******************************************************************************
* General CSS Classes * * General CSS Classes *
******************************************************************************/ ******************************************************************************/