encode/django-rest-framework
1
1
Fork 0
mirror of https://github.com/encode/django-rest-framework.git synced 2025-08-06 05:20:12 +03:00
Code Issues Packages Projects Releases Wiki Activity

Sidebar Language Switcher

Browse Source
This commit is contained in:
Emmanouil Konstantinidis 2017-02-15 17:15:42 +00:00
parent 3b13872ed3
commit 0ed8059faf
3 changed files with 26 additions and 66 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

57
rest_framework/static/rest_framework/docs/css/base.css
View File

@ -168,46 +168,19 @@ body {
/* @group Language Switcher */
.sidebar .language-switcher {
text-align: center;
margin-top: 20px;
margin-bottom: 20px;
.sidebar .menu-list.menu-list-bottom {
margin-bottom: 0;
position: absolute;
bottom: 0;
left: 0;
right: 0;
border-top: 1px solid #23282e;
}
.sidebar .language-switcher h6 {
margin-bottom: 15px;
}
.sidebar .language-switcher .btn {
padding: 3px 7px;
}
.sidebar .language-switcher .dropdown-menu {
margin-bottom: 5px;
border: 0;
border-radius: 0;
min-width: 130px;
}
.sidebar .language-switcher .dropdown-menu > li > a {
padding: 3px 10px;
}
.sidebar .language-switcher .dropdown-menu > .active > a,
.sidebar .language-switcher .dropdown-menu > .active > a:hover,
.sidebar .language-switcher .dropdown-menu > .active > a:focus {
background-color: #17759c;
}
.sidebar .language-switcher .dropdown-menu > li > a,
.sidebar .language-switcher .dropdown-menu > li > a:hover,
.sidebar .language-switcher .dropdown-menu > li > a:focus {
background-color: #23282e;
.sidebar .menu-list-bottom li span {
float: right;
margin-right: 20px;
color: #d19b3d;
}
/* @end Language Switcher */
@ -263,24 +236,10 @@ body {
text-align: center;
}
.sidebar .language-switcher {
text-align: center;
margin-top: 10px;
margin-bottom: 10px;
.sidebar .menu-list.menu-list-bottom {
position: static;
}
.sidebar .language-switcher .btn .caret {
margin-left: 0;
border-bottom: 0;
border-top: 4px dashed;
}
.sidebar .language-switcher .dropup .dropdown-menu {
top: 30px;
bottom: inherit;
}
.sidebar .brand {
margin-top: 0;
margin-bottom: 0;

14
rest_framework/templates/rest_framework/docs/index.html
View File

@ -72,16 +72,16 @@
const doc = codec.decode(schema)
// Language Control
$('.language-control li a').click(function (event) {
$('#language-control li').click(function (event) {
event.preventDefault();
var button = $(this)
var language = button.data("language")
const languageMenuItem = $(this).find('a');
var language = languageMenuItem.data("language")
var languageControls = $('.language-control li a')
languageControls.not('[data-language="' + language +'"]').parent().removeClass("active")
languageControls.filter('[data-language="' + language +'"]').parent().addClass("active")
var languageControls = $(this).closest('ul').find('li');
languageControls.find('a').not('[data-language="' + language +'"]').parent().removeClass("active")
languageControls.find('a').filter('[data-language="' + language +'"]').parent().addClass("active")
button.closest(".btn-group").find('.dropdown-toggle span').first().text(language)
$('#selected-language').text(language)
var codeBlocks = $('pre.highlight')
codeBlocks.not('[data-language="' + language +'"]').addClass("hide")

21
rest_framework/templates/rest_framework/docs/sidebar.html
View File

@ -16,18 +16,19 @@
{% endfor %}
</ul>
<div class="language-switcher">
<h6>Choose Language</h6>
<div class="btn-group dropup">
<button type="button" class="btn btn-info btn-sm dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<span>shell</span> &nbsp;&nbsp;<span class="caret"></span>
</button>
<ul class="dropdown-menu language-control">
<ul class="menu-list menu-list-bottom">
<li>
<a><i class="fa fa-user fa-lg"></i> Authentication</a> <span>none</span>
</li>
<li data-toggle="collapse" data-target="#language-control" class="collapsed">
<a><i class="fa fa-code fa-lg"></i> Source Code</a> <span id="selected-language">shell</span>
</li>
<ul class="sub-menu collapse out" id="language-control">
<li class="active"><a href="#" data-language="shell">shell</a></li>
<li><a href="#" data-language="javascript">javascript</a></li>
<li><a href="#" data-language="python">python</a></li>
</ul>
</div>
</div>
</ul>
</ul>
</div>
</div>