Use different navbar on index and all other pages
This commit is contained in:
parent
764036c81e
commit
5489902885
4 changed files with 62 additions and 26 deletions
|
@ -2,33 +2,10 @@
|
|||
<meta name="url" content="" />
|
||||
<meta name="save_as" content="index.html" />
|
||||
<meta name="title" content="Homepage" />
|
||||
<meta name="template" content="page-home">
|
||||
</head>
|
||||
<body>
|
||||
<nav id="indexNav" class="navbar navbar-default navbar-fixed-top">
|
||||
<div class="container-fluid">
|
||||
<div class="navbar-header">
|
||||
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
|
||||
<span class="sr-only">Toggle navigation</span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
</button>
|
||||
<a class="navbar-brand page-scroll" href="#page-top">
|
||||
TheOrangeOne
|
||||
</a>
|
||||
</div>
|
||||
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
|
||||
<ul class="nav navbar-nav navbar-right">
|
||||
<li><a class="page-scroll" href="#about">About</a></li>
|
||||
<li><a class="page-scroll" href="#skills">Skills</a></li>
|
||||
<li><a class="page-scroll" href="#projects">Projects</a></li>
|
||||
<li><a class="page-scroll" href="#contact">Contact</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<header>
|
||||
<header class="bg-primary">
|
||||
<div class="header-content">
|
||||
<div class="header-content-inner">
|
||||
<h1>Welcome to my website</h1>
|
||||
|
|
|
@ -36,7 +36,7 @@
|
|||
);
|
||||
|
||||
// Offset for Main Navigation
|
||||
$('#indexNav').affix({
|
||||
$('#main-nav').affix({
|
||||
offset: {
|
||||
top: 100
|
||||
}
|
||||
|
|
|
@ -12,6 +12,30 @@
|
|||
<link rel="stylesheet" href="/static/css/index.css" type="text/css">
|
||||
</head>
|
||||
<body id="page-top">
|
||||
{% block navbar %}
|
||||
<nav id="main-nav" class="navbar navbar-default navbar-fixed-top">
|
||||
<div class="container-fluid">
|
||||
<div class="navbar-header">
|
||||
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
|
||||
<span class="sr-only">Toggle navigation</span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
</button>
|
||||
<a class="navbar-brand page-scroll" href="#page-top">
|
||||
TheOrangeOne
|
||||
</a>
|
||||
</div>
|
||||
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
|
||||
<ul class="nav navbar-nav navbar-right">
|
||||
<li><a class="page-scroll" href="/about/">About</a></li>
|
||||
<li><a class="page-scroll" href="/projects/">Projects</a></li>
|
||||
<li><a class="page-scroll" href="/contact/ ">Contact</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
{% endblock %}
|
||||
|
||||
{% block content %}{% endblock %}
|
||||
|
||||
|
|
35
theme/templates/page-home.html
Normal file
35
theme/templates/page-home.html
Normal file
|
@ -0,0 +1,35 @@
|
|||
{% extends "base.html" %}
|
||||
|
||||
{% block htmltitle %}
|
||||
{{ page.title }}
|
||||
{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
{{ page.content }}
|
||||
{% endblock %}
|
||||
|
||||
{% block navbar %}
|
||||
<nav id="main-nav" class="navbar navbar-default navbar-fixed-top index-nav">
|
||||
<div class="container-fluid">
|
||||
<div class="navbar-header">
|
||||
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
|
||||
<span class="sr-only">Toggle navigation</span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
</button>
|
||||
<a class="navbar-brand page-scroll" href="#page-top">
|
||||
TheOrangeOne
|
||||
</a>
|
||||
</div>
|
||||
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
|
||||
<ul class="nav navbar-nav navbar-right">
|
||||
<li><a class="page-scroll" href="#about">About</a></li>
|
||||
<li><a class="page-scroll" href="#skills">Skills</a></li>
|
||||
<li><a class="page-scroll" href="#projects">Projects</a></li>
|
||||
<li><a class="page-scroll" href="#contact">Contact</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
{% endblock %}
|
Reference in a new issue