Fix #113 sélecteur de calculette trop épais

src/app/app.component.html

@@ -11,7 +11,7 @@
     <!-- calculators list as a dropdown menu-->
     <div [hidden]="tabsFitInNavbar" id="dropdown-calc-container">
 
-        <button *ngIf="! currentCalc" mat-button [matMenuTriggerFor]="menu" color="primary" class="calculators-menu-title">
+        <button *ngIf="! currentCalc" mat-button [matMenuTriggerFor]="menu" color="primary" class="calculators-menu-title no-calc-type">
           <mat-icon class="dropdown-icon">arrow_drop_down</mat-icon>
           <span class="calc-name">
             {{ uitextSelectCalc }}

src/app/app.component.scss

@@ -129,19 +129,35 @@ button:focus {
 
 .calculators-menu-title {
     background-color: rgb(250, 250, 250);
-    margin-top: 8px;
+    // margin-top: 8px;
+    margin-top: 14px;
+    height: 38px;
+
     width: 100%; // adapts to small screens
-    max-width: 400px;
+    max-width: 248px; // designed for 360px displays
 
     .dropdown-icon {
         float: right;
         transform: scale(2);
-        margin-top: 8px;
+        margin-top: 6px;
         margin-left: 10px;
     }
 
+    .calc-name {
+        line-height: 24px;
+    }
+
     .calc-type {
         color: #777;
+        line-height: 34px;
+    }
+
+    &.no-calc-type {
+        margin-top: 1px;
+
+        .dropdown-icon {
+            margin-top: 0;
+        }
     }
 }