fix: addd basic scrollbar

phodal · Apr 3, 2020 · ac73364 · ac73364
1 parent d7f2481
commit ac73364
Show file tree

Hide file tree

Showing 4 changed files with 9 additions and 9 deletions.
diff --git 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
@@ -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
@@ -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
@@ -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;
  }
  }