encode/django-rest-framework
1
1
Fork 0
mirror of https://github.com/encode/django-rest-framework.git synced 2024-11-29 13:04:03 +03:00
Code Issues Packages Projects Releases Wiki Activity

[docs] Move styles to own file. Fix table-of-contents positioning when viewed on <767px screens.

Browse Source 
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:
Alec Perkins 2012-09-07 13:05:44 -04:00
parent 17654a8b54
commit 6d7d70c1c0
2 changed files with 62 additions and 55 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

46
docs/static/css/drf-styles.css vendored Normal file
View 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;
}

47
docs/template.html
View File

@ -8,47 +8,8 @@
<!-- Le styles --> <!-- Le styles -->
<link href="{{ base_url }}/css/bootstrap.css" rel="stylesheet"> <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/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 --> <!-- Le HTML5 shim, for IE6-8 support of HTML5 elements -->
<!--[if lt IE 9]> <!--[if lt IE 9]>
@ -124,15 +85,15 @@ margin-top: 5px;
<div class="container-fluid"> <div class="container-fluid">
<div class="row-fluid"> <div class="row-fluid">
<div class="span3"> <div class="span3">
<div class="well affix span3"> <div id="table-of-contents" class="well affix span3">
<ul class="nav nav-list side-nav"> <ul class="nav nav-list side-nav">
{{ toc }} {{ toc }}
</ul> </ul>
</div> </div>
</div> </div>
<div class="span9"> <div class="span9">
{{ content }} {{ content }}
</div><!--/span--> </div><!--/span-->
</div><!--/row--> </div><!--/row-->
</div><!--/.fluid-container--> </div><!--/.fluid-container-->