mirror of
https://github.com/encode/django-rest-framework.git
synced 2024-11-25 19:14:01 +03:00
[docs] Move styles to own file. Fix table-of-contents positioning when viewed on <767px screens.
The fixed positioning of the ToC needs to be overridden with static, so that the ToC falls back into the flow of content and is sized correctly. Also, this prevents the actual page content from riding up behind the ToC and being obscured.
This commit is contained in:
parent
17654a8b54
commit
6d7d70c1c0
46
docs/static/css/drf-styles.css
vendored
Normal file
46
docs/static/css/drf-styles.css
vendored
Normal file
|
@ -0,0 +1,46 @@
|
|||
body {
|
||||
padding-top: 60px;
|
||||
padding-bottom: 40px;
|
||||
}
|
||||
|
||||
/* Set the table of contents to static so it flows back into the content when
|
||||
viewed on tablets and smaller. */
|
||||
@media (max-width: 767px) {
|
||||
#table-of-contents {
|
||||
position: static;
|
||||
}
|
||||
}
|
||||
|
||||
.nav-list li.main {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
blockquote {
|
||||
font-family: Georgia, serif;
|
||||
font-size: 18px;
|
||||
font-style: italic;
|
||||
margin: 0.25em 0;
|
||||
padding: 0.25em 40px;
|
||||
line-height: 1.45;
|
||||
position: relative;
|
||||
color: #383838;
|
||||
border-left: none;
|
||||
}
|
||||
|
||||
blockquote:before {
|
||||
display: block;
|
||||
content: "\201C";
|
||||
font-size: 80px;
|
||||
position: absolute;
|
||||
left: -10px;
|
||||
top: -20px;
|
||||
color: #7a7a7a;
|
||||
}
|
||||
|
||||
blockquote p:last-child {
|
||||
color: #999999;
|
||||
font-size: 14px;
|
||||
display: block;
|
||||
margin-top: 5px;
|
||||
}
|
||||
|
|
@ -8,47 +8,8 @@
|
|||
|
||||
<!-- Le styles -->
|
||||
<link href="{{ base_url }}/css/bootstrap.css" rel="stylesheet">
|
||||
<style type="text/css">
|
||||
body {
|
||||
padding-top: 60px;
|
||||
padding-bottom: 40px;
|
||||
}
|
||||
.sidebar-nav {
|
||||
padding: 9px 0;
|
||||
}
|
||||
.nav-list li.main {
|
||||
font-weight: bold;
|
||||
}
|
||||
blockquote {
|
||||
font-family: Georgia, serif;
|
||||
font-size: 18px;
|
||||
font-style: italic;
|
||||
margin: 0.25em 0;
|
||||
padding: 0.25em 40px;
|
||||
line-height: 1.45;
|
||||
position: relative;
|
||||
color: #383838;
|
||||
border-left: none;
|
||||
}
|
||||
|
||||
blockquote:before {
|
||||
display: block;
|
||||
content: "\201C";
|
||||
font-size: 80px;
|
||||
position: absolute;
|
||||
left: -10px;
|
||||
top: -20px;
|
||||
color: #7a7a7a;
|
||||
}
|
||||
|
||||
blockquote p:last-child {
|
||||
color: #999999;
|
||||
font-size: 14px;
|
||||
display: block;
|
||||
margin-top: 5px;
|
||||
}
|
||||
</style>
|
||||
<link href="{{ base_url }}/css/bootstrap-responsive.css" rel="stylesheet">
|
||||
<link href="{{ base_url }}/css/drf-styles.css" rel="stylesheet">
|
||||
|
||||
<!-- Le HTML5 shim, for IE6-8 support of HTML5 elements -->
|
||||
<!--[if lt IE 9]>
|
||||
|
@ -108,14 +69,14 @@ margin-top: 5px;
|
|||
</li>
|
||||
</ul>
|
||||
<ul class="nav pull-right">
|
||||
<li class="dropdown">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Version: 2.0.0 <b class="caret"></b></a>
|
||||
<ul class="dropdown-menu">
|
||||
<li><a href="#">Trunk</a></li>
|
||||
<li><a href="#">2.0.0</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
<li class="dropdown">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Version: 2.0.0 <b class="caret"></b></a>
|
||||
<ul class="dropdown-menu">
|
||||
<li><a href="#">Trunk</a></li>
|
||||
<li><a href="#">2.0.0</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</div><!--/.nav-collapse -->
|
||||
</div>
|
||||
</div>
|
||||
|
@ -123,16 +84,16 @@ margin-top: 5px;
|
|||
|
||||
<div class="container-fluid">
|
||||
<div class="row-fluid">
|
||||
<div class="span3">
|
||||
<div class="well affix span3">
|
||||
<ul class="nav nav-list side-nav">
|
||||
{{ toc }}
|
||||
</ul>
|
||||
</div>
|
||||
<div class="span3">
|
||||
<div id="table-of-contents" class="well affix span3">
|
||||
<ul class="nav nav-list side-nav">
|
||||
{{ toc }}
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="span9">
|
||||
{{ content }}
|
||||
{{ content }}
|
||||
</div><!--/span-->
|
||||
</div><!--/row-->
|
||||
</div><!--/.fluid-container-->
|
||||
|
|
Loading…
Reference in New Issue
Block a user