diff --git a/src/app/degree-planner/degree-planner.component.html b/src/app/degree-planner/degree-planner.component.html index 91f0a5bc750302b5b77f43b10a1350f2ef56cb98..7ee158f8839a73f3aabc10021f0f8c0620d59128 100644 --- a/src/app/degree-planner/degree-planner.component.html +++ b/src/app/degree-planner/degree-planner.component.html @@ -30,10 +30,10 @@ </mat-form-field> </div> <div fxFlex="20"><button mat-button class="btn-primary">Check Plan (DARS)</button></div> - <div fxFlex><button id="menu-toggle-btn" mat-button (click)="sidenav.toggle()"> + <button id="menu-toggle-btn" mat-button (click)="sidenav.toggle()"> <i *ngIf="sidenav.opened" class="material-icons">chevron_right</i> <i *ngIf="!sidenav.opened" class="material-icons">chevron_left</i> - </button></div> + </button> </div> <div fxLayout="column" fxLayoutGap="20px" fxLayoutAlign="start stretch" style="margin: 24px"> diff --git a/src/app/degree-planner/degree-planner.component.scss b/src/app/degree-planner/degree-planner.component.scss index 41545d8ea0929088b2726253f6418627eeafb14a..f662b5b21ae2aa6d0fa4f4d3360c97ddc062cc91 100644 --- a/src/app/degree-planner/degree-planner.component.scss +++ b/src/app/degree-planner/degree-planner.component.scss @@ -16,6 +16,9 @@ mat-sidenav { } #menu-toggle-btn { + position: absolute; + right: 0px; + top: 20px; border-radius: 50% 0 0 50%; padding: 8px; background-color: #F0F0F0; @@ -23,6 +26,9 @@ mat-sidenav { @media screen and (max-width: 600px) { #menu-toggle-btn { + position: relative; + top: 0; + right: 0; border-radius: 50%; padding: 12px; }