From 77f37353d48ef8917b60ffc377adeead161a06a5 Mon Sep 17 00:00:00 2001
From: Daniil Tamazlykar <daniiltamazlykar@gmail.com>
Date: Thu, 28 Jun 2018 20:18:29 +0700
Subject: [PATCH] fix(sg): update the width of the autocompletion window for
 icmp codes and types (#1130)

PR Close #961
---
 .../sg-rule-addition-form.component.html                     | 4 ++--
 src/style/app.scss                                           | 5 +++++
 2 files changed, 7 insertions(+), 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
index 7f4b0e8ecd..85897cf9b7 100644
--- 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
index 2e3b4c8213..c4904172e5 100644
--- 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;
+}