Mercurial > public > sg101

view sg101/templates/v3/base.html @ 1066:9410dc5b3103

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
Separate logo areas for small / medium screens.
author Brian Neal <bgneal@gmail.com>
date Thu, 31 Mar 2016 20:20:29 -0500
parents 6a18e7ba0609
children 1868467244d2
line wrap: on
line source
<!doctype html>
<html class="no-js" lang="en">
{% load cache %}
{% load static from staticfiles %}
{% load contest_tags %}
{% load core_tags %}
{% load donations_tags %}
{% load irc_tags %}
{% load messages_tags %}
{% load poll_tags %}
{% load potd_tags %}
<head prefix="og: http://ogp.me/ns# fb: http://ogp.me/ns/fb#">
   <meta charset="utf-8">
   <meta name="Author" content="Brian Neal">
   <meta name="robots" content="all">
   <meta http-equiv="x-ua-compatible" content="ie=edge">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   {% block custom_meta %}{% endblock %}
   <title>SurfGuitar101.com | {% block title %}{% endblock %}</title>
   <link rel="stylesheet" href="{% static "css/v3/main.min.css" %}">
   <link rel="stylesheet" href="{% static "css/v3/foundation-icons.css" %}" />
   <link rel="shortcut icon" href="{% static "favicon.ico" %}">
   {% block custom_head %}{% endblock %}
   {% block custom_css %}{% endblock %}
</head>
<body>
<header id="base-header">
   <div class="top-bar">
      <div class="top-bar-left">
         <ul class="menu">
            <li><a href="/"><i class="fi-home size-24" title="SG101 Home"></i></a></li>
            {% if user.is_authenticated %}
               <li><a href="{% url 'bio-me' %}">{{ user.username }}'s Profile</a></li>
               <li><a href="{% url 'messages-inbox' %}">Private Messages
                  {% unread_messages %}</a></li>
               <li><a href="{% url 'accounts-logout' %}">Logout</a></li>
            {% else %}
               {% if request.path != "/accounts/logout/" %}
                  <li><a href="{% url 'accounts-login' %}?next={{ request.path }}">Login</a></li>
               {% else %}
                  <li><a href="{% url 'accounts-login' %}">Login</a></li>
               {% endif %}
               <li><a href="{% url 'accounts-register' %}">Register</a></li>
            {% endif %}
         </ul>
      </div>
      <div class="top-bar-right">
         <form id="top-search" method="get" action="{% url 'haystack_search' %}">
            <ul class="menu">
               <li><input type="search" placeholder="Search" name="q"></li>
               <li><button type="submit" class="button" form="top-search">Search</button></li>
            </ul>
            <input type="hidden" name="models" value="forums.topic" />
            <input type="hidden" name="models" value="forums.post" />
            <input type="hidden" name="models" value="news.story" />
            <input type="hidden" name="models" value="bio.userprofile" />
            <input type="hidden" name="models" value="weblinks.link" />
            <input type="hidden" name="models" value="downloads.download" />
            <input type="hidden" name="models" value="podcast.item" />
            <input type="hidden" name="models" value="ygroup.post" />
         </form>
      </div>
   </div>

{#------------------------- Header logo --------------------------------------#}
<div id="logo-row" class="row align-center show-for-medium">
   <div class="small-4 columns">
      <a href="/"><img src="{% static "images/v3-logo.png" %}" alt="SG101 logo"></a>
   </div>
   <div class="small-8 columns">
      <a href="/forums/topic/27440/">
      <img src="{% static "images/10yearsSG101-Rob_J.jpg" %}" alt="SG101 Turns 10 Years Old!"
            title="SG101 Turns 10 Years Old!"/></a>
   </div>
</div>

{#------------------------- Small screen logo orbit -------------------------#}
<div class="orbit hide-for-medium" role="region" aria-label="SG101 Logo and Banners" data-orbit>
  <ul class="orbit-container">
    <button class="orbit-previous"><span class="show-for-sr">Previous Slide</span>&#9664;&#xFE0E;</button>
    <button class="orbit-next"><span class="show-for-sr">Next Slide</span>&#9654;&#xFE0E;</button>
    <li class="is-active orbit-slide">
      <div class="row align-center hide-for-medium">
         <div class="small-6 columns">
            <a href="/"><img src="{% static "images/v3-logo.png" %}" alt="SG101 logo"></a>
         </div>
      </div>
    </li>
    <li class="orbit-slide">
      <div class="row align-center hide-for-medium">
         <div class="small-12 columns">
            <a href="/forums/topic/27440/">
            <img src="{% static "images/10yearsSG101-Rob_J.jpg" %}" alt="SG101 Turns 10 Years Old!"
                  title="SG101 Turns 10 Years Old!"/></a>
         </div>
      </div>
    </li>
  </ul>
  <nav class="orbit-bullets">
    <button class="is-active" data-slide="0"><span class="show-for-sr">First slide details.</span><span class="show-for-sr">Current Slide</span></button>
    <button data-slide="1"><span class="show-for-sr">Second slide details.</span></button>
  </nav>
</div>

{#--------------------------- Main Menus -------------------------------------#}

<div class="top-bar" id="main-menu">
   <div class="top-bar-title">
      <span data-responsive-toggle="responsive-menu" data-hide-for="medium">
         <span class="menu-icon dark" data-toggle></span>
      </span>
      <span class="hide-for-medium"><strong>Menu</strong></span>
   </div>
   <div id="responsive-menu">
   <div class="top-bar-left">
      <ul class="menu vertical medium-horizontal expanded" data-responsive-menu="drilldown medium-dropdown">
         <li><a href="#">News</a>
            <ul class="menu vertical">
               <li><a href="{% url 'news-index_page' %}">News</a></li>
               <li><a href="{% url 'news-submit' %}">Submit News</a></li>
            </ul>
         </li>
         <li><a href="#">Forums</a>
            <ul class="menu vertical">
               <li><a href="{% url 'forums-unread_topics' %}">Unread Topics</a></li>
               <li><a href="{% url 'forums-active_topics' 30 %}">Active Topics</a></li>
               <li><a href="{% url 'forums-index' %}">All Forums</a></li>
               <li><a href="{% url 'forums-my_posts' %}">My Posts</a></li>
               <li><a href="{% url 'forums-manage_favorites' %}">My Favorites</a></li>
               <li><a href="{% url 'forums-manage_subscriptions' %}">My Subscriptions</a></li>
               <li><a href="{% url 'forums-unanswered_topics' %}">Unanswered Topics</a></li>
            </ul>
         </li>
         <li><a href="#">Surf Music</a>
            <ul class="menu vertical">
               <li><a href="{% url 'gcalendar-index' %}">Calendar</a></li>
               <li><a href="{% url 'downloads-index' %}">Downloads</a></li>
               <li><a href="{% url 'podcast-main' %}">Podcast</a></li>
               <li><a href="{% url 'potd-view' %}">Photo of the Day</a></li>
               <li><a href="{% url 'weblinks-main' %}">Links</a></li>
               <li><a href="{% url 'bandmap-map' %}">Surf Band Map</a></li>
               <li><a href="{% url 'ygroup-thread_index' %}">Yahoo Group</a></li>
            </ul>
         </li>
         <li><a href="#">Site</a>
            <ul class="menu vertical">
               <li><a href="{% url 'contact-form' %}">Contact</a></li>
               <li><a href="{% url 'contests-index' %}">Contests</a></li>
               <li><a href="{% url 'donations-index' %}">Donations</a></li>
               <li><a href="{% url 'polls-main' %}">Polls</a></li>
               <li><a href="/store/">Store</a></li>
               <li><a href="http://wiki.surfguitar101.com">Wiki</a></li>
            </ul>
         </li>
         <li><a href="#">Members</a>
            <ul class="menu vertical">
               <li><a href="{% url 'irc-main' %}">Chat/IRC</a></li>
               <li><a href="{% url 'bio-member_list' type='user' %}">Member List</a></li>
               <li><a href="{% url 'bio-member_search' %}">Member Search</a></li>
               <li><a href="{% url 'membermap-index' %}">Member Map</a></li>
            </ul>
         </li>
      </ul>
   </div>
   </div>
</div>
</header>

<div class="row">
   <div class="medium-3 columns show-for-medium">
      {# cache 300 potd_block #}
         {% photo_of_the_day %}
      {# endcache #}
      {# cache 60 irc_block #}
         {% irc_status %}
      {# endcache #}
      {# cache 3600 poll_block #}
         {% latest_poll_block %}
      {# endcache #}
      {# cache 3600 contests_block #}
         {% latest_contests_block %}
      {# endcache #}
      {# cache 600 donations_block #}
         {% monthly_goal %}
      {# endcache #}
      {# cache 3600 birthday_block #}
         {% birthday_block %}
      {# endcache #}
   </div>
   <div class="small-12 medium-9 columns">
   {% block content %}{% endblock %}
   </div>
</div>

<footer>
<div class="row expanded callout secondary align-middle medium-unstack">
   <div class="columns">
      <a href="https://www.twitter.com/SurfGuitar101">
      <i class="fi-social-twitter size-72"></i>
      Follow SurfGuitar101 on Twitter!</a>
   </div>
   <div class="columns">
      <ul>
         <li><a href="{% url 'contact-form' %}">Contact Us</a></li>
         <li><a href="/about/">About Us</a></li>
         <li><a href="/policy/tos/">Terms of Service</a></li>
         <li><a href="/policy/privacy/">Privacy Policy</a></li>
         <li><a href="/colophon/">Colophon</a></li>
      </ul>
   </div>
   <div class="columns">
      <p>
         SurfGuitar101.com © 2004 - 2016 by Brian Neal. All comments and user 
         contributed articles are property of the posters.
      </p>
      <p>
         Thanks to all the surf bands, past and present. And thanks to all the
         fans who care about and keep surf music alive.
      </p>
   </div>
</div>
</footer>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<script src="{% static "js/v3/what-input.min.js" %}"></script>
<script src="{% static "js/v3/foundation.min.js" %}"></script>
<script src="{% static "js/v3/sg101.js" %}"></script>
</body>
</html>