Edit top app bar

Begin to make it into a short app bar

assets/global.css

@@ -52,9 +52,6 @@ body {
     overflow: auto;
 }
 
-.app-bar {
-    position: absolute;
-}
 .main-content, footer {
     margin: 20px;
 }

assets/global.js

@@ -8,7 +8,7 @@ $(document).ready(function() {
         $(".mdc-top-app-bar").load("/page-inserts/top-app-bar.html", function(){
             // 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.setScrollTarget(document.getElementById('main-content'));
             mdc_top_app_bar.listen('MDCTopAppBar:nav', () => {
                 drawer.open = !drawer.open;
             });

computer-science-blog/index.html

@@ -68,7 +68,7 @@
         <div class="mdc-drawer-scrim"></div>
 
         <div class="mdc-drawer-app-content">
-            <header class="mdc-top-app-bar app-bar" id="app-bar"></header>
+            <header class="mdc-top-app-bar app-bar mdc-top-app-bar--short" id="app-bar"></header>
 
             <main class="main-content" id="main-content">
                <div class="mdc-top-app-bar--fixed-adjust">