diff --git a/src/app/app.component.html b/src/app/app.component.html index 549dff4987b5846b5d1f593d9236935617653af0..8a1b870615f7333a902854337b434d895d530801 100644 --- a/src/app/app.component.html +++ b/src/app/app.component.html @@ -12,7 +12,7 @@ <a class="navbar-brand"></a> <!-- calculators list as a dropdown menu--> - <div [hidden]="tabsFitInNavbar"> + <div [hidden]="tabsFitInNavbar" id="dropdown-calc-container"> <button *ngIf="! currentCalc" mat-button [matMenuTriggerFor]="menu" color="primary" class="calculators-menu-title"> <mat-icon class="dropdown-icon">arrow_drop_down</mat-icon> @@ -103,12 +103,6 @@ </mat-sidenav> <mat-sidenav-content class="sidenav-content" fxFlexFill> - <!-- chargement des calculettes --> - <div appLoadCalcDialogAnchor></div> - - <!-- sauvegarde des calculettes --> - <div appSaveCalcDialogAnchor></div> - <div class="container-fluid"> <div class="row"> <div class="col-12"> diff --git a/src/app/app.component.scss b/src/app/app.component.scss index ba519adf7763a11eca19594b3094521de8827428..55d5653c850b0bff8212712d522887452d5f9041 100644 --- a/src/app/app.component.scss +++ b/src/app/app.component.scss @@ -37,6 +37,11 @@ button:focus { width: 100%; } +#dropdown-calc-container { + width: 100%; + padding-right: 42px; +} + .calculator-button, .calculators-menu-title, .calculator-menu-item { .calc-name { @@ -90,8 +95,9 @@ button:focus { .calculators-menu-title { background-color: white; - width: 360px; // minimal screen width supported: 480 margin-top: 8px; + width: 100%; // adapts to small screens + max-width: 400px; .dropdown-icon { float: right;