From ac733648e588d0dcbd081fe96ec1c7ae745a62e0 Mon Sep 17 00:00:00 2001
From: Phodal Huang <h@phodal.com>
Date: Fri, 3 Apr 2020 21:30:29 +0800
Subject: [PATCH] fix: addd basic scrollbar

---
 src/app/presentation/solution/solution.component.scss  |  1 -
 .../markdown-render/markdown-render.component.html     |  2 +-
 .../markdown-render/markdown-render.component.scss     |  5 +++--
 .../markdown-render/markdown-render.component.ts       | 10 +++++-----
 4 files changed, 9 insertions(+), 9 deletions(-)

diff --git a/src/app/presentation/solution/solution.component.scss b/src/app/presentation/solution/solution.component.scss
index f4f34ccc..761196ab 100644
--- a/src/app/presentation/solution/solution.component.scss
+++ b/src/app/presentation/solution/solution.component.scss
@@ -14,7 +14,6 @@
 .left-drawer {
   width: 15%;
   min-width: 200px;
-  min-height: 100vh;
 
   h2 {
     padding: 20px 0;
diff --git a/src/app/shared/components/markdown-render/markdown-render.component.html b/src/app/shared/components/markdown-render/markdown-render.component.html
index 07686653..3b79536a 100644
--- a/src/app/shared/components/markdown-render/markdown-render.component.html
+++ b/src/app/shared/components/markdown-render/markdown-render.component.html
@@ -11,7 +11,7 @@
 </div>
 
 <div *ngIf="!showToc" class="no-toc-markdown">
-  <ledge-render (scroll)="handleScroll()" [content]="data" *ngIf="data"></ledge-render>
+  <ledge-render [content]="data" *ngIf="data"></ledge-render>
 </div>
 
 <!--Scroll to top-->
diff --git a/src/app/shared/components/markdown-render/markdown-render.component.scss b/src/app/shared/components/markdown-render/markdown-render.component.scss
index a25130cd..acb00653 100644
--- a/src/app/shared/components/markdown-render/markdown-render.component.scss
+++ b/src/app/shared/components/markdown-render/markdown-render.component.scss
@@ -6,10 +6,10 @@
   .left-drawer {
     width: 15%;
     min-width: 120px;
+    min-height: 100vh;
   }
 
   .right-content {
-    height: calc(100vh - 68px);
   }
 }
 
@@ -20,8 +20,9 @@
 
 .sticky {
   position: fixed;
-  overflow: hidden;
+  overflow: scroll;
   z-index: 10;
+  height: calc(100vh - 66px);
 }
 
 .scroll-to-top {
diff --git a/src/app/shared/components/markdown-render/markdown-render.component.ts b/src/app/shared/components/markdown-render/markdown-render.component.ts
index 47c058f0..27b5812f 100644
--- a/src/app/shared/components/markdown-render/markdown-render.component.ts
+++ b/src/app/shared/components/markdown-render/markdown-render.component.ts
@@ -33,7 +33,7 @@ export class MarkdownRenderComponent
   data = '';
 
   @ViewChild('toc', { static: false }) tocEl: ElementRef;
-  @ViewChild('drawerContent', { static: false }) drawerEl: any;
+  @ViewChild('drawerContent', { static: false }) drawerEl: ElementRef;
 
   loading = this.data !== '';
 
@@ -76,8 +76,8 @@ export class MarkdownRenderComponent
   @HostListener('window:scroll', ['$event'])
   handleScroll() {
     let top = 0;
-    if (this.drawerEl) {
-      top = this.drawerEl.elementRef.nativeElement.scrollTop;
+    if (this.drawerEl && this.drawerEl.nativeElement) {
+      top = this.drawerEl.nativeElement.scrollTop;
     }
 
     const windowScroll = window.pageYOffset;
@@ -135,8 +135,8 @@ export class MarkdownRenderComponent
 
   scrollToTop() {
     window.scrollTo({ top: 0, left: 0, behavior: 'smooth' });
-    if (this.drawerEl) {
-      this.drawerEl.elementRef.nativeElement.scrollTop = 0;
+    if (this.drawerEl && this.drawerEl.nativeElement) {
+      this.drawerEl.nativeElement.scrollTop = 0;
     }
   }