django - Pinax : Add new tab to the basic_projects application : Confused by documentation -
just cloned basic_project , trying customize following - http://pinaxproject.com/docs/0.7/tabs/#ref-tabs
created new app "myapp", added new tab right_nav , edited "site_tabs.css" well.
when click on tab, although page change myapp, background color of tab doesn't change.
this line in documentation - create myapps/base.html template pages under tab extend. make sure defines block body_class content myapp confusing me.
what "body_class" content myapp ?, "div" class having "{% block body_class%}" ?
my code of myapp page pretty simple right -
{% extends "site_base.html" %}
{% load i18n %}
{% load ifsetting_tag %}
{% block head_title %}
{% trans "custom app page" %}
{% endblock %}
< div class="myapp">
< h1 >
{% trans "custom app page" %}</h1>
{% if user.is_authenticated %}
< p >you signed in !!</p>
{% else %}
< p >you not signed in !!</p>
{% endif %}
< /div >
the site_base.css follows -
body.profile #tab_profile a,
body.myapp #tab_myapp a,
body.notices #tab_notices a
{
color: #000; /* selected tab text colour */
}
body.profile #tab_profile,
body.myapp #tab_myapp,
body.notices #tab_notices
{
margin: 0; /* compensate border */
padding: 5px 0 5px;
background-color: #def; /* selected tab colour */
border-left: 1px solid #000; /* tab border */
border-top: 1px solid #000; /* tab border */
border-right: 1px solid #000; /* tab border */
}
any pointers great. thanks.
just define block named body_class inside site_base.html content myapp this:
{% block body_class %}myapp{% endblock %} this override block defined in base.html.
<body class="{% block body_class %}{% endblock %}"> it used css make tab active. see example @ bottom of documentation.
body.profile #tab_profile a, body.blogs #tab_blogs a, body.bookmarks #tab_bookmarks { color: #000; /* selected tab text colour */ } now, if you're opening pages use template, body tag looks this:
<body class="myapp"> therefore css selector above can match tab.
body.myapp #tab_myapp { // active 
Comments
Post a Comment