Skip to content

Use portals for mobile site and page nav #1556

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.

Sign up for GitHub

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

Already on GitHub? Sign in to your account

Merged
jonahtanjz merged 14 commits into from
May 1, 2021
Merged

Use portals for mobile site and page nav #1556

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
14 commits
Select commit Hold shift + click to select a range
94358f7
Use portals for mobile site and page nav
ang-zeyu Apr 30, 2021
0824305
Re-add missing toggleLowerNavbar injection
ang-zeyu Apr 30, 2021
6df94f1
Add temporary snippet for testing interactivity
ang-zeyu Apr 30, 2021
881b287
Update expected test files
ang-zeyu Apr 30, 2021
9f9690e
Restore restriction on site / page nav
ang-zeyu Apr 30, 2021
0880119
Add missing page nav source
ang-zeyu May 1, 2021
55cf54d
Forward static class for overlay-source to the portal-ed content
ang-zeyu May 1, 2021
0934287
Fix multiple clicks for page nav to close
ang-zeyu May 1, 2021
39ce8c8
Update expected test files
ang-zeyu May 1, 2021
619d775
add reasonable overrides
ang-zeyu May 1, 2021
26c4385
Small renaming
ang-zeyu May 1, 2021
d101d71
Further constrain overlay closing checks
ang-zeyu May 1, 2021
5e2de17
Revert style and tag forwarding
ang-zeyu May 1, 2021
18a0a0d
Remove testing snippet
ang-zeyu May 1, 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
12 changes: 6 additions & 6 deletions packages/cli/test/functional/test_site/expected/bugs/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -53,7 +53,7 @@
<p><strong>Relative Link Test</strong> This is a relative Intra-Site link in a layout (see <a href="/test_site/index.html#heading-with-hidden-keyword">link</a>)</p>
</div>
<div id="flex-body">
<nav id="site-nav" class="fixed-header-padding">
<overlay-source id="site-nav" class="fixed-header-padding" tag-name="nav" to="site-nav">
<div class="site-nav-top">
<div class="font-weight-bold mb-2" style="font-size: 1.25rem;">
<div>
Expand All @@ -64,7 +64,7 @@ <h2 id="default-layout"><span id="default-layout" class="anchor"></span>Default
<div class="nav-component slim-scroll">
<div>
<site-nav>
<ul class="site-nav-list site-nav-list-root">
<overlay-source class="site-nav-list site-nav-list-root" tag-name="ul" to="mb-site-nav">
<li>
<div class="site-nav-default-list-item site-nav-list-item-0" onclick="handleSiteNavClick(this)"><a href="/test_site/index.html">Home 🏠</a></div>
</li>
Expand Down Expand Up @@ -185,11 +185,11 @@ <h3 id="testing-site-nav"><span id="testing-site-nav" class="anchor"></span>Test
</li>
</ul>
</li>
</ul>
</overlay-source>
</site-nav>
</div>
</div>
</nav>
</overlay-source>
<div id="content-wrapper" class="fixed-header-padding">

<div class="website-content">
Expand All @@ -200,11 +200,11 @@ <h3 id="testing-site-nav"><span id="testing-site-nav" class="anchor"></span>Test
</div>
<i class="fa fa-arrow-circle-up fa-lg d-print-none" id="scroll-top-button" onclick="handleScrollTop()" aria-hidden="true"></i>
</div>
<nav id="page-nav" class="fixed-header-padding">
<overlay-source id="page-nav" class="fixed-header-padding" tag-name="nav" to="page-nav">
<div class="nav-component slim-scroll">

</div>
</nav>
</overlay-source>
</div>
<div>
<footer>
Expand Down
8 changes: 1 addition & 7 deletions packages/cli/test/functional/test_site/expected/bugs/index.page-vue-render.js
View file
Open in desktop

Large diffs are not rendered by default.

16 changes: 8 additions & 8 deletions packages/cli/test/functional/test_site/expected/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -53,7 +53,7 @@
<p><strong>Relative Link Test</strong> This is a relative Intra-Site link in a layout (see <a href="/test_site/index.html#heading-with-hidden-keyword">link</a>)</p>
</div>
<div id="flex-body">
<nav id="site-nav" class="fixed-header-padding">
<overlay-source id="site-nav" class="fixed-header-padding" tag-name="nav" to="site-nav">
<div class="site-nav-top">
<div class="font-weight-bold mb-2" style="font-size: 1.25rem;">
<div>
Expand All @@ -64,7 +64,7 @@ <h2 id="default-layout"><span id="default-layout" class="anchor"></span>Default
<div class="nav-component slim-scroll">
<div>
<site-nav>
<ul class="site-nav-list site-nav-list-root">
<overlay-source class="site-nav-list site-nav-list-root" tag-name="ul" to="mb-site-nav">
<li>
<div class="site-nav-default-list-item site-nav-list-item-0" onclick="handleSiteNavClick(this)"><a href="/test_site/index.html">Home 🏠</a></div>
</li>
Expand Down Expand Up @@ -185,11 +185,11 @@ <h3 id="testing-site-nav"><span id="testing-site-nav" class="anchor"></span>Test
</li>
</ul>
</li>
</ul>
</overlay-source>
</site-nav>
</div>
</div>
</nav>
</overlay-source>
<div id="content-wrapper" class="fixed-header-padding">

<div class="website-content">
Expand Down Expand Up @@ -723,10 +723,10 @@ <h6 class="always-index" id="level-6-header-outside-headingsearchindex-with-alwa

<i class="fa fa-arrow-circle-up fa-lg d-print-none" id="scroll-top-button" onclick="handleScrollTop()" aria-hidden="true"></i>
</div>
<nav id="page-nav" class="fixed-header-padding">
<overlay-source id="page-nav" class="fixed-header-padding" tag-name="nav" to="page-nav">
<div class="nav-component slim-scroll">
<a class="navbar-brand page-nav-title" href="#">Testing Page Navigation</a>
<nav id="mb-page-nav" class="nav nav-pills flex-column my-0 small no-flex-wrap">
<overlay-source id="mb-page-nav" tag-name="nav" to="mb-page-nav" class="nav nav-pills flex-column my-0 small no-flex-wrap">
<a class="nav-link py-1" href="#heading-with-multiple-keywords">Heading with multiple keywords&#x200E;</a>
<a class="nav-link py-1" href="#heading-with-keyword-in-panel">Heading with keyword in panel&#x200E;</a>
<a class="nav-link py-1" href="#panel-with-heading">Panel with heading&#x200E;</a>
Expand Down Expand Up @@ -764,10 +764,10 @@ <h6 class="always-index" id="level-6-header-outside-headingsearchindex-with-alwa
</nav>
</nav>

</nav>
</overlay-source>

</div>
</nav>
</overlay-source>
</div>
<div>
<footer>
Expand Down
8 changes: 1 addition & 7 deletions packages/cli/test/functional/test_site/expected/index.page-vue-render.js
View file
Open in desktop

Large diffs are not rendered by default.

12 changes: 6 additions & 6 deletions packages/cli/test/functional/test_site/expected/sub_site/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -53,7 +53,7 @@
<p><strong>Relative Link Test</strong> This is a relative Intra-Site link in a layout (see <a href="/test_site/index.html#heading-with-hidden-keyword">link</a>)</p>
</div>
<div id="flex-body">
<nav id="site-nav" class="fixed-header-padding">
<overlay-source id="site-nav" class="fixed-header-padding" tag-name="nav" to="site-nav">
<div class="site-nav-top">
<div class="font-weight-bold mb-2" style="font-size: 1.25rem;">
<div>
Expand All @@ -64,7 +64,7 @@ <h2 id="default-layout"><span id="default-layout" class="anchor"></span>Default
<div class="nav-component slim-scroll">
<div>
<site-nav>
<ul class="site-nav-list site-nav-list-root">
<overlay-source class="site-nav-list site-nav-list-root" tag-name="ul" to="mb-site-nav">
<li>
<div class="site-nav-default-list-item site-nav-list-item-0" onclick="handleSiteNavClick(this)"><a href="/test_site/index.html">Home 🏠</a></div>
</li>
Expand Down Expand Up @@ -185,11 +185,11 @@ <h3 id="testing-site-nav"><span id="testing-site-nav" class="anchor"></span>Test
</li>
</ul>
</li>
</ul>
</overlay-source>
</site-nav>
</div>
</div>
</nav>
</overlay-source>
<div id="content-wrapper" class="fixed-header-padding">
<p>This is a page from another Markbind site.</p>
<h2 id="feature-list"><span id="feature-list" class="anchor"></span>Feature list<a class="fa fa-anchor" href="#feature-list" onclick="event.stopPropagation()"></a></h2>
Expand All @@ -208,11 +208,11 @@ <h2 id="feature-list"><span id="feature-list" class="anchor"></span>Feature list
</div>
<i class="fa fa-arrow-circle-up fa-lg d-print-none" id="scroll-top-button" onclick="handleScrollTop()" aria-hidden="true"></i>
</div>
<nav id="page-nav" class="fixed-header-padding">
<overlay-source id="page-nav" class="fixed-header-padding" tag-name="nav" to="page-nav">
<div class="nav-component slim-scroll">

</div>
</nav>
</overlay-source>
</div>
<div>
<footer>
Expand Down
8 changes: 1 addition & 7 deletions packages/cli/test/functional/test_site/expected/sub_site/index.page-vue-render.js
View file
Open in desktop

Large diffs are not rendered by default.

12 changes: 6 additions & 6 deletions packages/cli/test/functional/test_site/expected/sub_site/nested_sub_site/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -53,7 +53,7 @@
<p><strong>Relative Link Test</strong> This is a relative Intra-Site link in a layout (see <a href="/test_site/index.html#heading-with-hidden-keyword">link</a>)</p>
</div>
<div id="flex-body">
<nav id="site-nav" class="fixed-header-padding">
<overlay-source id="site-nav" class="fixed-header-padding" tag-name="nav" to="site-nav">
<div class="site-nav-top">
<div class="font-weight-bold mb-2" style="font-size: 1.25rem;">
<div>
Expand All @@ -64,7 +64,7 @@ <h2 id="default-layout"><span id="default-layout" class="anchor"></span>Default
<div class="nav-component slim-scroll">
<div>
<site-nav>
<ul class="site-nav-list site-nav-list-root">
<overlay-source class="site-nav-list site-nav-list-root" tag-name="ul" to="mb-site-nav">
<li>
<div class="site-nav-default-list-item site-nav-list-item-0" onclick="handleSiteNavClick(this)"><a href="/test_site/index.html">Home 🏠</a></div>
</li>
Expand Down Expand Up @@ -185,11 +185,11 @@ <h3 id="testing-site-nav"><span id="testing-site-nav" class="anchor"></span>Test
</li>
</ul>
</li>
</ul>
</overlay-source>
</site-nav>
</div>
</div>
</nav>
</overlay-source>
<div id="content-wrapper" class="fixed-header-padding">
<p><strong>baseUrl in a nested sub-site should correctly evaluate to the nested sub-site</strong></p>
<p>The base url in the nested_sub_site is /test_site/sub_site/nested_sub_site.</p>
Expand All @@ -199,11 +199,11 @@ <h3 id="testing-site-nav"><span id="testing-site-nav" class="anchor"></span>Test
</div>
<i class="fa fa-arrow-circle-up fa-lg d-print-none" id="scroll-top-button" onclick="handleScrollTop()" aria-hidden="true"></i>
</div>
<nav id="page-nav" class="fixed-header-padding">
<overlay-source id="page-nav" class="fixed-header-padding" tag-name="nav" to="page-nav">
<div class="nav-component slim-scroll">

</div>
</nav>
</overlay-source>
</div>
<div>
<footer>
Expand Down
8 changes: 1 addition & 7 deletions .../cli/test/functional/test_site/expected/sub_site/nested_sub_site/index.page-vue-render.js
View file
Open in desktop

Large diffs are not rendered by default.

12 changes: 6 additions & 6 deletions ...est/functional/test_site/expected/sub_site/nested_sub_site/testNunjucksPathResolving.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -53,7 +53,7 @@
<p><strong>Relative Link Test</strong> This is a relative Intra-Site link in a layout (see <a href="/test_site/index.html#heading-with-hidden-keyword">link</a>)</p>
</div>
<div id="flex-body">
<nav id="site-nav" class="fixed-header-padding">
<overlay-source id="site-nav" class="fixed-header-padding" tag-name="nav" to="site-nav">
<div class="site-nav-top">
<div class="font-weight-bold mb-2" style="font-size: 1.25rem;">
<div>
Expand All @@ -64,7 +64,7 @@ <h2 id="default-layout"><span id="default-layout" class="anchor"></span>Default
<div class="nav-component slim-scroll">
<div>
<site-nav>
<ul class="site-nav-list site-nav-list-root">
<overlay-source class="site-nav-list site-nav-list-root" tag-name="ul" to="mb-site-nav">
<li>
<div class="site-nav-default-list-item site-nav-list-item-0" onclick="handleSiteNavClick(this)"><a href="/test_site/index.html">Home 🏠</a></div>
</li>
Expand Down Expand Up @@ -185,11 +185,11 @@ <h3 id="testing-site-nav"><span id="testing-site-nav" class="anchor"></span>Test
</li>
</ul>
</li>
</ul>
</overlay-source>
</site-nav>
</div>
</div>
</nav>
</overlay-source>
<div id="content-wrapper" class="fixed-header-padding">
<p>Test for nunjucks' various functions that use a path.
By design, nunjucks' relative paths resolve from the configured template root directory.</p>
Expand All @@ -204,11 +204,11 @@ <h3 id="testing-site-nav"><span id="testing-site-nav" class="anchor"></span>Test
<hr>
<i class="fa fa-arrow-circle-up fa-lg d-print-none" id="scroll-top-button" onclick="handleScrollTop()" aria-hidden="true"></i>
</div>
<nav id="page-nav" class="fixed-header-padding">
<overlay-source id="page-nav" class="fixed-header-padding" tag-name="nav" to="page-nav">
<div class="nav-component slim-scroll">

</div>
</nav>
</overlay-source>
</div>
<div>
<footer>
Expand Down
Loading