Movatterモバイル変換


[0]ホーム

URL:


Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Sign up
Appearance settings

Make the theme responsive#46

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to ourterms of service andprivacy statement. We’ll occasionally send you account related emails.

Already on GitHub?Sign in to your account

Merged
JulienPalard merged 24 commits intopython:masterfromobulat:master
May 7, 2021
Merged
Show file tree
Hide file tree
Changes fromall commits
Commits
Show all changes
24 commits
Select commitHold shift + click to select a range
7aba474
Make theme responsive
obulatMay 19, 2020
203b40a
Address code review issues
obulatJun 19, 2020
10f4349
Use css for opening/closing menu
obulatJul 9, 2020
ff61d60
Adjust font and selects
obulatDec 21, 2020
7640739
Add language and version switcher placeholders
obulatDec 25, 2020
ecf73cf
Remove duplicate rootrellink declaration
obulatMar 9, 2021
43da2b4
Remove dublicate relbaritems block
obulatApr 13, 2021
51a0c7a
Update select styles
obulatApr 13, 2021
efd1ec2
Add missing select styles
obulatApr 13, 2021
7953f1b
Change the search icon color
obulatApr 13, 2021
6daa876
Change caret color
obulatApr 13, 2021
250dbf6
Change hamburger color
obulatApr 13, 2021
5ffa114
Add an svg icon
obulatApr 13, 2021
e1ee8bd
Add svg logo to layout
obulatApr 13, 2021
1e182f3
Merge remote-tracking branch 'upstream/master'
obulatMay 2, 2021
611a1dc
Add switchers to desktop view
obulatMay 2, 2021
783b19a
Fix toggler accessibility and select paddings
obulatMay 2, 2021
d31371e
Fix html formatting
obulatMay 2, 2021
190931b
Add link to homepage in mobile version
obulatMay 5, 2021
b6fc448
Add smaller padding to toctree
obulatMay 5, 2021
cd92c8c
Add a different link to the logo
obulatMay 5, 2021
ed7b948
Make logo in mobile version link to 'http://0.0.0.0:8000/3.9/'
obulatMay 5, 2021
d96713e
Make logo in mobile version link to 'http://0.0.0.0:8000/3.9/'
obulatMay 5, 2021
bd1d802
Make logo in mobile version link to theme root
obulatMay 5, 2021
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
121 changes: 98 additions & 23 deletionspython_docs_theme/layout.html
View file
Open in desktop
Original file line numberDiff line numberDiff line change
@@ -1,46 +1,121 @@
{% extends "classic/layout.html" %}

{% block rootrellink %}
<li><img src="{{ pathto('_static/' + theme_root_icon, 1) }}" alt=""
style="vertical-align: middle; margin-top: -1px"/></li>
<li><a href="{{theme_root_url}}">{{theme_root_name}}</a>{{ reldelim1 }}</li>
{% if theme_root_include_title %}
<a href="{{ pathto('index') }}">{{ shorttitle }}</a>{{ reldelim1 }}
{% endif %}
{% endblock %}
{%- macro relbar() %}
{# modified from sphinx/themes/basic/layout.html #}
<div class="related" role="navigation" aria-label="related navigation">
<h3>{{ _('Navigation') }}</h3>
<ul>
{%- for rellink in rellinks %}
<li class="right" {% if loop.first %}style="margin-right: 10px"{% endif %}>
<a href="{{ pathto(rellink[0])|e }}" title="{{ rellink[1]|striptags|e }}"
{{ accesskey(rellink[2]) }}>{{ rellink[3] }}
</a>
{%- if not loop.first %}{{ reldelim2 }}{% endif %}
</li>
{%- endfor %}
{%- block rootrellink %}
<li><img src="{{ pathto('_static/py.svg', 1) }}" alt="python logo" style="vertical-align: middle; margin-top: -1px"/></li>
<li><a href="{{theme_root_url}}">{{theme_root_name}}</a>{{ reldelim1 }}</li>
<li class="switchers">
<div class="language_switcher_placeholder"></div>
<div class="version_switcher_placeholder"></div>
</li>
<li>
{% if theme_root_include_title %}
<a href="{{ pathto('index') }}">{{ shorttitle }}</a>{{ reldelim1 }}
{% endif %}
</li>
{%- endblock %}
{%- for parent in parents %}
<li class="nav-item nav-item-{{ loop.index }}"><a href="{{ parent.link|e }}" {% if loop.last %}{{ accesskey("U") }}{% endif %}>{{ parent.title }}</a>{{ reldelim1 }}</li>
{%- endfor %}
<li class="nav-item nav-item-this"><a href="{{ link|e }}">{{ title }}</a></li>
{% block relbaritems %}
{%- if pagename != "search" and builder != "singlehtml" and builder != "htmlhelp" %}
<li class="right">
{{ searchbox() }}
{{ reldelim2 }}
</li>
{%- endif %}
{% endblock %}
</ul>
</div>
{%- endmacro %}

{%- macro searchbox() %}
{# modified from sphinx/themes/basic/searchbox.html #}
{%- if builder != "htmlhelp" %}
<div class="inline-search"style="display: none"role="search">
<div class="inline-search" role="search">
<form class="inline-search" action="{{ pathto('search') }}" method="get">
<input placeholder="{{ _('Quick search') }}" type="text" name="q" />
<input placeholder="{{ _('Quick search') }}"aria-label="{{ _('Quick search') }}"type="text" name="q" />
<input type="submit" value="{{ _('Go') }}" />
<input type="hidden" name="check_keywords" value="yes" />
<input type="hidden" name="area" value="default" />
</form>
</div>
<script type="text/javascript">$('.inline-search').show(0);</script>
{%- endif %}
{%- endmacro %}

{% block relbar1 %} {% if builder != 'qthelp' %} {{ relbar() }} {% endif %} {% endblock %}
{% block relbar2 %} {% if builder != 'qthelp' %} {{ relbar() }} {% endif %} {% endblock %}
{% block relbaritems %}
{%- if pagename != "search" and builder != "singlehtml" and builder != "htmlhelp" %}
<li class="right">
{{ searchbox() }}
{{ reldelim2 }}
</li>
{%- endif %}
{% endblock %}

{% block extrahead %}

{%- block extrahead -%}
<link rel="shortcut icon" type="image/png" href="{{ pathto('_static/' + theme_root_icon, 1) }}" />
{% if builder != "htmlhelp" %}
{% if not embedded %}<script type="text/javascript" src="{{ pathto('_static/copybutton.js', 1) }}"></script>{% endif %}
{% endif %}
{%- if builder != "htmlhelp" %}
{%- if not embedded %}
<script type="text/javascript" src="{{ pathto('_static/copybutton.js', 1) }}"></script>
<script type="text/javascript" src="{{ pathto('_static/menu.js', 1) }}"></script>
{%- endif -%}
{%- endif -%}
{{ super() }}
{%- endblock -%}

{%- block css -%}
<meta name="viewport" content="width=device-width, initial-scale=1.0">
{{ super() }}
{%- endblock -%}

{%- block body_tag %}
{{ super() }}
<div class="mobile-nav">
<input type="checkbox" id="menuToggler" class="toggler__input" aria-controls="navigation"
aria-pressed="false" aria-expanded="false" role="button" aria-label="{{ _('Menu')}}" />
<label for="menuToggler" class="toggler__label">
<span></span>
</label>
<nav class="nav-content" role="navigation">
<a href="{{ theme_root_url }}" class="nav-logo">
<img src="{{ pathto('_static/py.svg', 1) }}" alt="Logo"/>
</a>
<div class="version_switcher_placeholder"></div>
{%- if pagename != "search" and builder != "singlehtml" %}
<form id="searchbox" role="search" class="search" action="{{ pathto('search') }}" method="get">
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" class="search-icon">
<path fill-rule="nonzero"
d="M15.5 14h-.79l-.28-.27a6.5 6.5 0 001.48-5.34c-.47-2.78-2.79-5-5.59-5.34a6.505 6.505 0 00-7.27 7.27c.34 2.8 2.56 5.12 5.34 5.59a6.5 6.5 0 005.34-1.48l.27.28v.79l4.25 4.25c.41.41 1.08.41 1.49 0 .41-.41.41-1.08 0-1.49L15.5 14zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z" fill="#444"></path>
</svg>
<input type="text" name="q" aria-label="{{ _('Quick search') }}"/>
<input type="submit" value="{{ _('Go') }}"/>
</form>
{%- endif %}
</nav>
<div class="menu-wrapper">
<nav class="menu" role="navigation" aria-label="main navigation">
<div class="language_switcher_placeholder"></div>
{%- if logo %}
<p class="logo">
<a href="{{ pathto('index') }}">
<img class="logo" src="{{ pathto('_static/' + logo, 1)|e }}" alt="Logo"/>
</a>
</p>
{%- endif %}
{%- for sidebartemplate in sidebars %}
{%- include sidebartemplate %}
{%- endfor %}
</nav>
</div>
</div>
{% endblock %}

{% block footer %}
Expand Down
1 change: 1 addition & 0 deletionspython_docs_theme/static/caret-down.svg
View file
Open in desktop
Loading
Sorry, something went wrong.Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
55 changes: 55 additions & 0 deletionspython_docs_theme/static/menu.js
View file
Open in desktop
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,55 @@
document.addEventListener('DOMContentLoaded', function () {

// Make tables responsive by wrapping them in a div and making them scrollable
const tables = document.querySelectorAll('table.docutils');
tables.forEach(function(table){
table.outerHTML = '<div class="responsive-table__container">' + table.outerHTML + '</div>'
});

const togglerInput = document.querySelector('.toggler__input');
const togglerLabel = document.querySelector('.toggler__label');
const sideMenu = document.querySelector('.menu-wrapper');
const menuItems = document.querySelectorAll('.menu')
const doc = document.querySelector('.document');
const body = document.querySelector('body');

function closeMenu() {
togglerInput.checked = false;
sideMenu.setAttribute("aria-expanded", 'false');
sideMenu.setAttribute('aria-hidden', 'true');
togglerLabel.setAttribute('aria-pressed', 'false');
body.style.overflow = 'visible';
}
function openMenu() {
togglerInput.checked = true;
sideMenu.setAttribute("aria-expanded", 'true');
sideMenu.setAttribute('aria-hidden', 'false');
togglerLabel.setAttribute('aria-pressed', 'true');
body.style.overflow = 'hidden';
}

// Close menu when link on the sideMenu is clicked
sideMenu.addEventListener('click', function (event) {
let target = event.target;
if (target.tagName.toLowerCase() !== 'a') return;
closeMenu();
})
// Add accessibility data when sideMenu is opened/closed
togglerInput.addEventListener('change', function (e) {
togglerInput.checked ? openMenu() : closeMenu();
});
// Make sideMenu links tabbable only when visible
for(let menuItem of menuItems) {
if(togglerInput.checked) {
menuItem.setAttribute('tabindex', '0');
} else {
menuItem.setAttribute('tabindex', '-1');
}
}
// Close sideMenu when document body is clicked
doc.addEventListener('click', function () {
if (togglerInput.checked) {
closeMenu();
}
})
})
14 changes: 14 additions & 0 deletionspython_docs_theme/static/py.svg
View file
Open in desktop
Loading
Sorry, something went wrong.Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading

[8]ページ先頭

©2009-2025 Movatter.jp