Pinax: добавить новую вкладку в приложение basic_projects: запутано документацией - PullRequest
Новая
       5

Pinax: добавить новую вкладку в приложение basic_projects: запутано документацией

0 голосов
/ 09 февраля 2011

Просто клонировал basic_project и пытаюсь настроить, следуя этому - http://pinaxproject.com/docs/0.7/tabs/#ref-tabs

Создал новое приложение "myapp", добавил новую вкладку в right_nav и также отредактировал "site_tabs.css".
Однако, когда я нажимаю на вкладку, хотя страница меняется на myapp, цвет фона вкладки не меняется.

Эта строка в документации - Create a myapps/base.html template that all pages under that tab will extend. Make sure it defines a block body_class with content myapp сбивает меня с толку.

Что это за "body_class" with content myapp? Это какой-то "div" с классом, имеющим "{% block body_class%}"? *

Мой код страницы myapp сейчас довольно прост -

{% extends "site_base.html" %}<br> {% load i18n %}<br> {% load ifsetting_tag %}<br> {% block head_title %}<br> {% trans "Custom App page" %}<br> {% endblock %}

< div class="myapp"><br> < h1 ><br> {% trans "Custom App page" %}</h1><br> {% if user.is_authenticated %}<br> < p >You are signed in !!</p><br> {% else %}<br> < p >You are NOT signed in !!</p><br> {% endif %}<br> < /div >

site_base.css выглядит следующим образом -

body.profile #tab_profile a,<br> body.myapp #tab_myapp a,<br> body.notices #tab_notices a<br> {<br> color: #000; /* selected tab text colour */<br> }

body.profile #tab_profile,<br> body.myapp #tab_myapp,<br> body.notices #tab_notices<br> {<br> margin: 0; /* to compensate for border */<br> padding: 5px 0 5px;<br> background-color: #DEF; /* selected tab colour */<br> border-left: 1px solid #000; /* tab border */<br> border-top: 1px solid #000; /* tab border */<br> border-right: 1px solid #000; /* tab border */<br> }

Любые указатели были бы великолепны. Спасибо.

1 Ответ

1 голос
/ 09 февраля 2011

Просто определите блок с именем body_class внутри вашего site_base.html с содержанием myapp следующим образом: 

{% block body_class %}myapp{% endblock %}

Это заменит блок, определенный в base.html. 

<body class="{% block body_class %}{% endblock %}">

Вероятно, он используется CSS, чтобы сделать вашу вкладку активной. См. Пример внизу документации. 

body.profile #tab_profile a,
body.blogs #tab_blogs a,
body.bookmarks #tab_bookmarks a
{
    color: #000; /* selected tab text colour */
}

Теперь, если вы открываете страницы, которые используют ваш шаблон, тег body выглядит следующим образом: 

<body class="myapp">

Поэтому селектор CSS выше может соответствовать вашей вкладке. 

body.myapp #tab_myapp a { // active
...