fix(sg): update the width of the autocompletion window for icmp codes…

… and types (#1130) PR Close #961
bwsw · Jun 28, 2018 · 77f3735 · 77f3735
1 parent 239bb6a
commit 77f3735
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 2 deletions.
diff --git a/src/app/security-group/components/sg-rule-addition-form/sg-rule-addition-form.component.html b/src/app/security-group/components/sg-rule-addition-form/sg-rule-addition-form.component.html
@@ -81,7 +81,7 @@
       <mat-error>
         {{ 'SECURITY_GROUP_PAGE.RULES.ENTER_VALID_TYPE' | translate }}
       </mat-error>
-      <mat-autocomplete #icmpTypesAuto="matAutocomplete">
+      <mat-autocomplete #icmpTypesAuto="matAutocomplete" class="icmp-autocomplete-width">
         <mat-option *ngFor="let icmp of filteredIcmpTypes" [value]="icmp.type">
           [{{ icmp.type }}] {{ getIcmpTypeTranslationToken(icmp.type) | translate }}
         </mat-option>
@@ -99,7 +99,7 @@
       <mat-error>
         {{ 'SECURITY_GROUP_PAGE.RULES.ENTER_VALID_CODE' | translate }}
       </mat-error>
-      <mat-autocomplete #icmpCodesAuto="matAutocomplete">
+      <mat-autocomplete #icmpCodesAuto="matAutocomplete" class="icmp-autocomplete-width">
         <mat-option *ngFor="let codes of filteredIcmpCodes" [value]="codes">
           [{{ codes }}] {{ getIcmpCodeTranslationToken(+icmpTypeField.value, codes) | translate }}
         </mat-option>

diff --git a/src/style/app.scss b/src/style/app.scss
@@ -472,3 +472,8 @@ h3 {
 .mat-header-row, .mat-row {
   height: 0;
 }
+
+.icmp-autocomplete-width {
+  width: 294px;
+  left: -72px;
+}