font-weight: inherit;
}
-.nav-list ul {
- list-style-type: none;
- margin: 0;
-}
-
-.nav-list li {
- display: inline;
- padding: 0 5px 0 5px;
-}
-
-.mobile-nav-list ul {
- list-style-type: none;
- margin: 0;
-}
-
-.mobile-nav-list li {
- font-size: 1.5em;
- padding: 0 20px 0 10px;
-}
-
-.mobile-nav-item {
- padding: 5px 0px 5px 0px;
- border-bottom: 1px solid black;
- width: 100%;
- color: #999999;
+.top-bar-section ul li > a {
+ font-family: inherit;
+ font-size: 1em;
}
-#header-nav {
- text-align: right;
- font-size: 1.3em;
+#main-header {
+ background: #333333;
+ color: #d4d4d4;
}
#header-login-nav {
#header-login-nav ul {
color: #d4d4d4;
font: 0.8em 'adelle-sans';
+ list-style-type: none;
+ margin: 0;
}
-#logo-container {
- padding: 5px 5px 5px 5px;
-}
-
-#main-header {
- background: #333333;
- color: #d4d4d4;
- padding: 1em 0 0.4em 0;
+#header-login-nav li {
+ display: inline;
+ padding: 0 5px 0 5px;
}
.gradient-bar
+++ /dev/null
-;(function ($, window, document, undefined) {
- 'use strict';
-
- Foundation.libs.offcanvas = {
- name : 'offcanvas',
-
- version : '5.2.1',
-
- settings : {},
-
- init : function (scope, method, options) {
- this.events();
- },
-
- events : function () {
- var S = this.S;
-
- S(this.scope).off('.offcanvas')
- .on('click.fndtn.offcanvas', '.left-off-canvas-toggle', function (e) {
- e.preventDefault();
- S(this).closest('.off-canvas-wrap').toggleClass('move-right');
- })
- .on('click.fndtn.offcanvas', '.exit-off-canvas', function (e) {
- e.preventDefault();
- S(".off-canvas-wrap").removeClass("move-right");
- })
- .on('click.fndtn.offcanvas', '.left-off-canvas-menu a', function (e) {
- e.preventDefault();
- var href = $(this).attr('href');
- S('.off-canvas-wrap').on('transitionend webkitTransitionEnd oTransitionEnd', function(e) {
- window.location = href
- S('.off-canvas-wrap').off('transitionend webkitTransitionEnd oTransitionEnd');
- });
- S(".off-canvas-wrap").removeClass("move-right");
- })
- .on('click.fndtn.offcanvas', '.right-off-canvas-toggle', function (e) {
- e.preventDefault();
- S(this).closest(".off-canvas-wrap").toggleClass("move-left");
- })
- .on('click.fndtn.offcanvas', '.exit-off-canvas', function (e) {
- e.preventDefault();
- S(".off-canvas-wrap").removeClass("move-left");
- })
- .on('click.fndtn.offcanvas', '.right-off-canvas-menu a', function (e) {
- e.preventDefault();
- var href = $(this).attr('href');
- S('.off-canvas-wrap').on('transitionend webkitTransitionEnd oTransitionEnd', function(e) {
- window.location = href
- S('.off-canvas-wrap').off('transitionend webkitTransitionEnd oTransitionEnd');
- });
- S(".off-canvas-wrap").removeClass("move-left");
- });
- },
-
- reflow : function () {}
- };
-}(jQuery, this, this.document));
</head>
-<body class="off-canvas-wrap">
- <div class="inner-wrap">
+<body>
- <!-- include header -->
- {% include 'header.html' %}
- <!-- end include header -->
+ <!-- include header -->
+ {% include 'header.html' %}
+ <!-- end include header -->
- <!-- block content -->
- {% block raw_content %}
- {% endblock %}
- <!-- end block content -->
-
- <!-- include footer-->
- {% include 'footer.html' %}
- <!-- end include footer-->
+ <!-- block content -->
+ {% block raw_content %}
+ {% endblock %}
+ <!-- end block content -->
- <a class="exit-off-canvas"></a>
+ <!-- include footer-->
+ {% include 'footer.html' %}
+ <!-- end include footer-->
- <!-- block bodyscripts -->
- {% block bodyscripts %}
- {% endblock %}
- <!-- end block bodyscripts -->
- <script src="{{ STATIC_URL }}js/opentip-jquery-excanvas.min.js"></script>
- <script src="{{ STATIC_URL }}js/foundation.min.js"></script>
- <script src="{{ STATIC_URL }}js/foundation.offcanvas.js"></script>
- <script>
- $(document).foundation();
- </script>
- </div>
+ <!-- block bodyscripts -->
+ {% block bodyscripts %}
+ {% endblock %}
+ <!-- end block bodyscripts -->
+ <script src="{{ STATIC_URL }}js/opentip-jquery-excanvas.min.js"></script>
+ <script src="{{ STATIC_URL }}js/foundation.min.js"></script>
+ <script>
+ $(document).foundation();
+ </script>
</body>
</html>
</div>
- <div id="main-header" class="museo300">
- <div class="row">
- <div id="logo-container" class="small-12 large-4 columns">
- <div style="display: inline;">
- <a class="left-off-canvas-toggle show-for-medium-down"><i class="fa fa-bars fa-lg"></i> </a>
- <a href="/">
- <img src="{{ STATIC_URL }}img/global_header_logo.png" alt="global_header_logo" width="144" height="17" />
- </a>
- </div>
- </div><!--/logo container-->
-
- <div id="header-nav" class="large-8 columns nav-list show-for-large-up">
- {% if request.user.is_authenticated %}
- <ul>
- <li><a href="/">Courses</a></li>
- <li>My Notes</li>
- </ul>
- {% else %}
- <ul>
- <li>Courses</li>
+ <div class="contain-to-grid">
+ <nav id="main-header" class="top-bar" data-topbar>
+ <ul class="title-area">
+ <li class="name">
+ <h1 class="museo700"><a href="/"><img src="{{ STATIC_URL }}img/global_header_logo.png" alt="KarmaNotes" /></a></h1>
+ </li>
+ <li class="toggle-topbar menu-icon">
+ <a href="#">Menu</a>
+ </li>
+ </ul>
+ <section class="top-bar-section">
+ <ul class="right museo300">
+ <li><a href="/">Courses</a></li>
+ {% if request.user.is_authenticated %}
+ <li class="hide-for-large-up"><a href="{% url 'accounts_profile' %}">Dashboard</a></li>
+ <li class="hide-for-large-up"><a href="{% url 'accounts_profile' %}#control_panel">My Account</a></li>
+ <li class="hide-for-large-up"><a href="{% url 'account_logout' %}">Log Out</a></li>
+ {% else %}
<li><a href="{% url 'account_login' %}">Log In</a></li>
<li><a href="{% url 'account_signup' %}">Sign Up</a></li>
- </ul>
- {% endif %}
- </div>
-
- </div>
+ {% endif %}
+ </ul>
+ </section>
+ </nav>
</div>
</header><!--/global header-->
-<aside class="left-off-canvas-menu mobile-nav-list museo700">
- <ul>
- <li><div class="mobile-nav-item"><a href="/">Courses</a></div></li>
- {% if request.user.is_authenticated %}
- <li><div class="mobile-nav-item">My Notes</div></li>
- <li><div class="mobile-nav-item"><a href="{% url 'accounts_profile' %}">Dashboard</a></div></li>
- <li><div class="mobile-nav-item"><a href="{% url 'accounts_profile' %}#control_panel">My Account</a></div></li>
- <li><div class="mobile-nav-item"><a href="{% url 'account_logout' %}">Log Out</a></div></li>
- {% else %}
- <li><div class="mobile-nav-item"><a href="{% url 'account_login' %}">Log In</a></div></li>
- <li><div class="mobile-nav-item"><a href="{% url 'account_signup' %}">Sign Up</a></div></li>
- {% endif %}
- </ul>
-</aside>