mirror of https://github.com/docker/docs.git
Merge pull request #5257 from ostezer/docs-fix-toc-click
Fix for TOC "click/expand" & "scroll position" problem on mobile.
This commit is contained in:
commit
ac697e5f52
|
@ -40,6 +40,7 @@ h6,
|
||||||
/* Desktop click-to-scroll margin/padding fixes */
|
/* Desktop click-to-scroll margin/padding fixes */
|
||||||
padding-top: 2em !important;
|
padding-top: 2em !important;
|
||||||
margin-top: -2em !important;
|
margin-top: -2em !important;
|
||||||
|
pointer-events:none;
|
||||||
}
|
}
|
||||||
#content h3 {
|
#content h3 {
|
||||||
padding: 0.7em 0em 0.3em 0em;
|
padding: 0.7em 0em 0.3em 0em;
|
||||||
|
@ -354,11 +355,16 @@ h6,
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
color: #0e6b8d;
|
color: #0e6b8d;
|
||||||
}
|
}
|
||||||
|
#toc_table > h2 > a > b {
|
||||||
|
display: none;
|
||||||
|
border-top-color: #0e6b8d !important;
|
||||||
|
}
|
||||||
#toc_table > h3 {
|
#toc_table > h3 {
|
||||||
font-size: 1em;
|
font-size: 1em;
|
||||||
color: #0e6b8d;
|
color: #0e6b8d;
|
||||||
}
|
}
|
||||||
#toc_table > #toc_navigation {
|
#toc_table > #toc_navigation {
|
||||||
|
display: block;
|
||||||
margin-top: 1.5em !important;
|
margin-top: 1.5em !important;
|
||||||
background: #fff;
|
background: #fff;
|
||||||
border-bottom: 3px solid #ddd;
|
border-bottom: 3px solid #ddd;
|
||||||
|
@ -572,6 +578,9 @@ ol.breadcrumb > li:last-child > a {
|
||||||
margin-bottom: 0.3em;
|
margin-bottom: 0.3em;
|
||||||
font-size: 2em;
|
font-size: 2em;
|
||||||
}
|
}
|
||||||
|
#toc_table > h2 > a > b {
|
||||||
|
display: inline-block;
|
||||||
|
}
|
||||||
#toc_table > h3 {
|
#toc_table > h3 {
|
||||||
display: block;
|
display: block;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
|
@ -590,13 +599,6 @@ ol.breadcrumb > li:last-child > a {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Mobile click-to-scroll margin/padding fixes */
|
|
||||||
#content h2 {
|
|
||||||
padding: 0.5em 0em 0.3em 0em;
|
|
||||||
padding-top: 13.5em !important;
|
|
||||||
margin-top: -13.5em !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Container responsiveness fixes to maximise realestate expenditure */
|
/* Container responsiveness fixes to maximise realestate expenditure */
|
||||||
|
|
|
@ -30,13 +30,13 @@ $(document).ready(function ()
|
||||||
});
|
});
|
||||||
|
|
||||||
/* Toggle TOC view for Mobile */
|
/* Toggle TOC view for Mobile */
|
||||||
$('#toc_table').on('click', function ()
|
$('#toc_table > h2').on('click', function ()
|
||||||
{
|
{
|
||||||
if ( $(window).width() <= 991 )
|
if ( $(window).width() <= 991 )
|
||||||
{
|
{
|
||||||
$('#toc_table > #toc_navigation').slideToggle();
|
$('#toc_table > #toc_navigation').slideToggle();
|
||||||
}
|
}
|
||||||
})
|
});
|
||||||
|
|
||||||
/* Follow TOC links (ScrollSpy) */
|
/* Follow TOC links (ScrollSpy) */
|
||||||
$('body').scrollspy({
|
$('body').scrollspy({
|
||||||
|
@ -61,6 +61,9 @@ function checkToScrollTOC ()
|
||||||
{
|
{
|
||||||
if ( $(window).width() >= 768 )
|
if ( $(window).width() >= 768 )
|
||||||
{
|
{
|
||||||
|
// If TOC is hidden, expand.
|
||||||
|
$('#toc_table > #toc_navigation').css("display", "block");
|
||||||
|
// Then attach or detach fixed-scroll
|
||||||
if ( ($('#toc_table').height() + 100) >= $(window).height() )
|
if ( ($('#toc_table').height() + 100) >= $(window).height() )
|
||||||
{
|
{
|
||||||
$('#toc_table').trigger('detach.ScrollToFixed');
|
$('#toc_table').trigger('detach.ScrollToFixed');
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
<div id="toc_table" class="bs-sidebar hidden-print" role="complementary">
|
<div id="toc_table" class="bs-sidebar hidden-print" role="complementary">
|
||||||
{% if current_page.title != '**HIDDEN**' %}
|
{% if current_page.title != '**HIDDEN**' %}
|
||||||
<h2>{{ current_page.title }}</h2>
|
<h2><a href="#">{{ current_page.title }} <b class="caret"></b></a></h2>
|
||||||
{% endif %}
|
{% endif %}
|
||||||
<h3>TABLE OF CONTENTS</h3>
|
<h3>TABLE OF CONTENTS</h3>
|
||||||
<ul id="toc_navigation" class="nav bs-sidenav">
|
<ul id="toc_navigation" class="nav bs-sidenav">
|
||||||
|
|
Loading…
Reference in New Issue