me/portfolio
Archived
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Make modal drawer work

Browse Source
This commit is contained in:
Matthew Grove
2018-11-13 20:18:31 +00:00
parent 967a5dcf5c
commit 6cf8113d63
3 changed files with 11 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
assets/global.js
View File

@@ -2,20 +2,14 @@ $(document).ready(function(){
// include navbar
$(".navbar-insert").load("/page-inserts/navbar.html", function(){
// initiate MDC drawer
// const drawer = new mdc.drawer.MDCDrawer.attachTo(document.querySelector('.mdc-drawer'));
const drawer = new mdc.drawer.MDCDrawer.attachTo($(".mdc-drawer"));
const topAppBar = new mdc.topAppBar.MDCTopAppBar.attachTo(document.getElementById('app-bar'));
topAppBar.listen('MDCTopAppBar:nav', () => {
drawer.open = !drawer.open;
});
const drawer = new mdc.drawer.MDCDrawer.attachTo(document.querySelector('.mdc-drawer'));
// initiate MDC top app bar
// const mdc_top_app_bar = new mdc.topAppBar.MDCTopAppBar.attachTo(document.querySelector('.mdc-top-app-bar'));
// mdc_top_app_bar.setScrollTarget(document.getElementById('main-content'));
// mdc_top_app_bar.listen('MDCTopAppBar:nav', () => {
// drawer.open = !drawer.open;
// });
const mdc_top_app_bar = new mdc.topAppBar.MDCTopAppBar.attachTo(document.querySelector('.mdc-top-app-bar'));
mdc_top_app_bar.setScrollTarget(document.getElementById('main-content'));
mdc_top_app_bar.listen('MDCTopAppBar:nav', () => {
drawer.open = !drawer.open;
});
// include source code link
$(".source-code-link").load("/page-inserts/source-code-link.html");

2
luhn-algorithm/index.html
View File

@@ -45,6 +45,8 @@
<!-- content of navbar is included via jQuery -->
<aside class="navbar-insert mdc-drawer mdc-drawer--modal"></aside>
<div class="mdc-drawer-scrim"></div>
<div class="mdc-drawer-app-content">
<header class="mdc-top-app-bar app-bar" id="app-bar">
<div class="mdc-top-app-bar__row">

4
page-inserts/navbar.html
View File

@@ -1,8 +1,8 @@
<div class="mdc-drawer__content">
<nav class="mdc-list">
<div class="mdc-list">
<a class="mdc-list-item" href="/luhn-algorithm/">
<i class="material-icons mdc-list-item__graphic" aria-hidden="true">credit_card</i>
<span class="mdc-list-item__text">Luhn Algorithm</span>
</a>
</nav>
</div>
</div>