Skip to content

Commit 04f4a8b

Browse files
committed
feat: add new navbar base HTML
1 parent efb9e78 commit 04f4a8b

File tree

1 file changed

+169
-39
lines changed

1 file changed

+169
-39
lines changed

docs_theme/nav.html

Lines changed: 169 additions & 39 deletions
Original file line numberDiff line numberDiff line change
@@ -1,46 +1,176 @@
1-
<div class="navbar navbar-inverse navbar-fixed-top">
2-
<div class="navbar-inner">
3-
<div class="container-fluid">
4-
<a class="repo-link btn btn-primary btn-small" href="https://github.com/encode/django-rest-framework/tree/master">GitHub</a>
5-
<a class="repo-link btn btn-inverse btn-small {% if not page.next_page %}disabled{% endif %}" rel="next" {% if page.next_page %}href="{{ page.next_page.url|url }}"{% endif %}>
6-
Next <i class="icon-arrow-right icon-white"></i>
7-
</a>
8-
<a class="repo-link btn btn-inverse btn-small {% if not page.previous_page %}disabled{% endif %}" rel="prev" {% if page.previous_page %}href="{{ page.previous_page.url|url }}"{% endif %}>
9-
<i class="icon-arrow-left icon-white"></i> Previous
10-
</a>
11-
<a id="search_modal_show" class="repo-link btn btn-inverse btn-small" href="#mkdocs_search_modal" data-toggle="modal" data-target="#mkdocs_search_modal"><i class="icon-search icon-white"></i> Search</a>
12-
<a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
13-
<span class="icon-bar"></span>
14-
<span class="icon-bar"></span>
15-
<span class="icon-bar"></span>
16-
</a>
17-
<a class="brand" href="https://www.django-rest-framework.org/">Django REST framework</a>
18-
<div class="nav-collapse collapse">
19-
{% if nav|length>1 %}
20-
<!-- Main navigation -->
21-
<ul class="nav navbar-nav">
22-
{% for nav_item in nav %} {% if nav_item.children %}
23-
<li class="dropdown{% if nav_item.active %} active{% endif %}">
24-
<a href="#" class="dropdown-toggle" data-toggle="dropdown">{{ nav_item.title }} <b class="caret"></b></a>
25-
<ul class="dropdown-menu">
26-
{% for nav_item in nav_item.children %}
27-
<li {% if nav_item.active %}class="active" {% endif %}>
28-
<a href="{{ nav_item.url|url }}">{{ nav_item.title }}</a>
29-
</li>
30-
{% endfor %}
31-
</ul>
32-
</li>
33-
{% else %}
1+
<!-- <div class="navbar navbar-inverse navbar-fixed-top">
2+
<div class="navbar-inner">
3+
<div class="container-fluid">
4+
<a
5+
class="repo-link btn btn-primary btn-small"
6+
href="https://github.com/encode/django-rest-framework/tree/master"
7+
>GitHub</a
8+
>
9+
<a
10+
class="repo-link btn btn-inverse btn-small {% if not page.next_page %}disabled{% endif %}"
11+
rel="next"
12+
{%
13+
if
14+
page.next_page
15+
%}href="{{ page.next_page.url|url }}"
16+
{%
17+
endif
18+
%}
19+
>
20+
Next <i class="icon-arrow-right icon-white"></i>
21+
</a>
22+
<a
23+
class="repo-link btn btn-inverse btn-small {% if not page.previous_page %}disabled{% endif %}"
24+
rel="prev"
25+
{%
26+
if
27+
page.previous_page
28+
%}href="{{ page.previous_page.url|url }}"
29+
{%
30+
endif
31+
%}
32+
>
33+
<i class="icon-arrow-left icon-white"></i> Previous
34+
</a>
35+
<a
36+
id="search_modal_show"
37+
class="repo-link btn btn-inverse btn-small"
38+
href="#mkdocs_search_modal"
39+
data-toggle="modal"
40+
data-target="#mkdocs_search_modal"
41+
><i class="icon-search icon-white"></i> Search</a
42+
>
43+
<a
44+
class="btn btn-navbar"
45+
data-toggle="collapse"
46+
data-target=".nav-collapse"
47+
>
48+
<span class="icon-bar"></span>
49+
<span class="icon-bar"></span>
50+
<span class="icon-bar"></span>
51+
</a>
52+
53+
<a class="brand" href="https://www.django-rest-framework.org/"
54+
>Django REST framework</a
55+
>
56+
57+
<div class="nav-collapse collapse">
58+
{% if nav|length>1 %}
59+
<ul class="nav navbar-nav">
60+
{% for nav_item in nav %} {% if nav_item.children %}
61+
<li class="dropdown{% if nav_item.active %} active{% endif %}">
62+
<a href="#" class="dropdown-toggle" data-toggle="dropdown"
63+
>{{ nav_item.title }} <b class="caret"></b
64+
></a>
65+
<ul class="dropdown-menu">
66+
{% for nav_item in nav_item.children %}
3467
<li {% if nav_item.active %}class="active" {% endif %}>
3568
<a href="{{ nav_item.url|url }}">{{ nav_item.title }}</a>
3669
</li>
37-
{% endif %} {% endfor %}
38-
70+
{% endfor %}
3971
</ul>
40-
{% endif %}
41-
</div>
42-
<!--/.nav-collapse -->
72+
</li>
73+
{% else %}
74+
<li {% if nav_item.active %}class="active" {% endif %}>
75+
<a href="{{ nav_item.url|url }}">{{ nav_item.title }}</a>
76+
</li>
77+
{% endif %} {% endfor %}
78+
</ul>
79+
{% endif %}
80+
</div>
81+
</div>
82+
</div>
83+
</div> -->
84+
85+
<!-- New Navbar -->
86+
<nav class="navbar navbar-expand-lg bg-body-tertiary">
87+
<div class="container-fluid">
88+
<a class="navbar-brand" href="https://www.django-rest-framework.org/"
89+
>Django REST framework</a
90+
>
91+
92+
<button
93+
class="navbar-toggler"
94+
type="button"
95+
data-bs-toggle="collapse"
96+
data-bs-target="#navbarSupportedContent"
97+
aria-controls="navbarSupportedContent"
98+
aria-expanded="false"
99+
aria-label="Toggle navigation"
100+
>
101+
<span class="navbar-toggler-icon"></span>
102+
</button>
103+
104+
<!-- Main navigation -->
105+
106+
<div class="collapse navbar-collapse" id="navbarSupportedContent">
107+
{% if nav|length>1 %}
108+
<ul class="navbar-nav me-auto mb-2 mb-lg-0">
109+
{% for nav_item in nav %} {% if nav_item.children %}
110+
<li class="nav-item dropdown">
111+
<a
112+
class="nav-link dropdown-toggle"
113+
href="#"
114+
role="button"
115+
data-bs-toggle="dropdown"
116+
aria-expanded="false"
117+
>
118+
{{ nav_item.title }}
119+
</a>
120+
<ul class="dropdown-menu">
121+
{% for nav_item in nav_item.children %}
122+
<li>
123+
<!-- prettier-ignore -->
124+
<a {% if nav_item.active %} class="dropdown-item active" {% else %} class="dropdown-item" {% endif %}
125+
126+
href="#">{{ nav_item.title }}</a>
127+
</li>
128+
{% endfor %}
129+
</ul>
130+
</li>
131+
132+
{% else %}
133+
<li class="nav-item">
134+
<!-- prettier-ignore -->
135+
<a {% if nav_item.active %} class="nav-link active" {% else %} class="nav-link" {% endif %}
136+
aria-current="page" href="{{ nav_item.url|url }}">{{ nav_item.title }}</a>
137+
</li>
138+
{% endif %} {% endfor %}
139+
</ul>
140+
{% endif %}
141+
142+
<form class="d-flex mx-auto" role="search">
143+
<input
144+
class="form-control me-2"
145+
type="search"
146+
placeholder="Search"
147+
aria-label="Search"
148+
/>
149+
<button class="btn btn-outline-success" type="submit">Search</button>
150+
</form>
151+
152+
<div class="d-flex gap-2">
153+
<!-- prettier-ignore -->
154+
<a
155+
{% if page.previous_page %}href="{{ page.previous_page.url|url }}"{% endif %}
156+
{% if not page.previous_page %}disabled{% endif %}
157+
class="btn btn-sm btn-secondary"
158+
>Previous</a>
159+
160+
<!-- prettier-ignore -->
161+
<a
162+
{% if page.next_page %}href="{{ page.next_page.url|url }}"{% endif %}
163+
{% if not page.next_page %}disabled{% endif %}
164+
class="btn btn-sm btn-secondary"
165+
>Next</a>
43166

44-
</div>
167+
<!-- prettier-ignore -->
168+
<a
169+
class="btn btn-primary btn-sm"
170+
href="https://github.com/encode/django-rest-framework/tree/master"
171+
>Github</a
172+
>
45173
</div>
46174
</div>
175+
</div>
176+
</nav>

0 commit comments

Comments
 (0)