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:
James Turnbull 2014-04-17 22:42:15 -04:00
commit ac697e5f52
3 changed files with 15 additions and 10 deletions

View File

@ -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 */

View File

@ -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');

View File

@ -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">